/**
 * CSS Bundle: single
 * Generated: 2026-05-31 11:36:04
 * Files: 10
 * Signature: 4c165db47eaf9c02d8c8fc439f8d949af48b66c4
 */

/* === page-single.css === */
/* ==========================================================================
   SINGLE POST & PAGE STYLES
   ========================================================================== */

/* ==========================================================================
   POST HEADER
   ========================================================================== */

/* --- Title Section --- */
.si-title-top {
    display: flex;
    flex-direction: column;
    /*padding-top: 20px;*/
    font-size: 1.8rem;
}

.si-title-top h1 {
    font-weight: 900;
    font-size: 1.8rem;
    line-height: 1.8;
    margin-bottom: 15px;
}

/* --- Post Meta Information --- */
.si-single-top {
    display: block;
    margin: 15px auto;
    font-size: 1rem;
    min-width: 300px;
    min-height: 24px;
    padding-left: 20px;
    border-left: 5px solid #0073aa;
    line-height: 1.6;
    color: #333;
    margin-bottom: 24px;
}

body.single.hd-layout-customizable .si-single-top {
    font-size: var(--hd-meta-font-size, 1rem);
}

@media (max-width: 1180px) {
    body.single.hd-layout-customizable .si-single-top {
        font-size: var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 1rem));
    }
}

@media (max-width: 768px) {
    body.single.hd-layout-customizable .si-single-top {
        font-size: var(--hd-meta-font-size-mobile, var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 1rem)));
    }
}

.si-single-top .byline {
    display: flex;
    align-items: center;
    margin-bottom: 4px;
}

.si-single-top .si-single-top-a>.byline:last-child {
    margin-bottom: 0;
}

.si-single-top .byline>i {
    flex-shrink: 0;
    width: 22px;
    text-align: center;
    color: #777;
}

.si-single-top .byline>.meta-content {
    display: inline-block;
}

.si-single-top .byline a {
    color: #1a0dab;
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: border-color 0.2s ease;
}

.si-single-top .byline a:hover {
    border-bottom-color: #1a0dab;
}

.si-single-top>div {
    width: auto;
    max-height: 220px;
}

.si-single-top-s {
    padding-top: 20px;
}

/* --- Post Meta Typography --- */
.arcs-meta-t2 {
    width: 100%;
    margin: 15px auto;
    border-radius: 2px;
    word-break: break-all;
}

.arcs-meta-t2-1 {
    margin: 40px auto 0;
    line-height: 33px;
    text-decoration: none;
    text-align: justify;
    word-break: break-all;
    word-wrap: break-word;
}

.arcs-meta-t2-1 a {
    margin: 0 10px 10px 0;
    padding: 5px;
    border: 1px solid #ddd;
    text-decoration: none;
    line-height: 2.2;
    border-radius: 0.3em;
    font-size: 1rem;
    transition: all 0.3s ease;
}

body.single #si-single-content>.arcs-meta-t2 {
    margin-block: 12px 18px;
}

body.single #si-single-content>.arcs-meta-t2>.arcs-meta-t2-1 {
    margin-block-start: 0;
}

@media (max-width: 768px) {
    body.single #si-single-content>.arcs-meta-t2 {
        margin-block: 10px 16px;
    }
}

/* ==========================================================================
   POST CONTENT
   ========================================================================== */

#si-single-content {
    width: 100%;
    margin: 0 auto;
    text-align: justify;
    font-size: 1.1rem;
    word-break: break-all;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

#si-single-content::after {
    content: "";
    display: block;
    clear: both;
}

#si-single-content p {
    clear: both;
    line-height: 1.8;
}

#si-single-content strong {
    color: #000;
    font-weight: 700;
}

#si-single-content img {
    max-width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
    border: 1px solid #eee;
}

#si-single-content a {
    height: auto;
    color: #0086E6;
    transition: color 0.3s ease;
}

#si-single-content a:hover {
    text-decoration: none;
    color: #E60012;
}

#si-single-content>p {
    line-height: 1.8;
}

#si-single-content p>img {
    display: block;
    margin-right: -30px;
    margin-left: -30px;
}

#si-single-content ul {
    margin: 25px 10px 40px 40px;
    font-size: 1.15rem;
}

#si-single-content ol {
    margin: 0 0 0 40px;
}

#si-single-content li {
    font-size: 1.1rem;
    margin: 10px auto;
    padding-top: 0;
    padding-bottom: 0;
    color: #565656;
    letter-spacing: 2px;
    text-align: left;
    list-style: square;
}

#si-single-content h2 {
    min-width: 1px;
    min-height: 1px;
    clear: both;
    margin: 30px 0 20px;
    padding: 10px 10px 10px 15px;
    background: #333;
    color: #f3f3f3;
}

#si-single-content h3 {
    color: #000;
    margin: 35px 0 20px;
    padding: 15px 15px 0 0;
    clear: both;
}

/* ==========================================================================
   FEATURED IMAGE
   ========================================================================== */

#arcs-single-filter {
    position: relative;
    width: 100%;
    margin: 0 auto 15px;
    padding: 0;
    text-align: center;
    max-width: 1200px;
}

#arcs-single-filter img {
    min-width: 100px;
    min-height: 100px;
}

#arcs-single-filter figure img {
    width: 100%;
    height: auto;
    vertical-align: top;
}

#arcs-single-filter figure figcaption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 10px;
    background: rgba(0, 0, 0, 0.55);
    color: #e3e4e5;
    font-weight: 700;
    font-size: 0.75rem;
    line-height: 1.45;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
    table-layout: fixed;
    box-sizing: border-box;
    max-width: 100%;
}

#arcs-single-filter .arcs-single-figcaption {
    margin: 0 auto;
    text-align: right;
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: break-word;
}

#arcs-single-filter .arcs-single-figcaption a {
    color: #e3e4e5;
    text-decoration: underline;
    overflow-wrap: anywhere;
    word-break: break-all;
}

#arcs-single-filter .arcs-single-covertext {
    position: absolute;
    top: 0;
    width: 100%;
    margin: auto auto auto 0;
    padding: 0;
    font-size: 0.938rem;
}

#arcs-single-filter .arcs-single-covertextnews-post-left {
    float: left;
    margin: 10px auto auto 10px;
    padding: 5px;
    background: #e35553;
    color: #fff;
    text-align: center;
}

#arcs-single-filter .arcs-single-covertextnews-post-right {
    float: right;
    margin: 10px 10px auto auto;
    padding: 5px;
    background: #ff7f50;
    color: #fff;
    text-align: center;
}

#arcs-single-filter.crop-4-3 {
    background: #eef7ff;
}

/* Single 2-3 - visual inspired hero subset */
.si-23-visual-inspired #arcs-single-filter.si-23-visual-media figure {
    position: relative;
    overflow: hidden;
    /*border-radius: 16px;*/
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media figure.si-featured-media-figure--has-caption.si-featured-media-figure--caption-overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 35%, rgba(0, 0, 0, 0.45) 100%);
    pointer-events: none;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media img {
    transition: transform 1.2s ease;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full {
    width: 100%;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>picture,
.si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>a {
    display: block;
    width: 100%;
    height: 100%;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>picture>img,
.si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>a>img,
.si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>img {
    width: 100%;
    height: 100%;
    max-width: none;
    max-height: none;
    object-fit: contain;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media:hover img {
    transform: none;
}

/* Keep single featured images stable even if other modules inject hover zoom rules. */
#arcs-single-filter:hover img {
    transform: none;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media figcaption {
    z-index: 2;
}

#arcs-single-filter figure.si-featured-media-figure--caption-below figcaption,
#arcs-single-filter figure.si-featured-media-figure--caption-minimal figcaption,
#arcs-single-filter figcaption.si-featured-caption--below,
#arcs-single-filter figcaption.si-featured-caption--minimal {
    position: static;
    right: auto;
    bottom: auto;
    left: auto;
}

#arcs-single-filter figure.si-featured-media-figure--caption-below figcaption,
#arcs-single-filter figcaption.si-featured-caption--below {
    padding: 10px 12px;
    background: #f6f7f7;
    color: #333;
    border: 1px solid #e5e7eb;
    border-top: 0;
}

#arcs-single-filter figure.si-featured-media-figure--caption-below .arcs-single-figcaption,
#arcs-single-filter figure.si-featured-media-figure--caption-minimal .arcs-single-figcaption,
#arcs-single-filter figcaption.si-featured-caption--below .arcs-single-figcaption,
#arcs-single-filter figcaption.si-featured-caption--minimal .arcs-single-figcaption {
    text-align: left;
}

#arcs-single-filter figure.si-featured-media-figure--caption-below .arcs-single-figcaption a,
#arcs-single-filter figure.si-featured-media-figure--caption-minimal .arcs-single-figcaption a,
#arcs-single-filter figcaption.si-featured-caption--below .arcs-single-figcaption a,
#arcs-single-filter figcaption.si-featured-caption--minimal .arcs-single-figcaption a {
    color: inherit;
}

#arcs-single-filter figure.si-featured-media-figure--caption-minimal figcaption,
#arcs-single-filter figcaption.si-featured-caption--minimal {
    padding: 8px 2px 0;
    background: transparent;
    color: #666;
    font-weight: 500;
}

/* Global layout customization (all post layouts) */
/* width tokens -> CSS variables (cache-friendly: class-based, no inline style) */
body.single.hd-layout-customizable.hd-fw-800 {
    --hd-featured-image-max-width: 800px;
}

body.single.hd-layout-customizable.hd-fw-820 {
    --hd-featured-image-max-width: 820px;
}

body.single.hd-layout-customizable.hd-fw-840 {
    --hd-featured-image-max-width: 840px;
}

body.single.hd-layout-customizable.hd-fw-860 {
    --hd-featured-image-max-width: 860px;
}

body.single.hd-layout-customizable.hd-fw-880 {
    --hd-featured-image-max-width: 880px;
}

body.single.hd-layout-customizable.hd-fw-900 {
    --hd-featured-image-max-width: 900px;
}

body.single.hd-layout-customizable.hd-fw-920 {
    --hd-featured-image-max-width: 920px;
}

body.single.hd-layout-customizable.hd-fw-940 {
    --hd-featured-image-max-width: 940px;
}

body.single.hd-layout-customizable.hd-fw-960 {
    --hd-featured-image-max-width: 960px;
}

body.single.hd-layout-customizable.hd-fw-980 {
    --hd-featured-image-max-width: 980px;
}

body.single.hd-layout-customizable.hd-fw-1000 {
    --hd-featured-image-max-width: 1000px;
}

body.single.hd-layout-customizable.hd-fw-1020 {
    --hd-featured-image-max-width: 1020px;
}

body.single.hd-layout-customizable.hd-fw-1040 {
    --hd-featured-image-max-width: 1040px;
}

body.single.hd-layout-customizable.hd-fw-1060 {
    --hd-featured-image-max-width: 1060px;
}

body.single.hd-layout-customizable.hd-fw-1080 {
    --hd-featured-image-max-width: 1080px;
}

body.single.hd-layout-customizable.hd-fw-1100 {
    --hd-featured-image-max-width: 1100px;
}

body.single.hd-layout-customizable.hd-fw-1120 {
    --hd-featured-image-max-width: 1120px;
}

body.single.hd-layout-customizable.hd-fw-1140 {
    --hd-featured-image-max-width: 1140px;
}

body.single.hd-layout-customizable.hd-fw-1160 {
    --hd-featured-image-max-width: 1160px;
}

body.single.hd-layout-customizable.hd-fw-1180 {
    --hd-featured-image-max-width: 1180px;
}

body.single.hd-layout-customizable.hd-fw-1200 {
    --hd-featured-image-max-width: 1200px;
}

body.single.hd-layout-customizable.hd-fw-1220 {
    --hd-featured-image-max-width: 1220px;
}

body.single.hd-layout-customizable.hd-fw-1240 {
    --hd-featured-image-max-width: 1240px;
}

body.single.hd-layout-customizable.hd-fw-1260 {
    --hd-featured-image-max-width: 1260px;
}

body.single.hd-layout-customizable.hd-fw-1280 {
    --hd-featured-image-max-width: 1280px;
}

body.single.hd-layout-customizable.hd-fw-1300 {
    --hd-featured-image-max-width: 1300px;
}

body.single.hd-layout-customizable.hd-fw-1320 {
    --hd-featured-image-max-width: 1320px;
}

body.single.hd-layout-customizable.hd-fw-1340 {
    --hd-featured-image-max-width: 1340px;
}

body.single.hd-layout-customizable.hd-fw-1360 {
    --hd-featured-image-max-width: 1360px;
}

body.single.hd-layout-customizable.hd-fw-1380 {
    --hd-featured-image-max-width: 1380px;
}

body.single.hd-layout-customizable.hd-fw-1400 {
    --hd-featured-image-max-width: 1400px;
}

body.single.hd-layout-customizable.hd-fw-1420 {
    --hd-featured-image-max-width: 1420px;
}

body.single.hd-layout-customizable.hd-fw-1440 {
    --hd-featured-image-max-width: 1440px;
}

body.single.hd-layout-customizable.hd-fw-1460 {
    --hd-featured-image-max-width: 1460px;
}

body.single.hd-layout-customizable.hd-fw-1480 {
    --hd-featured-image-max-width: 1480px;
}

body.single.hd-layout-customizable.hd-fw-1500 {
    --hd-featured-image-max-width: 1500px;
}

body.single.hd-layout-customizable.hd-fw-1520 {
    --hd-featured-image-max-width: 1520px;
}

body.single.hd-layout-customizable.hd-fw-1540 {
    --hd-featured-image-max-width: 1540px;
}

body.single.hd-layout-customizable.hd-fw-1560 {
    --hd-featured-image-max-width: 1560px;
}

body.single.hd-layout-customizable.hd-fw-1580 {
    --hd-featured-image-max-width: 1580px;
}

body.single.hd-layout-customizable.hd-fw-1600 {
    --hd-featured-image-max-width: 1600px;
}

body.single.hd-layout-customizable.hd-fw-1620 {
    --hd-featured-image-max-width: 1620px;
}

body.single.hd-layout-customizable.hd-fw-1640 {
    --hd-featured-image-max-width: 1640px;
}

body.single.hd-layout-customizable.hd-fw-1660 {
    --hd-featured-image-max-width: 1660px;
}

body.single.hd-layout-customizable.hd-fw-1680 {
    --hd-featured-image-max-width: 1680px;
}

body.single.hd-layout-customizable.hd-fw-1700 {
    --hd-featured-image-max-width: 1700px;
}

body.single.hd-layout-customizable.hd-fw-1720 {
    --hd-featured-image-max-width: 1720px;
}

body.single.hd-layout-customizable.hd-fw-1740 {
    --hd-featured-image-max-width: 1740px;
}

body.single.hd-layout-customizable.hd-fw-1760 {
    --hd-featured-image-max-width: 1760px;
}

body.single.hd-layout-customizable.hd-fw-1780 {
    --hd-featured-image-max-width: 1780px;
}

body.single.hd-layout-customizable.hd-fw-1800 {
    --hd-featured-image-max-width: 1800px;
}

body.single.hd-layout-customizable.hd-fw-1820 {
    --hd-featured-image-max-width: 1820px;
}

body.single.hd-layout-customizable.hd-fw-1840 {
    --hd-featured-image-max-width: 1840px;
}

body.single.hd-layout-customizable.hd-fw-1860 {
    --hd-featured-image-max-width: 1860px;
}

body.single.hd-layout-customizable.hd-fw-1880 {
    --hd-featured-image-max-width: 1880px;
}

body.single.hd-layout-customizable.hd-fw-1900 {
    --hd-featured-image-max-width: 1900px;
}

body.single.hd-layout-customizable.hd-fw-1920 {
    --hd-featured-image-max-width: 1920px;
}

body.single.hd-layout-customizable.hd-fw-1940 {
    --hd-featured-image-max-width: 1940px;
}

body.single.hd-layout-customizable.hd-fw-1960 {
    --hd-featured-image-max-width: 1960px;
}

body.single.hd-layout-customizable.hd-fw-1980 {
    --hd-featured-image-max-width: 1980px;
}

body.single.hd-layout-customizable.hd-fw-2000 {
    --hd-featured-image-max-width: 2000px;
}

body.single.hd-layout-customizable.hd-fw-full {
    --hd-featured-image-max-width: 100vw;
}

body.single.hd-layout-customizable.hd-tw-600 {
    --hd-title-max-width: 600px;
}

body.single.hd-layout-customizable.hd-tw-620 {
    --hd-title-max-width: 620px;
}

body.single.hd-layout-customizable.hd-tw-640 {
    --hd-title-max-width: 640px;
}

body.single.hd-layout-customizable.hd-tw-660 {
    --hd-title-max-width: 660px;
}

body.single.hd-layout-customizable.hd-tw-680 {
    --hd-title-max-width: 680px;
}

body.single.hd-layout-customizable.hd-tw-700 {
    --hd-title-max-width: 700px;
}

body.single.hd-layout-customizable.hd-tw-720 {
    --hd-title-max-width: 720px;
}

body.single.hd-layout-customizable.hd-tw-740 {
    --hd-title-max-width: 740px;
}

body.single.hd-layout-customizable.hd-tw-760 {
    --hd-title-max-width: 760px;
}

body.single.hd-layout-customizable.hd-tw-780 {
    --hd-title-max-width: 780px;
}

body.single.hd-layout-customizable.hd-tw-800 {
    --hd-title-max-width: 800px;
}

body.single.hd-layout-customizable.hd-tw-820 {
    --hd-title-max-width: 820px;
}

body.single.hd-layout-customizable.hd-tw-840 {
    --hd-title-max-width: 840px;
}

body.single.hd-layout-customizable.hd-tw-860 {
    --hd-title-max-width: 860px;
}

body.single.hd-layout-customizable.hd-tw-880 {
    --hd-title-max-width: 880px;
}

body.single.hd-layout-customizable.hd-tw-900 {
    --hd-title-max-width: 900px;
}

body.single.hd-layout-customizable.hd-tw-920 {
    --hd-title-max-width: 920px;
}

body.single.hd-layout-customizable.hd-tw-940 {
    --hd-title-max-width: 940px;
}

body.single.hd-layout-customizable.hd-tw-960 {
    --hd-title-max-width: 960px;
}

body.single.hd-layout-customizable.hd-tw-980 {
    --hd-title-max-width: 980px;
}

body.single.hd-layout-customizable.hd-tw-1000 {
    --hd-title-max-width: 1000px;
}

body.single.hd-layout-customizable.hd-tw-1020 {
    --hd-title-max-width: 1020px;
}

body.single.hd-layout-customizable.hd-tw-1040 {
    --hd-title-max-width: 1040px;
}

body.single.hd-layout-customizable.hd-tw-1060 {
    --hd-title-max-width: 1060px;
}

body.single.hd-layout-customizable.hd-tw-1080 {
    --hd-title-max-width: 1080px;
}

body.single.hd-layout-customizable.hd-tw-1100 {
    --hd-title-max-width: 1100px;
}

body.single.hd-layout-customizable.hd-tw-1120 {
    --hd-title-max-width: 1120px;
}

body.single.hd-layout-customizable.hd-tw-1140 {
    --hd-title-max-width: 1140px;
}

body.single.hd-layout-customizable.hd-tw-1160 {
    --hd-title-max-width: 1160px;
}

body.single.hd-layout-customizable.hd-tw-1180 {
    --hd-title-max-width: 1180px;
}

body.single.hd-layout-customizable.hd-tw-1200 {
    --hd-title-max-width: 1200px;
}

body.single.hd-layout-customizable.hd-tw-1220 {
    --hd-title-max-width: 1220px;
}

body.single.hd-layout-customizable.hd-tw-1240 {
    --hd-title-max-width: 1240px;
}

body.single.hd-layout-customizable.hd-tw-1260 {
    --hd-title-max-width: 1260px;
}

body.single.hd-layout-customizable.hd-tw-1280 {
    --hd-title-max-width: 1280px;
}

body.single.hd-layout-customizable.hd-tw-1300 {
    --hd-title-max-width: 1300px;
}

body.single.hd-layout-customizable.hd-tw-1320 {
    --hd-title-max-width: 1320px;
}

body.single.hd-layout-customizable.hd-tw-1340 {
    --hd-title-max-width: 1340px;
}

body.single.hd-layout-customizable.hd-tw-1360 {
    --hd-title-max-width: 1360px;
}

body.single.hd-layout-customizable.hd-tw-1380 {
    --hd-title-max-width: 1380px;
}

body.single.hd-layout-customizable.hd-tw-1400 {
    --hd-title-max-width: 1400px;
}

body.single.hd-layout-customizable.hd-tw-1420 {
    --hd-title-max-width: 1420px;
}

body.single.hd-layout-customizable.hd-tw-1440 {
    --hd-title-max-width: 1440px;
}

body.single.hd-layout-customizable.hd-tw-1460 {
    --hd-title-max-width: 1460px;
}

body.single.hd-layout-customizable.hd-tw-1480 {
    --hd-title-max-width: 1480px;
}

body.single.hd-layout-customizable.hd-tw-1500 {
    --hd-title-max-width: 1500px;
}

body.single.hd-layout-customizable.hd-tw-1520 {
    --hd-title-max-width: 1520px;
}

body.single.hd-layout-customizable.hd-tw-1540 {
    --hd-title-max-width: 1540px;
}

body.single.hd-layout-customizable.hd-tw-1560 {
    --hd-title-max-width: 1560px;
}

body.single.hd-layout-customizable.hd-tw-1580 {
    --hd-title-max-width: 1580px;
}

body.single.hd-layout-customizable.hd-tw-1600 {
    --hd-title-max-width: 1600px;
}

body.single.hd-layout-customizable.hd-tw-1620 {
    --hd-title-max-width: 1620px;
}

body.single.hd-layout-customizable.hd-tw-1640 {
    --hd-title-max-width: 1640px;
}

body.single.hd-layout-customizable.hd-tw-1660 {
    --hd-title-max-width: 1660px;
}

body.single.hd-layout-customizable.hd-tw-1680 {
    --hd-title-max-width: 1680px;
}

body.single.hd-layout-customizable.hd-tw-1700 {
    --hd-title-max-width: 1700px;
}

body.single.hd-layout-customizable.hd-tw-1720 {
    --hd-title-max-width: 1720px;
}

body.single.hd-layout-customizable.hd-tw-1740 {
    --hd-title-max-width: 1740px;
}

body.single.hd-layout-customizable.hd-tw-1760 {
    --hd-title-max-width: 1760px;
}

body.single.hd-layout-customizable.hd-tw-1780 {
    --hd-title-max-width: 1780px;
}

body.single.hd-layout-customizable.hd-tw-1800 {
    --hd-title-max-width: 1800px;
}

body.single.hd-layout-customizable.hd-tw-1820 {
    --hd-title-max-width: 1820px;
}

body.single.hd-layout-customizable.hd-tw-1840 {
    --hd-title-max-width: 1840px;
}

body.single.hd-layout-customizable.hd-tw-1860 {
    --hd-title-max-width: 1860px;
}

body.single.hd-layout-customizable.hd-tw-1880 {
    --hd-title-max-width: 1880px;
}

body.single.hd-layout-customizable.hd-tw-1900 {
    --hd-title-max-width: 1900px;
}

body.single.hd-layout-customizable.hd-tw-1920 {
    --hd-title-max-width: 1920px;
}

body.single.hd-layout-customizable.hd-tw-1940 {
    --hd-title-max-width: 1940px;
}

body.single.hd-layout-customizable.hd-tw-1960 {
    --hd-title-max-width: 1960px;
}

body.single.hd-layout-customizable.hd-tw-1980 {
    --hd-title-max-width: 1980px;
}

body.single.hd-layout-customizable.hd-tw-2000 {
    --hd-title-max-width: 2000px;
}

body.single.hd-layout-customizable.hd-mw-600 {
    --hd-meta-max-width: 600px;
}

body.single.hd-layout-customizable.hd-mw-620 {
    --hd-meta-max-width: 620px;
}

body.single.hd-layout-customizable.hd-mw-640 {
    --hd-meta-max-width: 640px;
}

body.single.hd-layout-customizable.hd-mw-660 {
    --hd-meta-max-width: 660px;
}

body.single.hd-layout-customizable.hd-mw-680 {
    --hd-meta-max-width: 680px;
}

body.single.hd-layout-customizable.hd-mw-700 {
    --hd-meta-max-width: 700px;
}

body.single.hd-layout-customizable.hd-mw-720 {
    --hd-meta-max-width: 720px;
}

body.single.hd-layout-customizable.hd-mw-740 {
    --hd-meta-max-width: 740px;
}

body.single.hd-layout-customizable.hd-mw-760 {
    --hd-meta-max-width: 760px;
}

body.single.hd-layout-customizable.hd-mw-780 {
    --hd-meta-max-width: 780px;
}

body.single.hd-layout-customizable.hd-mw-800 {
    --hd-meta-max-width: 800px;
}

body.single.hd-layout-customizable.hd-mw-820 {
    --hd-meta-max-width: 820px;
}

body.single.hd-layout-customizable.hd-mw-840 {
    --hd-meta-max-width: 840px;
}

body.single.hd-layout-customizable.hd-mw-860 {
    --hd-meta-max-width: 860px;
}

body.single.hd-layout-customizable.hd-mw-880 {
    --hd-meta-max-width: 880px;
}

body.single.hd-layout-customizable.hd-mw-900 {
    --hd-meta-max-width: 900px;
}

body.single.hd-layout-customizable.hd-mw-920 {
    --hd-meta-max-width: 920px;
}

body.single.hd-layout-customizable.hd-mw-940 {
    --hd-meta-max-width: 940px;
}

body.single.hd-layout-customizable.hd-mw-960 {
    --hd-meta-max-width: 960px;
}

body.single.hd-layout-customizable.hd-mw-980 {
    --hd-meta-max-width: 980px;
}

body.single.hd-layout-customizable.hd-mw-1000 {
    --hd-meta-max-width: 1000px;
}

body.single.hd-layout-customizable.hd-mw-1020 {
    --hd-meta-max-width: 1020px;
}

body.single.hd-layout-customizable.hd-mw-1040 {
    --hd-meta-max-width: 1040px;
}

body.single.hd-layout-customizable.hd-mw-1060 {
    --hd-meta-max-width: 1060px;
}

body.single.hd-layout-customizable.hd-mw-1080 {
    --hd-meta-max-width: 1080px;
}

body.single.hd-layout-customizable.hd-mw-1100 {
    --hd-meta-max-width: 1100px;
}

body.single.hd-layout-customizable.hd-mw-1120 {
    --hd-meta-max-width: 1120px;
}

body.single.hd-layout-customizable.hd-mw-1140 {
    --hd-meta-max-width: 1140px;
}

body.single.hd-layout-customizable.hd-mw-1160 {
    --hd-meta-max-width: 1160px;
}

body.single.hd-layout-customizable.hd-mw-1180 {
    --hd-meta-max-width: 1180px;
}

body.single.hd-layout-customizable.hd-mw-1200 {
    --hd-meta-max-width: 1200px;
}

body.single.hd-layout-customizable.hd-mw-1220 {
    --hd-meta-max-width: 1220px;
}

body.single.hd-layout-customizable.hd-mw-1240 {
    --hd-meta-max-width: 1240px;
}

body.single.hd-layout-customizable.hd-mw-1260 {
    --hd-meta-max-width: 1260px;
}

body.single.hd-layout-customizable.hd-mw-1280 {
    --hd-meta-max-width: 1280px;
}

body.single.hd-layout-customizable.hd-mw-1300 {
    --hd-meta-max-width: 1300px;
}

body.single.hd-layout-customizable.hd-mw-1320 {
    --hd-meta-max-width: 1320px;
}

body.single.hd-layout-customizable.hd-mw-1340 {
    --hd-meta-max-width: 1340px;
}

body.single.hd-layout-customizable.hd-mw-1360 {
    --hd-meta-max-width: 1360px;
}

body.single.hd-layout-customizable.hd-mw-1380 {
    --hd-meta-max-width: 1380px;
}

body.single.hd-layout-customizable.hd-mw-1400 {
    --hd-meta-max-width: 1400px;
}

body.single.hd-layout-customizable.hd-mw-1420 {
    --hd-meta-max-width: 1420px;
}

body.single.hd-layout-customizable.hd-mw-1440 {
    --hd-meta-max-width: 1440px;
}

body.single.hd-layout-customizable.hd-mw-1460 {
    --hd-meta-max-width: 1460px;
}

body.single.hd-layout-customizable.hd-mw-1480 {
    --hd-meta-max-width: 1480px;
}

body.single.hd-layout-customizable.hd-mw-1500 {
    --hd-meta-max-width: 1500px;
}

body.single.hd-layout-customizable.hd-mw-1520 {
    --hd-meta-max-width: 1520px;
}

body.single.hd-layout-customizable.hd-mw-1540 {
    --hd-meta-max-width: 1540px;
}

body.single.hd-layout-customizable.hd-mw-1560 {
    --hd-meta-max-width: 1560px;
}

body.single.hd-layout-customizable.hd-mw-1580 {
    --hd-meta-max-width: 1580px;
}

body.single.hd-layout-customizable.hd-mw-1600 {
    --hd-meta-max-width: 1600px;
}

body.single.hd-layout-customizable.hd-mw-1620 {
    --hd-meta-max-width: 1620px;
}

body.single.hd-layout-customizable.hd-mw-1640 {
    --hd-meta-max-width: 1640px;
}

body.single.hd-layout-customizable.hd-mw-1660 {
    --hd-meta-max-width: 1660px;
}

body.single.hd-layout-customizable.hd-mw-1680 {
    --hd-meta-max-width: 1680px;
}

body.single.hd-layout-customizable.hd-mw-1700 {
    --hd-meta-max-width: 1700px;
}

body.single.hd-layout-customizable.hd-mw-1720 {
    --hd-meta-max-width: 1720px;
}

body.single.hd-layout-customizable.hd-mw-1740 {
    --hd-meta-max-width: 1740px;
}

body.single.hd-layout-customizable.hd-mw-1760 {
    --hd-meta-max-width: 1760px;
}

body.single.hd-layout-customizable.hd-mw-1780 {
    --hd-meta-max-width: 1780px;
}

body.single.hd-layout-customizable.hd-mw-1800 {
    --hd-meta-max-width: 1800px;
}

body.single.hd-layout-customizable.hd-mw-1820 {
    --hd-meta-max-width: 1820px;
}

body.single.hd-layout-customizable.hd-mw-1840 {
    --hd-meta-max-width: 1840px;
}

body.single.hd-layout-customizable.hd-mw-1860 {
    --hd-meta-max-width: 1860px;
}

body.single.hd-layout-customizable.hd-mw-1880 {
    --hd-meta-max-width: 1880px;
}

body.single.hd-layout-customizable.hd-mw-1900 {
    --hd-meta-max-width: 1900px;
}

body.single.hd-layout-customizable.hd-mw-1920 {
    --hd-meta-max-width: 1920px;
}

body.single.hd-layout-customizable.hd-mw-1940 {
    --hd-meta-max-width: 1940px;
}

body.single.hd-layout-customizable.hd-mw-1960 {
    --hd-meta-max-width: 1960px;
}

body.single.hd-layout-customizable.hd-mw-1980 {
    --hd-meta-max-width: 1980px;
}

body.single.hd-layout-customizable.hd-mw-2000 {
    --hd-meta-max-width: 2000px;
}

body.single.hd-layout-customizable.hd-bw-600 {
    --hd-breadcrumb-max-width: 600px;
}

body.single.hd-layout-customizable.hd-bw-620 {
    --hd-breadcrumb-max-width: 620px;
}

body.single.hd-layout-customizable.hd-bw-640 {
    --hd-breadcrumb-max-width: 640px;
}

body.single.hd-layout-customizable.hd-bw-660 {
    --hd-breadcrumb-max-width: 660px;
}

body.single.hd-layout-customizable.hd-bw-680 {
    --hd-breadcrumb-max-width: 680px;
}

body.single.hd-layout-customizable.hd-bw-700 {
    --hd-breadcrumb-max-width: 700px;
}

body.single.hd-layout-customizable.hd-bw-720 {
    --hd-breadcrumb-max-width: 720px;
}

body.single.hd-layout-customizable.hd-bw-740 {
    --hd-breadcrumb-max-width: 740px;
}

body.single.hd-layout-customizable.hd-bw-760 {
    --hd-breadcrumb-max-width: 760px;
}

body.single.hd-layout-customizable.hd-bw-780 {
    --hd-breadcrumb-max-width: 780px;
}

body.single.hd-layout-customizable.hd-bw-800 {
    --hd-breadcrumb-max-width: 800px;
}

body.single.hd-layout-customizable.hd-bw-820 {
    --hd-breadcrumb-max-width: 820px;
}

body.single.hd-layout-customizable.hd-bw-840 {
    --hd-breadcrumb-max-width: 840px;
}

body.single.hd-layout-customizable.hd-bw-860 {
    --hd-breadcrumb-max-width: 860px;
}

body.single.hd-layout-customizable.hd-bw-880 {
    --hd-breadcrumb-max-width: 880px;
}

body.single.hd-layout-customizable.hd-bw-900 {
    --hd-breadcrumb-max-width: 900px;
}

body.single.hd-layout-customizable.hd-bw-920 {
    --hd-breadcrumb-max-width: 920px;
}

body.single.hd-layout-customizable.hd-bw-940 {
    --hd-breadcrumb-max-width: 940px;
}

body.single.hd-layout-customizable.hd-bw-960 {
    --hd-breadcrumb-max-width: 960px;
}

body.single.hd-layout-customizable.hd-bw-980 {
    --hd-breadcrumb-max-width: 980px;
}

body.single.hd-layout-customizable.hd-bw-1000 {
    --hd-breadcrumb-max-width: 1000px;
}

body.single.hd-layout-customizable.hd-bw-1020 {
    --hd-breadcrumb-max-width: 1020px;
}

body.single.hd-layout-customizable.hd-bw-1040 {
    --hd-breadcrumb-max-width: 1040px;
}

body.single.hd-layout-customizable.hd-bw-1060 {
    --hd-breadcrumb-max-width: 1060px;
}

body.single.hd-layout-customizable.hd-bw-1080 {
    --hd-breadcrumb-max-width: 1080px;
}

body.single.hd-layout-customizable.hd-bw-1100 {
    --hd-breadcrumb-max-width: 1100px;
}

body.single.hd-layout-customizable.hd-bw-1120 {
    --hd-breadcrumb-max-width: 1120px;
}

body.single.hd-layout-customizable.hd-bw-1140 {
    --hd-breadcrumb-max-width: 1140px;
}

body.single.hd-layout-customizable.hd-bw-1160 {
    --hd-breadcrumb-max-width: 1160px;
}

body.single.hd-layout-customizable.hd-bw-1180 {
    --hd-breadcrumb-max-width: 1180px;
}

body.single.hd-layout-customizable.hd-bw-1200 {
    --hd-breadcrumb-max-width: 1200px;
}

body.single.hd-layout-customizable.hd-bw-1220 {
    --hd-breadcrumb-max-width: 1220px;
}

body.single.hd-layout-customizable.hd-bw-1240 {
    --hd-breadcrumb-max-width: 1240px;
}

body.single.hd-layout-customizable.hd-bw-1260 {
    --hd-breadcrumb-max-width: 1260px;
}

body.single.hd-layout-customizable.hd-bw-1280 {
    --hd-breadcrumb-max-width: 1280px;
}

body.single.hd-layout-customizable.hd-bw-1300 {
    --hd-breadcrumb-max-width: 1300px;
}

body.single.hd-layout-customizable.hd-bw-1320 {
    --hd-breadcrumb-max-width: 1320px;
}

body.single.hd-layout-customizable.hd-bw-1340 {
    --hd-breadcrumb-max-width: 1340px;
}

body.single.hd-layout-customizable.hd-bw-1360 {
    --hd-breadcrumb-max-width: 1360px;
}

body.single.hd-layout-customizable.hd-bw-1380 {
    --hd-breadcrumb-max-width: 1380px;
}

body.single.hd-layout-customizable.hd-bw-1400 {
    --hd-breadcrumb-max-width: 1400px;
}

body.single.hd-layout-customizable.hd-bw-1420 {
    --hd-breadcrumb-max-width: 1420px;
}

body.single.hd-layout-customizable.hd-bw-1440 {
    --hd-breadcrumb-max-width: 1440px;
}

body.single.hd-layout-customizable.hd-bw-1460 {
    --hd-breadcrumb-max-width: 1460px;
}

body.single.hd-layout-customizable.hd-bw-1480 {
    --hd-breadcrumb-max-width: 1480px;
}

body.single.hd-layout-customizable.hd-bw-1500 {
    --hd-breadcrumb-max-width: 1500px;
}

body.single.hd-layout-customizable.hd-bw-1520 {
    --hd-breadcrumb-max-width: 1520px;
}

body.single.hd-layout-customizable.hd-bw-1540 {
    --hd-breadcrumb-max-width: 1540px;
}

body.single.hd-layout-customizable.hd-bw-1560 {
    --hd-breadcrumb-max-width: 1560px;
}

body.single.hd-layout-customizable.hd-bw-1580 {
    --hd-breadcrumb-max-width: 1580px;
}

body.single.hd-layout-customizable.hd-bw-1600 {
    --hd-breadcrumb-max-width: 1600px;
}

body.single.hd-layout-customizable.hd-bw-1620 {
    --hd-breadcrumb-max-width: 1620px;
}

body.single.hd-layout-customizable.hd-bw-1640 {
    --hd-breadcrumb-max-width: 1640px;
}

body.single.hd-layout-customizable.hd-bw-1660 {
    --hd-breadcrumb-max-width: 1660px;
}

body.single.hd-layout-customizable.hd-bw-1680 {
    --hd-breadcrumb-max-width: 1680px;
}

body.single.hd-layout-customizable.hd-bw-1700 {
    --hd-breadcrumb-max-width: 1700px;
}

body.single.hd-layout-customizable.hd-bw-1720 {
    --hd-breadcrumb-max-width: 1720px;
}

body.single.hd-layout-customizable.hd-bw-1740 {
    --hd-breadcrumb-max-width: 1740px;
}

body.single.hd-layout-customizable.hd-bw-1760 {
    --hd-breadcrumb-max-width: 1760px;
}

body.single.hd-layout-customizable.hd-bw-1780 {
    --hd-breadcrumb-max-width: 1780px;
}

body.single.hd-layout-customizable.hd-bw-1800 {
    --hd-breadcrumb-max-width: 1800px;
}

body.single.hd-layout-customizable.hd-bw-1820 {
    --hd-breadcrumb-max-width: 1820px;
}

body.single.hd-layout-customizable.hd-bw-1840 {
    --hd-breadcrumb-max-width: 1840px;
}

body.single.hd-layout-customizable.hd-bw-1860 {
    --hd-breadcrumb-max-width: 1860px;
}

body.single.hd-layout-customizable.hd-bw-1880 {
    --hd-breadcrumb-max-width: 1880px;
}

body.single.hd-layout-customizable.hd-bw-1900 {
    --hd-breadcrumb-max-width: 1900px;
}

body.single.hd-layout-customizable.hd-bw-1920 {
    --hd-breadcrumb-max-width: 1920px;
}

body.single.hd-layout-customizable.hd-bw-1940 {
    --hd-breadcrumb-max-width: 1940px;
}

body.single.hd-layout-customizable.hd-bw-1960 {
    --hd-breadcrumb-max-width: 1960px;
}

body.single.hd-layout-customizable.hd-bw-1980 {
    --hd-breadcrumb-max-width: 1980px;
}

body.single.hd-layout-customizable.hd-bw-2000 {
    --hd-breadcrumb-max-width: 2000px;
}

body.single.hd-layout-customizable.hd-cw-800 {
    --hd-content-max-width: 800px;
}

body.single.hd-layout-customizable.hd-cw-900 {
    --hd-content-max-width: 900px;
}

body.single.hd-layout-customizable.hd-cw-1000 {
    --hd-content-max-width: 1000px;
}

body.single.hd-layout-customizable.hd-cw-1100 {
    --hd-content-max-width: 1100px;
}

body.single.hd-layout-customizable.hd-cw-1200 {
    --hd-content-max-width: 1200px;
}

body.single.hd-layout-customizable.hd-cw-1300 {
    --hd-content-max-width: 1300px;
}

body.single.hd-layout-customizable.hd-cw-1400 {
    --hd-content-max-width: 1400px;
}

body.single.hd-layout-customizable.hd-cw-1500 {
    --hd-content-max-width: 1500px;
}

body.single.hd-layout-customizable.hd-cw-1600 {
    --hd-content-max-width: 1600px;
}

body.single.hd-layout-customizable.hd-cw-1700 {
    --hd-content-max-width: 1700px;
}

body.single.hd-layout-customizable.hd-cw-1800 {
    --hd-content-max-width: 1800px;
}

body.single.hd-layout-customizable.hd-cw-1900 {
    --hd-content-max-width: 1900px;
}

body.single.hd-layout-customizable.hd-cw-2000 {
    --hd-content-max-width: 2000px;
}

body.single.hd-layout-customizable.hd-cw-fullwidth {
    --hd-content-max-width: 100%;
}

body.single.hd-layout-customizable.hd-ts-24 {
    --hd-title-font-size: 24px;
}

body.single.hd-layout-customizable.hd-ts-28 {
    --hd-title-font-size: 28px;
}

body.single.hd-layout-customizable.hd-ts-32 {
    --hd-title-font-size: 32px;
}

body.single.hd-layout-customizable.hd-ts-36 {
    --hd-title-font-size: 36px;
}

body.single.hd-layout-customizable.hd-ts-40 {
    --hd-title-font-size: 40px;
}

body.single.hd-layout-customizable.hd-ts-44 {
    --hd-title-font-size: 44px;
}

body.single.hd-layout-customizable.hd-ts-48 {
    --hd-title-font-size: 48px;
}

body.single.hd-layout-customizable.hd-ts-52 {
    --hd-title-font-size: 52px;
}

body.single.hd-layout-customizable.hd-ms-12 {
    --hd-meta-font-size: 12px;
}

body.single.hd-layout-customizable.hd-ms-13 {
    --hd-meta-font-size: 13px;
}

body.single.hd-layout-customizable.hd-ms-14 {
    --hd-meta-font-size: 14px;
}

body.single.hd-layout-customizable.hd-ms-15 {
    --hd-meta-font-size: 15px;
}

body.single.hd-layout-customizable.hd-ms-16 {
    --hd-meta-font-size: 16px;
}

body.single.hd-layout-customizable.hd-ms-17 {
    --hd-meta-font-size: 17px;
}

body.single.hd-layout-customizable.hd-ms-18 {
    --hd-meta-font-size: 18px;
}

body.single.hd-layout-customizable.hd-ms-20 {
    --hd-meta-font-size: 20px;
}

body.single.hd-layout-customizable.hd-ms-24 {
    --hd-meta-font-size: 24px;
}

body.single.hd-layout-customizable.hd-abw-1000 {
    --hd-ab-container-width: 1000px;
}

body.single.hd-layout-customizable.hd-abw-1100 {
    --hd-ab-container-width: 1100px;
}

body.single.hd-layout-customizable.hd-abw-1200 {
    --hd-ab-container-width: 1200px;
}

body.single.hd-layout-customizable.hd-abw-1280 {
    --hd-ab-container-width: 1280px;
}

body.single.hd-layout-customizable.hd-abw-1360 {
    --hd-ab-container-width: 1360px;
}

body.single.hd-layout-customizable.hd-abw-1440 {
    --hd-ab-container-width: 1440px;
}

body.single.hd-layout-customizable.hd-abw-1600 {
    --hd-ab-container-width: 1600px;
}

body.single.hd-layout-customizable.hd-aw-auto {
    --hd-main-column-width: auto;
}

body.single.hd-layout-customizable.hd-aw-800 {
    --hd-main-column-width: 800px;
}

body.single.hd-layout-customizable.hd-aw-900 {
    --hd-main-column-width: 900px;
}

body.single.hd-layout-customizable.hd-aw-1000 {
    --hd-main-column-width: 1000px;
}

body.single.hd-layout-customizable.hd-aw-1100 {
    --hd-main-column-width: 1100px;
}

body.single.hd-layout-customizable.hd-aw-1200 {
    --hd-main-column-width: 1200px;
}

body.single.hd-layout-customizable.hd-sw-260 {
    --hd-sidebar-width: 260px;
}

body.single.hd-layout-customizable.hd-sw-280 {
    --hd-sidebar-width: 280px;
}

body.single.hd-layout-customizable.hd-sw-300 {
    --hd-sidebar-width: 300px;
}

body.single.hd-layout-customizable.hd-sw-330 {
    --hd-sidebar-width: 330px;
}

body.single.hd-layout-customizable.hd-sw-360 {
    --hd-sidebar-width: 360px;
}

body.single.hd-layout-customizable.hd-sw-400 {
    --hd-sidebar-width: 400px;
}

body.single.hd-layout-customizable.hd-sg-0 {
    --hd-sidebar-gap: 0px;
}

body.single.hd-layout-customizable.hd-sg-4 {
    --hd-sidebar-gap: 4px;
}

body.single.hd-layout-customizable.hd-sg-8 {
    --hd-sidebar-gap: 8px;
}

body.single.hd-layout-customizable.hd-sg-12 {
    --hd-sidebar-gap: 12px;
}

body.single.hd-layout-customizable.hd-sg-18 {
    --hd-sidebar-gap: 18px;
}

body.single.hd-layout-customizable.hd-sg-20 {
    --hd-sidebar-gap: 20px;
}

body.single.hd-layout-customizable.hd-sg-24 {
    --hd-sidebar-gap: 24px;
}

body.single.hd-layout-customizable.hd-sg-32 {
    --hd-sidebar-gap: 32px;
}

body.single.hd-layout-customizable.hd-top-0 {
    --hd-top-spacing: 0px;
}

body.single.hd-layout-customizable.hd-top-12 {
    --hd-top-spacing: 12px;
}

body.single.hd-layout-customizable.hd-top-20 {
    --hd-top-spacing: 20px;
}

body.single.hd-layout-customizable.hd-top-28 {
    --hd-top-spacing: 28px;
}

body.single.hd-layout-customizable.hd-top-36 {
    --hd-top-spacing: 36px;
}

body.single.hd-layout-customizable.hd-top-48 {
    --hd-top-spacing: 48px;
}

body.single.hd-layout-customizable.hd-adgap-12 {
    --hd-top-ad-after-spacing: 12px;
}

body.single.hd-layout-customizable.hd-adgap-20 {
    --hd-top-ad-after-spacing: 20px;
}

body.single.hd-layout-customizable.hd-adgap-28 {
    --hd-top-ad-after-spacing: 28px;
}

body.single.hd-layout-customizable.hd-adgap-36 {
    --hd-top-ad-after-spacing: 36px;
}

body.single.hd-layout-customizable.hd-adgap-48 {
    --hd-top-ad-after-spacing: 48px;
}

body.single.hd-layout-customizable.hd-adgap-64 {
    --hd-top-ad-after-spacing: 64px;
}

body.single.hd-layout-customizable.hd-adgap-80 {
    --hd-top-ad-after-spacing: 80px;
}

body.single.hd-layout-customizable.hd-adgap-96 {
    --hd-top-ad-after-spacing: 96px;
}

body.single.hd-layout-customizable.hd-adgap-120 {
    --hd-top-ad-after-spacing: 120px;
}

body.single.hd-layout-customizable.hd-adgap-160 {
    --hd-top-ad-after-spacing: 160px;
}

body.single.hd-layout-customizable.hd-adgapt-0 {
    --hd-top-ad-after-spacing-tablet: 10px;
}

body.single.hd-layout-customizable.hd-adgapt-12 {
    --hd-top-ad-after-spacing-tablet: 12px;
}

body.single.hd-layout-customizable.hd-adgapt-20 {
    --hd-top-ad-after-spacing-tablet: 20px;
}

body.single.hd-layout-customizable.hd-adgapt-28 {
    --hd-top-ad-after-spacing-tablet: 28px;
}

body.single.hd-layout-customizable.hd-adgapt-36 {
    --hd-top-ad-after-spacing-tablet: 36px;
}

body.single.hd-layout-customizable.hd-adgapt-48 {
    --hd-top-ad-after-spacing-tablet: 48px;
}

body.single.hd-layout-customizable.hd-adgapt-64 {
    --hd-top-ad-after-spacing-tablet: 64px;
}

body.single.hd-layout-customizable.hd-adgapt-80 {
    --hd-top-ad-after-spacing-tablet: 80px;
}

body.single.hd-layout-customizable.hd-adgapt-96 {
    --hd-top-ad-after-spacing-tablet: 96px;
}

body.single.hd-layout-customizable.hd-adgapt-120 {
    --hd-top-ad-after-spacing-tablet: 120px;
}

body.single.hd-layout-customizable.hd-adgapt-160 {
    --hd-top-ad-after-spacing-tablet: 160px;
}

body.single.hd-layout-customizable.hd-adgapm-0 {
    --hd-top-ad-after-spacing-mobile: 10px;
}

body.single.hd-layout-customizable.hd-adgapm-12 {
    --hd-top-ad-after-spacing-mobile: 12px;
}

body.single.hd-layout-customizable.hd-adgapm-20 {
    --hd-top-ad-after-spacing-mobile: 20px;
}

body.single.hd-layout-customizable.hd-adgapm-28 {
    --hd-top-ad-after-spacing-mobile: 28px;
}

body.single.hd-layout-customizable.hd-adgapm-36 {
    --hd-top-ad-after-spacing-mobile: 36px;
}

body.single.hd-layout-customizable.hd-adgapm-48 {
    --hd-top-ad-after-spacing-mobile: 48px;
}

body.single.hd-layout-customizable.hd-adgapm-64 {
    --hd-top-ad-after-spacing-mobile: 64px;
}

body.single.hd-layout-customizable.hd-adgapm-80 {
    --hd-top-ad-after-spacing-mobile: 80px;
}

body.single.hd-layout-customizable.hd-adgapm-96 {
    --hd-top-ad-after-spacing-mobile: 96px;
}

body.single.hd-layout-customizable.hd-adgapm-120 {
    --hd-top-ad-after-spacing-mobile: 120px;
}

body.single.hd-layout-customizable.hd-adgapm-160 {
    --hd-top-ad-after-spacing-mobile: 160px;
}

body.single.hd-layout-customizable.hd-gs-8 {
    --hd-section-gap: 8px;
}

body.single.hd-layout-customizable.hd-gs-12 {
    --hd-section-gap: 12px;
}

body.single.hd-layout-customizable.hd-gs-16 {
    --hd-section-gap: 16px;
}

body.single.hd-layout-customizable.hd-gs-20 {
    --hd-section-gap: 20px;
}

body.single.hd-layout-customizable.hd-gs-24 {
    --hd-section-gap: 24px;
}

body.single.hd-layout-customizable.hd-gs-32 {
    --hd-section-gap: 32px;
}

body.single.hd-layout-customizable.hd-fs-4 {
    --hd-field-gap: 4px;
}

body.single.hd-layout-customizable.hd-fs-8 {
    --hd-field-gap: 8px;
}

body.single.hd-layout-customizable.hd-fs-10 {
    --hd-field-gap: 10px;
}

body.single.hd-layout-customizable.hd-fs-12 {
    --hd-field-gap: 12px;
}

body.single.hd-layout-customizable.hd-fs-16 {
    --hd-field-gap: 16px;
}

body.single.hd-layout-customizable.hd-fs-20 {
    --hd-field-gap: 20px;
}

/* Responsive tokens: Tablet / Mobile */
body.single.hd-layout-customizable.hd-cwt-inherit {
    --hd-content-max-width-tablet: var(--hd-content-max-width, 1000px);
}

body.single.hd-layout-customizable.hd-cwt-800 {
    --hd-content-max-width-tablet: 800px;
}

body.single.hd-layout-customizable.hd-cwt-850 {
    --hd-content-max-width-tablet: 850px;
}

body.single.hd-layout-customizable.hd-cwt-1000 {
    --hd-content-max-width-tablet: 1000px;
}

body.single.hd-layout-customizable.hd-cwt-1200 {
    --hd-content-max-width-tablet: 1200px;
}

body.single.hd-layout-customizable.hd-cwt-fullwidth {
    --hd-content-max-width-tablet: 100%;
}

body.single.hd-layout-customizable.hd-cwm-inherit {
    --hd-content-max-width-mobile: var(--hd-content-max-width-tablet, var(--hd-content-max-width, 1000px));
}

body.single.hd-layout-customizable.hd-cwm-800 {
    --hd-content-max-width-mobile: 800px;
}

body.single.hd-layout-customizable.hd-cwm-850 {
    --hd-content-max-width-mobile: 850px;
}

body.single.hd-layout-customizable.hd-cwm-1000 {
    --hd-content-max-width-mobile: 1000px;
}

body.single.hd-layout-customizable.hd-cwm-1200 {
    --hd-content-max-width-mobile: 1200px;
}

body.single.hd-layout-customizable.hd-cwm-fullwidth {
    --hd-content-max-width-mobile: 100%;
}

body.single.hd-layout-customizable.hd-fwt-inherit {
    --hd-featured-image-max-width-tablet: var(--hd-featured-image-max-width, 1000px);
}

body.single.hd-layout-customizable.hd-fwt-800 {
    --hd-featured-image-max-width-tablet: 800px;
}

body.single.hd-layout-customizable.hd-fwt-850 {
    --hd-featured-image-max-width-tablet: 850px;
}

body.single.hd-layout-customizable.hd-fwt-1000 {
    --hd-featured-image-max-width-tablet: 1000px;
}

body.single.hd-layout-customizable.hd-fwt-1200 {
    --hd-featured-image-max-width-tablet: 1200px;
}

body.single.hd-layout-customizable.hd-fwt-1400 {
    --hd-featured-image-max-width-tablet: 1400px;
}

body.single.hd-layout-customizable.hd-fwt-1600 {
    --hd-featured-image-max-width-tablet: 1600px;
}

body.single.hd-layout-customizable.hd-fwt-1800 {
    --hd-featured-image-max-width-tablet: 1800px;
}

body.single.hd-layout-customizable.hd-fwt-2000 {
    --hd-featured-image-max-width-tablet: 2000px;
}

body.single.hd-layout-customizable.hd-fwt-full {
    --hd-featured-image-max-width-tablet: 100vw;
}

body.single.hd-layout-customizable.hd-fwm-inherit {
    --hd-featured-image-max-width-mobile: var(--hd-featured-image-max-width-tablet, var(--hd-featured-image-max-width, 1000px));
}

body.single.hd-layout-customizable.hd-fwm-800 {
    --hd-featured-image-max-width-mobile: 800px;
}

body.single.hd-layout-customizable.hd-fwm-850 {
    --hd-featured-image-max-width-mobile: 850px;
}

body.single.hd-layout-customizable.hd-fwm-1000 {
    --hd-featured-image-max-width-mobile: 1000px;
}

body.single.hd-layout-customizable.hd-fwm-1200 {
    --hd-featured-image-max-width-mobile: 1200px;
}

body.single.hd-layout-customizable.hd-fwm-1400 {
    --hd-featured-image-max-width-mobile: 1400px;
}

body.single.hd-layout-customizable.hd-fwm-1600 {
    --hd-featured-image-max-width-mobile: 1600px;
}

body.single.hd-layout-customizable.hd-fwm-1800 {
    --hd-featured-image-max-width-mobile: 1800px;
}

body.single.hd-layout-customizable.hd-fwm-2000 {
    --hd-featured-image-max-width-mobile: 2000px;
}

body.single.hd-layout-customizable.hd-fwm-full {
    --hd-featured-image-max-width-mobile: 100vw;
}

body.single.hd-layout-customizable.hd-twt-inherit {
    --hd-title-max-width-tablet: var(--hd-title-max-width, 1000px);
}

body.single.hd-layout-customizable.hd-twt-600 {
    --hd-title-max-width-tablet: 600px;
}

body.single.hd-layout-customizable.hd-twt-800 {
    --hd-title-max-width-tablet: 800px;
}

body.single.hd-layout-customizable.hd-twt-850 {
    --hd-title-max-width-tablet: 850px;
}

body.single.hd-layout-customizable.hd-twt-1000 {
    --hd-title-max-width-tablet: 1000px;
}

body.single.hd-layout-customizable.hd-twt-1200 {
    --hd-title-max-width-tablet: 1200px;
}

body.single.hd-layout-customizable.hd-twt-1400 {
    --hd-title-max-width-tablet: 1400px;
}

body.single.hd-layout-customizable.hd-twt-1600 {
    --hd-title-max-width-tablet: 1600px;
}

body.single.hd-layout-customizable.hd-twt-1800 {
    --hd-title-max-width-tablet: 1800px;
}

body.single.hd-layout-customizable.hd-twt-2000 {
    --hd-title-max-width-tablet: 2000px;
}

body.single.hd-layout-customizable.hd-twm-inherit {
    --hd-title-max-width-mobile: var(--hd-title-max-width-tablet, var(--hd-title-max-width, 1000px));
}

body.single.hd-layout-customizable.hd-twm-600 {
    --hd-title-max-width-mobile: 600px;
}

body.single.hd-layout-customizable.hd-twm-800 {
    --hd-title-max-width-mobile: 800px;
}

body.single.hd-layout-customizable.hd-twm-850 {
    --hd-title-max-width-mobile: 850px;
}

body.single.hd-layout-customizable.hd-twm-1000 {
    --hd-title-max-width-mobile: 1000px;
}

body.single.hd-layout-customizable.hd-twm-1200 {
    --hd-title-max-width-mobile: 1200px;
}

body.single.hd-layout-customizable.hd-twm-1400 {
    --hd-title-max-width-mobile: 1400px;
}

body.single.hd-layout-customizable.hd-twm-1600 {
    --hd-title-max-width-mobile: 1600px;
}

body.single.hd-layout-customizable.hd-twm-1800 {
    --hd-title-max-width-mobile: 1800px;
}

body.single.hd-layout-customizable.hd-twm-2000 {
    --hd-title-max-width-mobile: 2000px;
}

body.single.hd-layout-customizable.hd-mwt-inherit {
    --hd-meta-max-width-tablet: var(--hd-meta-max-width, 1000px);
}

body.single.hd-layout-customizable.hd-mwt-600 {
    --hd-meta-max-width-tablet: 600px;
}

body.single.hd-layout-customizable.hd-mwt-800 {
    --hd-meta-max-width-tablet: 800px;
}

body.single.hd-layout-customizable.hd-mwt-850 {
    --hd-meta-max-width-tablet: 850px;
}

body.single.hd-layout-customizable.hd-mwt-1000 {
    --hd-meta-max-width-tablet: 1000px;
}

body.single.hd-layout-customizable.hd-mwt-1200 {
    --hd-meta-max-width-tablet: 1200px;
}

body.single.hd-layout-customizable.hd-mwt-1400 {
    --hd-meta-max-width-tablet: 1400px;
}

body.single.hd-layout-customizable.hd-mwt-1600 {
    --hd-meta-max-width-tablet: 1600px;
}

body.single.hd-layout-customizable.hd-mwt-1800 {
    --hd-meta-max-width-tablet: 1800px;
}

body.single.hd-layout-customizable.hd-mwt-2000 {
    --hd-meta-max-width-tablet: 2000px;
}

body.single.hd-layout-customizable.hd-mwm-inherit {
    --hd-meta-max-width-mobile: var(--hd-meta-max-width-tablet, var(--hd-meta-max-width, 1000px));
}

body.single.hd-layout-customizable.hd-mwm-600 {
    --hd-meta-max-width-mobile: 600px;
}

body.single.hd-layout-customizable.hd-mwm-800 {
    --hd-meta-max-width-mobile: 800px;
}

body.single.hd-layout-customizable.hd-mwm-850 {
    --hd-meta-max-width-mobile: 850px;
}

body.single.hd-layout-customizable.hd-mwm-1000 {
    --hd-meta-max-width-mobile: 1000px;
}

body.single.hd-layout-customizable.hd-mwm-1200 {
    --hd-meta-max-width-mobile: 1200px;
}

body.single.hd-layout-customizable.hd-mwm-1400 {
    --hd-meta-max-width-mobile: 1400px;
}

body.single.hd-layout-customizable.hd-mwm-1600 {
    --hd-meta-max-width-mobile: 1600px;
}

body.single.hd-layout-customizable.hd-mwm-1800 {
    --hd-meta-max-width-mobile: 1800px;
}

body.single.hd-layout-customizable.hd-mwm-2000 {
    --hd-meta-max-width-mobile: 2000px;
}

body.single.hd-layout-customizable.hd-bwt-inherit {
    --hd-breadcrumb-max-width-tablet: var(--hd-breadcrumb-max-width, 1000px);
}

body.single.hd-layout-customizable.hd-bwt-600 {
    --hd-breadcrumb-max-width-tablet: 600px;
}

body.single.hd-layout-customizable.hd-bwt-800 {
    --hd-breadcrumb-max-width-tablet: 800px;
}

body.single.hd-layout-customizable.hd-bwt-850 {
    --hd-breadcrumb-max-width-tablet: 850px;
}

body.single.hd-layout-customizable.hd-bwt-1000 {
    --hd-breadcrumb-max-width-tablet: 1000px;
}

body.single.hd-layout-customizable.hd-bwt-1200 {
    --hd-breadcrumb-max-width-tablet: 1200px;
}

body.single.hd-layout-customizable.hd-bwt-1400 {
    --hd-breadcrumb-max-width-tablet: 1400px;
}

body.single.hd-layout-customizable.hd-bwt-1600 {
    --hd-breadcrumb-max-width-tablet: 1600px;
}

body.single.hd-layout-customizable.hd-bwt-1800 {
    --hd-breadcrumb-max-width-tablet: 1800px;
}

body.single.hd-layout-customizable.hd-bwt-2000 {
    --hd-breadcrumb-max-width-tablet: 2000px;
}

body.single.hd-layout-customizable.hd-tst-inherit {
    --hd-title-font-size-tablet: var(--hd-title-font-size, 44px);
}

body.single.hd-layout-customizable.hd-tst-24 {
    --hd-title-font-size-tablet: 24px;
}

body.single.hd-layout-customizable.hd-tst-28 {
    --hd-title-font-size-tablet: 28px;
}

body.single.hd-layout-customizable.hd-tst-32 {
    --hd-title-font-size-tablet: 32px;
}

body.single.hd-layout-customizable.hd-tst-36 {
    --hd-title-font-size-tablet: 36px;
}

body.single.hd-layout-customizable.hd-tst-40 {
    --hd-title-font-size-tablet: 40px;
}

body.single.hd-layout-customizable.hd-tsm-inherit {
    --hd-title-font-size-mobile: var(--hd-title-font-size-tablet, var(--hd-title-font-size, 44px));
}

body.single.hd-layout-customizable.hd-tsm-24 {
    --hd-title-font-size-mobile: 24px;
}

body.single.hd-layout-customizable.hd-tsm-28 {
    --hd-title-font-size-mobile: 28px;
}

body.single.hd-layout-customizable.hd-tsm-32 {
    --hd-title-font-size-mobile: 32px;
}

body.single.hd-layout-customizable.hd-tsm-36 {
    --hd-title-font-size-mobile: 36px;
}

body.single.hd-layout-customizable.hd-tsm-40 {
    --hd-title-font-size-mobile: 40px;
}

body.single.hd-layout-customizable.hd-tsm-44 {
    --hd-title-font-size-mobile: 44px;
}

body.single.hd-layout-customizable.hd-mst-inherit {
    --hd-meta-font-size-tablet: var(--hd-meta-font-size, 14px);
}

body.single.hd-layout-customizable.hd-mst-12 {
    --hd-meta-font-size-tablet: 12px;
}

body.single.hd-layout-customizable.hd-mst-13 {
    --hd-meta-font-size-tablet: 13px;
}

body.single.hd-layout-customizable.hd-mst-14 {
    --hd-meta-font-size-tablet: 14px;
}

body.single.hd-layout-customizable.hd-mst-15 {
    --hd-meta-font-size-tablet: 15px;
}

body.single.hd-layout-customizable.hd-mst-16 {
    --hd-meta-font-size-tablet: 16px;
}

body.single.hd-layout-customizable.hd-mst-17 {
    --hd-meta-font-size-tablet: 17px;
}

body.single.hd-layout-customizable.hd-mst-18 {
    --hd-meta-font-size-tablet: 18px;
}

body.single.hd-layout-customizable.hd-mst-20 {
    --hd-meta-font-size-tablet: 20px;
}

body.single.hd-layout-customizable.hd-mst-24 {
    --hd-meta-font-size-tablet: 24px;
}

body.single.hd-layout-customizable.hd-msm-inherit {
    --hd-meta-font-size-mobile: var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 14px));
}

body.single.hd-layout-customizable.hd-msm-12 {
    --hd-meta-font-size-mobile: 12px;
}

body.single.hd-layout-customizable.hd-msm-13 {
    --hd-meta-font-size-mobile: 13px;
}

body.single.hd-layout-customizable.hd-msm-14 {
    --hd-meta-font-size-mobile: 14px;
}

body.single.hd-layout-customizable.hd-msm-15 {
    --hd-meta-font-size-mobile: 15px;
}

body.single.hd-layout-customizable.hd-msm-16 {
    --hd-meta-font-size-mobile: 16px;
}

body.single.hd-layout-customizable.hd-msm-17 {
    --hd-meta-font-size-mobile: 17px;
}

body.single.hd-layout-customizable.hd-msm-18 {
    --hd-meta-font-size-mobile: 18px;
}

body.single.hd-layout-customizable.hd-msm-20 {
    --hd-meta-font-size-mobile: 20px;
}

body.single.hd-layout-customizable.hd-msm-24 {
    --hd-meta-font-size-mobile: 24px;
}

body.single.hd-layout-customizable.hd-bwm-inherit {
    --hd-breadcrumb-max-width-mobile: var(--hd-breadcrumb-max-width-tablet, var(--hd-breadcrumb-max-width, 1000px));
}

body.single.hd-layout-customizable.hd-bwm-600 {
    --hd-breadcrumb-max-width-mobile: 600px;
}

body.single.hd-layout-customizable.hd-bwm-800 {
    --hd-breadcrumb-max-width-mobile: 800px;
}

body.single.hd-layout-customizable.hd-bwm-850 {
    --hd-breadcrumb-max-width-mobile: 850px;
}

body.single.hd-layout-customizable.hd-bwm-1000 {
    --hd-breadcrumb-max-width-mobile: 1000px;
}

body.single.hd-layout-customizable.hd-bwm-1200 {
    --hd-breadcrumb-max-width-mobile: 1200px;
}

body.single.hd-layout-customizable.hd-bwm-1400 {
    --hd-breadcrumb-max-width-mobile: 1400px;
}

body.single.hd-layout-customizable.hd-bwm-1600 {
    --hd-breadcrumb-max-width-mobile: 1600px;
}

body.single.hd-layout-customizable.hd-bwm-1800 {
    --hd-breadcrumb-max-width-mobile: 1800px;
}

body.single.hd-layout-customizable.hd-bwm-2000 {
    --hd-breadcrumb-max-width-mobile: 2000px;
}

body.single.hd-layout-customizable.hd-tst-inherit {
    --hd-title-font-size-tablet: var(--hd-title-font-size, 44px);
}

body.single.hd-layout-customizable.hd-tst-24 {
    --hd-title-font-size-tablet: 24px;
}

body.single.hd-layout-customizable.hd-tst-28 {
    --hd-title-font-size-tablet: 28px;
}

body.single.hd-layout-customizable.hd-tst-32 {
    --hd-title-font-size-tablet: 32px;
}

body.single.hd-layout-customizable.hd-tst-36 {
    --hd-title-font-size-tablet: 36px;
}

body.single.hd-layout-customizable.hd-tst-40 {
    --hd-title-font-size-tablet: 40px;
}

body.single.hd-layout-customizable.hd-tst-44 {
    --hd-title-font-size-tablet: 44px;
}

body.single.hd-layout-customizable.hd-tst-48 {
    --hd-title-font-size-tablet: 48px;
}

body.single.hd-layout-customizable.hd-tst-52 {
    --hd-title-font-size-tablet: 52px;
}

body.single.hd-layout-customizable.hd-tsm-inherit {
    --hd-title-font-size-mobile: var(--hd-title-font-size-tablet, var(--hd-title-font-size, 44px));
}

body.single.hd-layout-customizable.hd-tsm-24 {
    --hd-title-font-size-mobile: 24px;
}

body.single.hd-layout-customizable.hd-tsm-28 {
    --hd-title-font-size-mobile: 28px;
}

body.single.hd-layout-customizable.hd-tsm-32 {
    --hd-title-font-size-mobile: 32px;
}

body.single.hd-layout-customizable.hd-tsm-36 {
    --hd-title-font-size-mobile: 36px;
}

body.single.hd-layout-customizable.hd-tsm-40 {
    --hd-title-font-size-mobile: 40px;
}

body.single.hd-layout-customizable.hd-tsm-44 {
    --hd-title-font-size-mobile: 44px;
}

body.single.hd-layout-customizable.hd-tsm-48 {
    --hd-title-font-size-mobile: 48px;
}

body.single.hd-layout-customizable.hd-tsm-52 {
    --hd-title-font-size-mobile: 52px;
}

body.single.hd-layout-customizable {
    --hd-content-max-width-active: var(--hd-content-max-width, 1000px);
    --fc-content-width: var(--hd-content-max-width-active);
    --hd-featured-image-max-width-active: var(--hd-featured-image-max-width, 1000px);
    --hd-title-max-width-active: var(--hd-title-max-width, 1000px);
    --hd-meta-max-width-active: var(--hd-meta-max-width, 1000px);
    --hd-breadcrumb-max-width-active: var(--hd-breadcrumb-max-width, 1000px);
    --hd-title-font-size-active: var(--hd-title-font-size, inherit);
    --hd-ab-container-width-active: var(--hd-ab-container-width, 1280px);
    --hd-inline-gutter: 0px;
    --hd-inline-safe-width: 100%;
}

@media (max-width: 1280px) {
    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) {
        --hd-inline-gutter: 16px;
        --hd-inline-safe-width: 100%;
    }

    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) #content-main,
    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) .main-layout-wrapper>#content-main,
    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) .main-layout-wrapper.si-3-main-layout>#content-main {
        padding-left: 0;
        padding-right: 0;
    }
}

body.single.hd-layout-customizable > .container,
body.single.hd-layout-customizable > article.container,
body.single.hd-layout-customizable #container-all > .container,
body.single.hd-layout-customizable #container-all > article.container {
    max-width: min(var(--hd-ab-container-width-active, 1280px), var(--hd-inline-safe-width, 100%)) !important;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
}

@media (max-width: 1199px) {
    body.single.hd-layout-customizable {
        --hd-content-max-width-active: var(--hd-content-max-width-tablet, var(--hd-content-max-width, 1000px));
        --fc-content-width: var(--hd-content-max-width-active);
        --hd-featured-image-max-width-active: var(--hd-featured-image-max-width-tablet, var(--hd-featured-image-max-width, 1000px));
        --hd-title-max-width-active: var(--hd-title-max-width-tablet, var(--hd-title-max-width, 1000px));
        --hd-meta-max-width-active: var(--hd-meta-max-width-tablet, var(--hd-meta-max-width, 1000px));
        --hd-breadcrumb-max-width-active: var(--hd-breadcrumb-max-width-tablet, var(--hd-breadcrumb-max-width, 1000px));
        --hd-title-font-size-active: var(--hd-title-font-size-tablet, var(--hd-title-font-size, inherit));
    }
}

@media (max-width: 768px) {
    body.single.hd-layout-customizable {
        --hd-inline-gutter: 12px;
        --hd-inline-safe-width: 100%;
        --hd-content-max-width-active: var(--hd-content-max-width-mobile, var(--hd-content-max-width-tablet, var(--hd-content-max-width, 1000px)));
        --fc-content-width: var(--hd-content-max-width-active);
        --hd-featured-image-max-width-active: var(--hd-featured-image-max-width-mobile, var(--hd-featured-image-max-width-tablet, var(--hd-featured-image-max-width, 1000px)));
        --hd-title-max-width-active: var(--hd-title-max-width-mobile, var(--hd-title-max-width-tablet, var(--hd-title-max-width, 1000px)));
        --hd-meta-max-width-active: var(--hd-meta-max-width-mobile, var(--hd-meta-max-width-tablet, var(--hd-meta-max-width, 1000px)));
        --hd-breadcrumb-max-width-active: var(--hd-breadcrumb-max-width-mobile, var(--hd-breadcrumb-max-width-tablet, var(--hd-breadcrumb-max-width, 1000px)));
        --hd-title-font-size-active: var(--hd-title-font-size-mobile, var(--hd-title-font-size-tablet, var(--hd-title-font-size, inherit)));
    }
}

/* A 欄自動：以 AB 總寬扣除 B 欄與欄距，統一套用到所有版頭寬度。 */
body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto:not(.hd-cw-fullwidth) {
    --hd-ab-auto-main-width: min(calc(var(--hd-ab-container-width-active, var(--hd-ab-container-width, 1280px)) - var(--hd-sidebar-width, 280px) - var(--hd-sidebar-gap, 0px)), 100%);
    --hd-content-max-width-active: var(--hd-ab-auto-main-width);
    --fc-content-width: var(--hd-ab-auto-main-width);
    --hd-featured-image-max-width-active: var(--hd-ab-auto-main-width);
    --hd-title-max-width-active: var(--hd-ab-auto-main-width);
    --hd-meta-max-width-active: var(--hd-ab-auto-main-width);
    --hd-breadcrumb-max-width-active: var(--hd-ab-auto-main-width);
}

body.single.hd-layout-customizable .main-layout-wrapper {
    max-width: min(var(--hd-ab-container-width-active, 1280px), var(--hd-inline-safe-width, 100%));
    width: 100%;
    padding-left: var(--hd-inline-gutter, 0px);
    padding-right: var(--hd-inline-gutter, 0px);
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0;
    margin-top: var(--hd-top-spacing, 0px);
}

@media (min-width: 769px) and (max-width: 1320px) {
    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) {
        --hd-inline-gutter: 16px;
        --hd-inline-safe-width: calc(100% - 32px);
    }

    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) .main-layout-wrapper {
        padding-left: 0;
        padding-right: 0;
    }
}

/* Remove core.css 800px cap so content width can follow layout settings. */
body.single.hd-layout-customizable #postshow-a {
    max-width: none;
    margin: 0 auto;
}

body.single.hd-layout-customizable>.container>#postshow-a,
body.single.hd-layout-customizable>article.container>#postshow-a,
body.single.hd-layout-customizable #container-all>.container>#postshow-a,
body.single.hd-layout-customizable #container-all>article.container>#postshow-a {
    padding-top: 0;
    margin-top: var(--hd-top-spacing, 0px);
}

body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header .entry-title,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header .entry-title,
body.single.hd-layout-customizable .si-26-top-hero__grid>.entry-header .entry-title,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-title-top,
body.single.hd-layout-customizable.hd-layout-key-4 .si-title-top {
    font-size: var(--hd-title-font-size-active, inherit);
}

body.single.hd-layout-customizable #si-single-content {
    max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.social-share-wrapper,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.post-navigation,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.author-box-container,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.social-share-wrapper,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-navigation,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.author-box-container,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.social-share-wrapper,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.post-navigation,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.author-box-container {
    width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: static;
    left: auto;
    transform: none;
    margin-left: auto;
    margin-right: auto;
}

/* Keep related/after-content modules aligned with content width tokens. */
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.hd-related-posts-container,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.alm-section-wrapper,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.hd-related-posts-container,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.alm-section-wrapper,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.hd-related-posts-container,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.alm-section-wrapper {
    width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: static;
    left: auto;
    transform: none;
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-cw-fullwidth #si-single-content {
    max-width: none;
    width: 100%;
}

body.single.hd-layout-customizable.hd-cw-fullwidth #post-wrapper>[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-cw-fullwidth #post-wrapper>[id^="post-"]>.social-share-wrapper,
body.single.hd-layout-customizable.hd-cw-fullwidth #post-wrapper>[id^="post-"]>.post-navigation,
body.single.hd-layout-customizable.hd-cw-fullwidth #post-wrapper>[id^="post-"]>.author-box-container,
body.single.hd-layout-customizable.hd-cw-fullwidth main#postshow-a>article[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-cw-fullwidth main#postshow-a>article[id^="post-"]>.social-share-wrapper,
body.single.hd-layout-customizable.hd-cw-fullwidth main#postshow-a>article[id^="post-"]>.post-navigation,
body.single.hd-layout-customizable.hd-cw-fullwidth main#postshow-a>article[id^="post-"]>.author-box-container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a>.social-share-wrapper,
body.single.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a>.post-navigation,
body.single.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a>.author-box-container {
    max-width: none;
    width: 100%;
}

body.single.hd-layout-customizable.hd-cw-fullwidth #post-wrapper>[id^="post-"]>.hd-related-posts-container,
body.single.hd-layout-customizable.hd-cw-fullwidth #post-wrapper>[id^="post-"]>.alm-section-wrapper,
body.single.hd-layout-customizable.hd-cw-fullwidth main#postshow-a>article[id^="post-"]>.hd-related-posts-container,
body.single.hd-layout-customizable.hd-cw-fullwidth main#postshow-a>article[id^="post-"]>.alm-section-wrapper,
body.single.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a>.hd-related-posts-container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a>.alm-section-wrapper {
    max-width: none;
    width: 100%;
}

body.single.hd-layout-customizable.hd-lm-full:not(.hd-cw-fullwidth) .main-layout-wrapper.si-3-main-layout {
    max-width: min(var(--hd-content-max-width-active, 1000px), 100%) !important;
}

body.single.hd-layout-customizable.hd-cw-fullwidth .main-layout-wrapper.si-3-main-layout {
    max-width: 100%;
}

body.single.hd-layout-customizable #breadcrumb {
    width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable .si-26-top-hero__grid>.entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
}

body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

body.single.hd-layout-customizable .si-26-top-hero__grid>.si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
}

/* Featured image width should work in both default and title-below orders. */
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-thumbnail,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.landscape-side-by-side__captions,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main>.landscape-side-by-side__captions,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main>.post-thumbnail {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

/* Fallback for templates with extra wrappers around featured image blocks. */
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #post-wrapper #arcs-single-filter,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #postshow-a #arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main #arcs-single-filter,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #post-wrapper .si-hero-media-container,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #postshow-a .si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main .si-hero-media-container,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #post-wrapper .modern-landscape-side-by-side,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #postshow-a .modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main .modern-landscape-side-by-side,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #post-wrapper .landscape-side-by-side__captions,
body.single.hd-layout-customizable:not(.hd-layout-key-2-6) #postshow-a .landscape-side-by-side__captions,
body.single.hd-layout-customizable.hd-layout-key-3 .si-3-main-layout>#content-main .landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
    max-width: 100%;
}

/* AB + flex 下統一用 margin auto 真置中，避免 left/transform 視覺偏移。 */
body.single.hd-layout-customizable #breadcrumb,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.si-single-top,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-single-top,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-thumbnail {
    position: static;
    left: auto;
    transform: none;
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"] {
    display: flex;
    flex-direction: column;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>* {
    order: 100;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#breadcrumb {
    order: 5;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.entry-header {
    order: 10;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side {
    order: 20;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions {
    order: 21;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-single-top {
    order: 30;
    margin-top: 0;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#si-single-content {
    order: 40;
}

body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-order-title-below #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] {
    display: flex;
    flex-direction: column;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>* {
    order: 100;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>#breadcrumb {
    order: 5;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>.entry-header {
    order: 10;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] .si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] #arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] .modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] .post-thumbnail {
    order: 20;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] .landscape-side-by-side__captions {
    order: 21;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>.si-single-top {
    order: 30;
    margin-top: 0;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] #si-single-content,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"] .entry-content {
    order: 40;
}

body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable.hd-layout-order-title-below main#postshow-a>article[id^="post-"]>.post-thumbnail {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

/* layout 2-6 uses top hero grid; provide explicit order variant */
body.single.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
        "header"
        "media"
        "meta";
    row-gap: 12px;
}

body.single.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid>.landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

/* Unified media container internal styling to ensure children fill the container correctly. */
.si-hero-media-container {
    display: flex;
    flex-direction: column;
}

.si-hero-media-container>#arcs-single-filter,
.si-hero-media-container>.modern-landscape-side-by-side,
.si-hero-media-container>.landscape-side-by-side__captions,
.si-hero-media-container>.post-thumbnail {
    width: 100% !important;
    max-width: 100% !important;
    position: static !important;
    left: auto !important;
    transform: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* layout 4 uses legacy structure: direct children under #postshow-a */
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-title-top {
    display: block;
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a {
    display: flex;
    flex-direction: column;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a>.si-title-top {
    order: -30;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a>.landscape-side-by-side__captions {
    order: -20;
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

body.single.hd-layout-customizable .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--hd-field-gap, 10px);
}

/* Remove margin-bottom from all byline elements */
/* Use gap for spacing within si-single-top-a container */
body.single.hd-layout-customizable .si-single-top .byline {
    margin-bottom: 0;
}

/* Only add margin-bottom to direct children of si-single-top (like si-time) */
/* to create spacing between si-time and si-single-top-a */
/* EXCEPT for horizontal styles where they should align on same line */
body.single.hd-layout-customizable .si-single-top>.byline {
    margin-bottom: var(--hd-field-gap, 10px);
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top>.byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top>.byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top>.byline {
    margin-bottom: 0 !important;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-layout-order-title-below #postshow-a>.si-single-top {
    order: -10;
    margin-top: 0;
}

/* Meta style variants */
body.single.hd-layout-customizable.hd-meta-style-card .si-single-top {
    background: #f7f9fc;
    border: 1px solid #d4dce7;
    border-left: 0;
    border-radius: 10px;
    padding: 12px 16px;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-card .si-single-top .byline {
    padding: 6px 0;
    margin-bottom: 2px;
    border-bottom: 1px dashed #d9dfeb;
}

body.single.hd-layout-customizable.hd-meta-style-card .si-single-top .si-single-top-a>.byline:last-child {
    border-bottom: 0;
}

body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top {
    border-left: 0;
    padding-left: 0;
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 8px;
    margin-bottom: 18px;
    font-size: var(--hd-meta-font-size, 0.95rem);
    color: #555;
    line-height: 1.45;
    min-width: 0;
}

@media (max-width: 1180px) {
    body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top {
        font-size: var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 0.95rem));
    }
}

@media (max-width: 768px) {
    body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top {
        font-size: var(--hd-meta-font-size-mobile, var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 0.95rem)));
    }
}

body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top .byline>i {
    display: none;
}

body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top .byline {
    margin-bottom: 2px;
}

body.single.hd-layout-customizable.hd-meta-style-inline .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--hd-field-gap, 10px) 14px;
    border-left: 0;
    padding: 0;
    margin-top: 8px;
}

body.single.hd-layout-customizable.hd-meta-style-inline .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--hd-field-gap, 10px) 14px;
}

body.single.hd-layout-customizable.hd-meta-style-inline .si-single-top .byline {
    margin: 0;
    padding: 0;
    border-bottom: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    column-gap: 0;
    border-left: 0;
    padding: 0;
    margin-top: 8px;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    column-gap: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .byline {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border-bottom: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .byline+.byline::before {
    content: "•";
    margin: 0 10px;
    color: #8b95a4;
    font-size: 11px;
    line-height: 1;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top>.byline+.si-single-top-a::before {
    content: "•";
    margin: 0 10px;
    color: #8b95a4;
    font-size: 11px;
    line-height: 1;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 4px;
    column-gap: 0;
    border-left: 0;
    padding: 0;
    margin-top: 8px;
    font-size: var(--hd-meta-font-size, 0.93rem);
    line-height: 1.35;
    color: #4a5566;
}

@media (max-width: 1180px) {
    body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top {
        font-size: var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 0.93rem));
    }
}

@media (max-width: 768px) {
    body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top {
        font-size: var(--hd-meta-font-size-mobile, var(--hd-meta-font-size-tablet, var(--hd-meta-font-size, 0.93rem)));
    }
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 4px;
    column-gap: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 0;
    border-bottom: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline>i {
    display: none;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline+.byline::before {
    content: "·";
    margin: 0 8px;
    color: #9aa3b2;
    font-size: 12px;
    line-height: 1;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top>.byline+.si-single-top-a::before {
    content: "·";
    margin: 0 8px;
    color: #9aa3b2;
    font-size: 12px;
    line-height: 1;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    border-left: 0;
    padding: 0;
    margin-top: 8px;
    background: transparent;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top>.byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .byline {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 4px 10px;
    border: 1px solid #dbe4f0;
    border-radius: 999px;
    background: #f5f8fc;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    column-gap: 0;
    border: 1px solid #d9e0ea;
    border-radius: 8px;
    padding: 6px 10px;
    margin-top: 8px;
    background: #fff;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    column-gap: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    column-gap: 0;
    border-top: 1px solid #d9e0ea;
    border-bottom: 1px solid #d9e0ea;
    border-left: 0;
    border-right: 0;
    border-radius: 0;
    padding: 12px 0;
    margin-top: 16px;
    background: transparent;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    column-gap: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline {
    display: inline-flex;
    align-items: center;
    margin: 0 !important;
    padding: 2px 10px 2px 0;
    border-bottom: 0;
    position: relative;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline+.byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline+.byline {
    padding-left: 10px;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline+.byline::before,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline+.byline::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 14px;
    background: #d7dee9;
    transform: translateY(-50%);
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top>.byline+.si-single-top-a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top>.byline+.si-single-top-a {
    display: inline-flex;
    align-items: center;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top>.byline+.si-single-top-a::before,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top>.byline+.si-single-top-a::before {
    content: "";
    width: 1px;
    height: 14px;
    background: #d7dee9;
    margin: 0 10px 0 0;
}

@media (max-width: 768px) {

    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top {
        padding: 6px 8px;
        row-gap: 4px;
    }

    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline+.byline::before,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline+.byline::before,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top>.byline+.si-single-top-a::before,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top>.byline+.si-single-top-a::before {
        display: none;
    }

    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline {
        padding: 2px 8px 2px 0;
    }

    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline+.byline,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline+.byline,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top>.byline+.si-single-top-a,
    body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top>.byline+.si-single-top-a {
        padding-left: 0;
        margin-left: 0;
    }
}

body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    border-left: 0;
    padding: 0;
    background: transparent;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top>.byline,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
}

body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a {
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .byline {
    display: inline-flex;
    align-items: center;
    margin: 0;
    padding: 6px 12px;
    border: 1px solid #d7deea;
    border-radius: 999px;
    background: #fff;
}

body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a>.byline:last-child {
    margin: 0;
}

body.single.hd-layout-customizable.hd-meta-style-divider .si-single-top {
    border-left: 0;
    padding: 0;
}

body.single.hd-layout-customizable.hd-meta-style-divider .si-single-top .si-single-top-a {
    display: block;
}

body.single.hd-layout-customizable.hd-meta-style-divider .si-single-top .byline {
    margin: 0;
    padding: 8px 0;
    border-bottom: 1px solid #eceff4;
}

body.single.hd-layout-customizable.hd-meta-style-divider .si-single-top .byline:last-child {
    border-bottom: 0;
}

body.single.hd-layout-customizable.hd-meta-style-article-action-bar .si-single-top.si-article-action-bar,
.si-article-action-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--si-article-action-bar-gap, 16px);
    width: 100%;
    margin: 18px 0 22px;
    padding: var(--si-article-action-bar-padding-y, 14px) var(--si-article-action-bar-padding-x, 16px);
    border: 0;
    border-radius: var(--si-article-action-bar-radius, 20px);
    background: #050505;
    color: #fff;
    box-shadow: none;
    min-width: 0;
    --si-article-action-bar-avatar-size: 52px;
    --si-article-action-bar-button-size: 46px;
    --si-article-action-bar-button-padding: 14px;
    --si-article-action-bar-icon-size: 21px;
    --si-article-action-bar-author-size: clamp(0.96rem, 1.16vw, 1.16rem);
}

.si-article-action-bar__identity {
    display: flex;
    align-items: center;
    gap: 14px;
    flex: 1 1 auto;
    min-width: 0;
}

.si-article-action-bar__avatar {
    display: inline-flex;
    width: var(--si-article-action-bar-avatar-size, 52px);
    height: var(--si-article-action-bar-avatar-size, 52px);
    border-radius: 50%;
    overflow: hidden;
    flex: 0 0 auto;
    background: rgba(255, 255, 255, 0.12);
}

.si-article-action-bar__avatar img,
.si-article-action-bar__avatar-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.si-article-action-bar__copy {
    display: grid;
    gap: 0;
    min-width: 0;
}

.si-article-action-bar__headline {
    display: flex;
    align-items: baseline;
    gap: 10px;
    min-width: 0;
    color: #fff;
    font-size: var(--si-article-action-bar-author-size, 1.08rem);
    font-weight: 500;
    line-height: 1.22;
    margin: 0;
}

.si-article-action-bar__author,
.si-article-action-bar__role {
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.si-article-action-bar__author:hover {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 4px;
}

.si-article-action-bar__divider {
    color: rgba(255, 255, 255, 0.62);
    font-weight: 600;
}

.si-article-action-bar__meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 9px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.9rem;
    line-height: 1.35;
    margin: 0;
}

.si-article-action-bar__date,
.si-article-action-bar__category {
    color: inherit;
    text-decoration: none;
}

.si-article-action-bar__category:hover {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.si-article-action-bar__meta-separator {
    color: rgba(255, 255, 255, 0.42);
}

.si-article-action-bar__actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    margin-left: auto;
    max-width: 100%;
    min-width: 0;
}

.si-article-action-bar__actions>a,
.si-article-action-bar__actions>button {
    appearance: none;
    -webkit-appearance: none;
}

.si-article-action-bar__action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: var(--si-article-action-bar-button-size, 46px);
    min-height: var(--si-article-action-bar-button-size, 46px);
    padding: 0 var(--si-article-action-bar-button-padding, 14px);
    border: 1px solid rgba(148, 163, 184, 0.5);
    border-radius: 999px;
    background: transparent;
    color: #fff;
    font: inherit;
    font-weight: 760;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    transition: border-color .18s ease, background-color .18s ease, transform .18s ease;
}

.si-article-action-bar__action:hover,
.si-article-action-bar__action:focus-visible {
    border-color: rgba(255, 255, 255, 0.78);
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    text-decoration: none;
    transform: translateY(-1px);
}

.si-article-action-bar__action--preferred {
    min-width: 0;
    justify-content: flex-start;
    padding: 0 calc(var(--si-article-action-bar-button-padding, 14px) + 2px);
}

.si-article-action-bar__action--comments {
    gap: 8px;
}

.si-article-action-bar__action--facebook,
.si-article-action-bar__action--line,
.si-article-action-bar__action--x,
.si-article-action-bar__action--copy,
.si-article-action-bar__action--comments {
    width: var(--si-article-action-bar-button-size, 46px);
    height: var(--si-article-action-bar-button-size, 46px);
    flex: 0 0 var(--si-article-action-bar-button-size, 46px);
    padding: 0;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    width: var(--si-article-action-bar-button-size, 46px);
    height: var(--si-article-action-bar-button-size, 46px);
    min-width: var(--si-article-action-bar-button-size, 46px);
    min-height: var(--si-article-action-bar-button-size, 46px);
    max-width: var(--si-article-action-bar-button-size, 46px);
    max-height: var(--si-article-action-bar-button-size, 46px);
    padding: 0;
    margin: 0;
    border-radius: 999px;
    box-shadow: none;
    font-size: inherit;
    font-family: inherit;
    font-weight: 760;
    line-height: 1;
    opacity: 1;
    flex: 0 0 var(--si-article-action-bar-button-size, 46px);
    appearance: none;
    -webkit-appearance: none;
    vertical-align: middle;
    text-align: center;
    overflow: hidden;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn:hover,
.si-article-action-bar .si-article-action-bar__action.social-share-btn:focus-visible {
    box-shadow: none;
    opacity: 1;
}

.si-article-action-bar__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 0;
    width: var(--si-article-action-bar-icon-size, 21px);
    height: var(--si-article-action-bar-icon-size, 21px);
    font-weight: 900;
    line-height: 1;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn .si-article-action-bar__icon {
    margin: 0 !important;
}

.si-article-action-bar__action.isb-has-icon-fallback .si-article-action-bar__icon > i[class*="fa-"] {
    display: none;
}

.isb-fa-ready .si-article-action-bar__action.isb-has-icon-fallback .si-article-action-bar__icon > i[class*="fa-"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--si-article-action-bar-icon-size, 21px);
    height: var(--si-article-action-bar-icon-size, 21px);
    font-size: var(--si-article-action-bar-icon-size, 21px);
    line-height: 1;
}

.si-article-action-bar__action.isb-has-icon-fallback .isb-icon-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--si-article-action-bar-icon-size, 21px);
    height: var(--si-article-action-bar-icon-size, 21px);
    min-width: var(--si-article-action-bar-icon-size, 21px);
    min-height: var(--si-article-action-bar-icon-size, 21px);
    line-height: 1;
}

.isb-fa-ready .si-article-action-bar__action.isb-has-icon-fallback .isb-icon-fallback {
    display: none;
}

.si-article-action-bar__icon .isb-icon-fallback-svg,
.si-article-action-bar__comment-icon svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: currentColor;
}

.si-article-action-bar__action--comments .si-article-action-bar__icon {
    gap: 0.2em;
}

.si-article-action-bar__comment-count {
    font-size: 0.76em;
    font-weight: 850;
    line-height: 1;
}

.si-article-action-bar__glyph {
    font-size: 0.76em;
    font-weight: 850;
    letter-spacing: -0.04em;
}

.si-article-action-bar__action--facebook .si-article-action-bar__icon,
.si-article-action-bar__action--x .si-article-action-bar__icon,
.si-article-action-bar__action--copy .si-article-action-bar__icon,
.si-article-action-bar__action--comments .si-article-action-bar__icon {
    font-size: var(--si-article-action-bar-icon-size, 21px);
}

.si-article-action-bar__action--line .si-article-action-bar__icon {
    --si-article-action-bar-icon-size: 23px;
    font-size: var(--si-article-action-bar-icon-size, 23px);
    letter-spacing: -0.04em;
}

.si-article-action-bar__label {
    font-size: 0.96rem;
    line-height: 1.2;
    white-space: nowrap;
}

.si-article-action-bar__action:not(.si-article-action-bar__action--preferred) .si-article-action-bar__label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.si-article-action-bar__action--personal:not(.si-article-action-bar__action--preferred) {
    width: auto;
    height: var(--si-article-action-bar-button-size, 46px);
    flex: 0 0 auto;
    min-width: 0;
    padding: 0 calc(var(--si-article-action-bar-button-padding, 14px) + 2px);
}

.si-article-action-bar__action--personal:not(.si-article-action-bar__action--preferred) .si-article-action-bar__label {
    position: static;
    width: auto;
    height: auto;
    padding: 0;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: nowrap;
    border: 0;
}

.si-article-action-bar__action--show-desktop,
.si-article-action-bar__action--show-tablet,
.si-article-action-bar__action--show-mobile {
    display: none !important;
}

@media (min-width: 901px) {
    .si-article-action-bar--no-desktop-actions .si-article-action-bar__actions {
        display: none !important;
    }

    .si-article-action-bar__action--show-desktop {
        display: inline-flex !important;
    }
}

@media (min-width: 641px) and (max-width: 900px) {
    .si-article-action-bar--no-tablet-actions .si-article-action-bar__actions {
        display: none !important;
    }

    .si-article-action-bar__action--show-tablet {
        display: inline-flex !important;
    }
}

@media (max-width: 640px) {
    .si-article-action-bar--no-mobile-actions .si-article-action-bar__actions {
        display: none !important;
    }

    .si-article-action-bar__action--show-mobile {
        display: inline-flex !important;
    }
}

.si-article-action-bar--size-compact {
    --si-article-action-bar-avatar-size: 44px;
    --si-article-action-bar-button-size: 40px;
    --si-article-action-bar-button-padding: 11px;
    --si-article-action-bar-icon-size: 19px;
    --si-article-action-bar-padding-y: 11px;
    --si-article-action-bar-padding-x: 13px;
    --si-article-action-bar-radius: 16px;
    --si-article-action-bar-author-size: 0.98rem;
}

.si-article-action-bar--size-large {
    --si-article-action-bar-avatar-size: 60px;
    --si-article-action-bar-button-size: 52px;
    --si-article-action-bar-button-padding: 16px;
    --si-article-action-bar-icon-size: 24px;
    --si-article-action-bar-padding-y: 17px;
    --si-article-action-bar-padding-x: 20px;
    --si-article-action-bar-radius: 24px;
    --si-article-action-bar-author-size: clamp(1.08rem, 1.3vw, 1.28rem);
}

.si-article-action-bar--buttons-native .si-article-action-bar__action {
    border-color: transparent;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--facebook {
    background: #1877f2;
    color: #fff;
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--line {
    background: #06c755;
    color: #fff;
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--x {
    background: #111;
    color: #fff;
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--copy,
.si-article-action-bar--buttons-native .si-article-action-bar__action--comments,
.si-article-action-bar--buttons-native .si-article-action-bar__action--profile,
.si-article-action-bar--buttons-native .si-article-action-bar__action--author_archive,
.si-article-action-bar--buttons-native .si-article-action-bar__action--website {
    background: rgba(255, 255, 255, 0.16);
    color: #fff;
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--copy {
    border-color: rgba(255, 255, 255, 0.58);
    background: rgba(15, 23, 42, 0.42);
    color: #fff;
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--copy:hover,
.si-article-action-bar--buttons-native .si-article-action-bar__action--copy:focus-visible {
    border-color: rgba(255, 255, 255, 0.86);
    background: rgba(15, 23, 42, 0.58);
}

.si-article-action-bar--buttons-native .si-article-action-bar__action--preferred {
    background: #fff;
    color: #111827;
}

.si-article-action-bar--buttons-soft .si-article-action-bar__action {
    border-color: transparent;
    background: rgba(255, 255, 255, 0.12);
}

.si-article-action-bar--buttons-solid .si-article-action-bar__action {
    border-color: #fff;
    background: #fff;
    color: #111827;
}

.si-article-action-bar--buttons-solid .si-article-action-bar__action:hover,
.si-article-action-bar--buttons-solid .si-article-action-bar__action:focus-visible {
    color: #111827;
}

body.single.hd-layout-customizable.hd-meta-style-article-action-bar-light .si-single-top.si-article-action-bar,
.si-article-action-bar.si-article-action-bar--light {
    border: 1px solid rgba(226, 232, 240, 0.92);
    background: linear-gradient(135deg, #fff 0%, #fbfcff 58%, #f8fafc 100%);
    color: #111827;
}

.si-article-action-bar--light .si-article-action-bar__avatar {
    background: rgba(15, 23, 42, 0.08);
}

.si-article-action-bar--light .si-article-action-bar__headline {
    color: #111827;
}

.si-article-action-bar--light .si-article-action-bar__divider {
    color: rgba(71, 85, 105, 0.56);
}

.si-article-action-bar--light .si-article-action-bar__meta {
    color: #64748b;
}

.si-article-action-bar--light .si-article-action-bar__meta-separator {
    color: rgba(100, 116, 139, 0.48);
}

.si-article-action-bar--light .si-article-action-bar__action {
    border-color: rgba(148, 163, 184, 0.48);
    background: rgba(255, 255, 255, 0.72);
    color: #111827;
}

.si-article-action-bar--light .si-article-action-bar__action:hover,
.si-article-action-bar--light .si-article-action-bar__action:focus-visible {
    border-color: rgba(51, 65, 85, 0.44);
    background: #fff;
    color: #111827;
}

.si-article-action-bar--light .si-article-action-bar__action--preferred {
    background: #fff;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--facebook {
    border-color: transparent;
    background: #1877f2;
    color: #fff;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--line {
    border-color: transparent;
    background: #06c755;
    color: #fff;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--x {
    border-color: transparent;
    background: #111;
    color: #fff;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--preferred {
    border-color: transparent;
    background: #fff;
    color: #111827;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy,
.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--comments,
.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--profile,
.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--author_archive,
.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--website {
    border-color: rgba(148, 163, 184, 0.36);
    background: #f8fafc;
    color: #111827;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy {
    border-color: rgba(17, 24, 39, 0.72);
    background: #f8fafc;
    color: #111827;
}

.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy:hover,
.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy:focus-visible {
    border-color: #111827;
    background: #fff;
    color: #111827;
}

.si-article-action-bar--light.si-article-action-bar--buttons-soft .si-article-action-bar__action {
    border-color: transparent;
    background: #f1f5f9;
    color: #111827;
}

.si-article-action-bar--light.si-article-action-bar--buttons-solid .si-article-action-bar__action {
    border-color: #111827;
    background: #111827;
    color: #fff;
}

@media (max-width: 900px) {
    .si-article-action-bar {
        align-items: flex-start;
        flex-direction: column;
        border-radius: 22px;
        padding: 16px;
    }

    .si-article-action-bar__actions {
        width: 100%;
        justify-content: flex-start;
        align-self: flex-start;
        margin-left: 0;
        margin-right: auto;
    }

    .si-article-action-bar--mobile-actions-center .si-article-action-bar__actions {
        align-self: center;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
    }

    .si-article-action-bar--mobile-actions-right .si-article-action-bar__actions {
        align-self: flex-end;
        justify-content: flex-end;
        margin-left: auto;
        margin-right: 0;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide.si-article-action-bar {
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide .si-article-action-bar__identity {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide .si-article-action-bar__copy {
        min-width: 0;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide .si-article-action-bar__actions {
        align-self: center;
        flex: 0 0 auto;
        justify-content: flex-end;
        margin-left: auto;
        margin-right: 0;
        max-width: none;
        overflow: visible;
        width: auto;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide.is-action-bar-actions-hidden .si-article-action-bar__actions {
        display: none;
    }

    .si-article-action-bar__identity {
        width: 100%;
    }
}

@media (max-width: 640px) {
    .si-article-action-bar {
        margin: 14px 0 18px;
        padding: 12px;
        border-radius: 18px;
        --si-article-action-bar-avatar-size: 44px;
        --si-article-action-bar-button-size: 40px;
        --si-article-action-bar-icon-size: 20px;
        --si-article-action-bar-gap: 10px;
    }

    .si-article-action-bar__avatar {
        width: var(--si-article-action-bar-avatar-size, 46px);
        height: var(--si-article-action-bar-avatar-size, 46px);
    }

    .si-article-action-bar__headline {
        font-size: var(--si-article-action-bar-author-size, 1.02rem);
        gap: 7px;
        flex-wrap: wrap;
    }

    .si-article-action-bar__meta {
        font-size: 0.86rem;
        display: grid;
        align-items: start;
        gap: 4px;
        width: 100%;
    }

    .si-article-action-bar__meta-separator {
        display: none;
    }

    .si-article-action-bar__category {
        display: block;
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .si-article-action-bar__actions {
        gap: 7px;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        width: fit-content;
        max-width: 100%;
        padding: 2px 1px 4px;
        scrollbar-width: none;
    }

    .si-article-action-bar--mobile-actions-left .si-article-action-bar__actions {
        align-self: flex-start;
        justify-content: flex-start;
        margin-left: 0;
        margin-right: auto;
    }

    .si-article-action-bar--mobile-actions-center .si-article-action-bar__actions {
        align-self: center;
        justify-content: center;
        margin-left: auto;
        margin-right: auto;
    }

    .si-article-action-bar--mobile-actions-right .si-article-action-bar__actions {
        align-self: flex-end;
        justify-content: flex-end;
        margin-left: auto;
        margin-right: 0;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide.si-article-action-bar {
        align-items: center;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide .si-article-action-bar__identity {
        flex: 1 1 auto;
        min-width: 0;
        width: auto;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide .si-article-action-bar__actions {
        align-self: center;
        flex: 0 0 auto;
        justify-content: flex-end;
        margin-left: auto;
        margin-right: 0;
        max-width: none;
        overflow: visible;
        padding: 0;
        width: auto;
    }

    .si-article-action-bar--mobile-actions-inline-right-hide.is-action-bar-actions-hidden .si-article-action-bar__actions {
        display: none;
    }

    .si-article-action-bar__actions::-webkit-scrollbar {
        display: none;
    }

    .si-article-action-bar__action {
        min-width: var(--si-article-action-bar-button-size, 46px);
        min-height: var(--si-article-action-bar-button-size, 46px);
        padding: 0 var(--si-article-action-bar-button-padding, 12px);
    }

    .si-article-action-bar__action--preferred {
        width: auto;
        max-width: 100%;
        flex: 0 0 auto;
        justify-content: center;
    }
}

/* Single 3 - featured image below title (wide hero mode) */
#post-wrapper.si-3-featured-title-below>[id^="post-"] {
    display: flex;
    flex-direction: column;
}

/* Single 3 - configurable widths (title / meta / breadcrumb) */
.main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb {
    width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto 16px;
}

#post-wrapper.si-3-layout>[id^="post-"]>.entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

#post-wrapper.si-3-layout>[id^="post-"]>.si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
}

/* Keep unspecified direct children after the main reordered blocks.
   Without this, default order:0 elements can jump above the title. */
#post-wrapper.si-3-featured-title-below>[id^="post-"]>* {
    order: 100;
}

#post-wrapper.si-3-featured-title-below>[id^="post-"]>.entry-header {
    order: 10;
}

#post-wrapper.si-3-featured-title-below>[id^="post-"]>#arcs-single-filter,
#post-wrapper.si-3-featured-title-below>[id^="post-"]>.si-hero-media-container,
#post-wrapper.si-3-featured-title-below>[id^="post-"]>.modern-landscape-side-by-side {
    order: 20;
}

#post-wrapper.si-3-featured-title-below>[id^="post-"]>.landscape-side-by-side__captions {
    order: 21;
}

#post-wrapper.si-3-featured-title-below>[id^="post-"]>.si-single-top {
    order: 30;
    margin-top: 0;
}

#post-wrapper.si-3-featured-title-below>[id^="post-"]>#si-single-content {
    order: 40;
}

#post-wrapper.si-3-featured-title-below>[id^="post-"]>#arcs-single-filter,
#post-wrapper.si-3-featured-title-below>[id^="post-"]>.si-hero-media-container,
#post-wrapper.si-3-featured-title-below>[id^="post-"]>.modern-landscape-side-by-side,
#post-wrapper.si-3-featured-title-below>[id^="post-"]>.landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin: 0 auto var(--hd-section-gap, 16px);
}

/* Final desktop centering pass for customizable layouts.
   Some order-variant rules above still set left/translate centering and can drift in flex AB. */
body.single.hd-layout-customizable #breadcrumb,
body.single.hd-layout-customizable .main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header,
body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.entry-header,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-title-top,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.si-single-top,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-single-top,
body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.si-single-top,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-single-top,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-thumbnail,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.landscape-side-by-side__captions,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>#arcs-single-filter,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.si-hero-media-container,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.modern-landscape-side-by-side,
body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.landscape-side-by-side__captions,
body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>#arcs-single-filter,
body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.si-hero-media-container,
body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.modern-landscape-side-by-side,
body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.landscape-side-by-side__captions {
    left: auto;
    transform: none;
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto):not(.hd-cw-fullwidth) .main-layout-wrapper>#postshow-a {
    flex: 0 1 var(--hd-main-column-width, 1000px);
    width: var(--hd-main-column-width, 1000px);
    max-width: var(--hd-main-column-width, 1000px);
}

/* When A-column is 'auto', remove the base max-width cap so it fills available space. */
body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto .main-layout-wrapper>#postshow-a,
body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto .main-layout-wrapper>#content-main,
body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-aw-auto .main-layout-wrapper>#postshow-a,
body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-aw-auto .main-layout-wrapper.si-3-main-layout>#content-main {
    flex: 1 1 0%;
    min-width: 0;
    max-width: none;
    width: 100%;
}

/* Ensure fixed A width + B width can coexist; avoid B being pushed below. */
body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto):not(.hd-cw-fullwidth) .main-layout-wrapper {
    max-width: min(max(var(--hd-ab-container-width-active, 1600px), calc(var(--hd-main-column-width, 1000px) + var(--hd-sidebar-width, 280px) + var(--hd-sidebar-gap, 0px))), var(--hd-inline-safe-width, calc(100vw - 24px)));
}

body.single.hd-layout-customizable.hd-lm-ab .main-layout-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}

body.single.hd-layout-customizable.hd-lm-ab .main-layout-wrapper>#postshow-b {
    flex: 0 0 var(--hd-sidebar-width, 280px);
    width: var(--hd-sidebar-width, 280px);
    margin-left: var(--hd-sidebar-gap, 0px);
}

/* Fix for AB layout column gap: prevent A-column auto margin from stretching the space */
@media (min-width: 769px) {

    body.single.hd-layout-customizable.hd-lm-ab .main-layout-wrapper>#postshow-a,
    body.single.hd-layout-customizable.hd-lm-ab .main-layout-wrapper>#content-main {
        flex: 1;
        min-width: 0;
        margin-left: 0;
        margin-right: 0;
    }

    body.single.hd-layout-customizable.hd-lm-ab>article.container>#postshow-a,
    body.single.hd-layout-customizable.hd-lm-ab #container-all>article.container>#postshow-a {
        margin-right: 0 !important;
    }
}

/* AB 欄位下，圖區寬度不得超過 A 欄，避免 vw 規則造成視覺偏移。 */
@media (min-width: 769px) {

    body.single.hd-layout-customizable.hd-lm-ab #breadcrumb,
    body.single.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb {
        width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.si-title-top {
        width: min(var(--hd-title-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.si-single-top {
        width: min(var(--hd-meta-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) #post-wrapper>[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) #post-wrapper>[id^="post-"]>.social-share-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) #post-wrapper>[id^="post-"]>.post-navigation,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) #post-wrapper>[id^="post-"]>.author-box-container,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) main#postshow-a article[id^="post-"] .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) main#postshow-a article[id^="post-"] .social-share-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) main#postshow-a article[id^="post-"] .post-navigation,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) main#postshow-a article[id^="post-"] .author-box-container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto) #postshow-a .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto) #postshow-a .social-share-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto) #postshow-a .post-navigation,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto) #postshow-a .author-box-container {
        width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 100%);
        max-width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 100%);
        position: static;
        left: auto;
        transform: none;
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto #post-wrapper>[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto #post-wrapper>[id^="post-"]>.social-share-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto #post-wrapper>[id^="post-"]>.post-navigation,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto #post-wrapper>[id^="post-"]>.author-box-container,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto main#postshow-a article[id^="post-"] .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto main#postshow-a article[id^="post-"] .social-share-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto main#postshow-a article[id^="post-"] .post-navigation,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto main#postshow-a article[id^="post-"] .author-box-container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-aw-auto #postshow-a .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-aw-auto #postshow-a .social-share-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-aw-auto #postshow-a .post-navigation,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-aw-auto #postshow-a .author-box-container {
        width: min(var(--hd-content-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
        position: static;
        left: auto;
        transform: none;
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) #post-wrapper>[id^="post-"]>.hd-related-posts-container,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) #post-wrapper>[id^="post-"]>.alm-section-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) main#postshow-a>article[id^="post-"]>.hd-related-posts-container,
    body.single.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto) main#postshow-a>article[id^="post-"]>.alm-section-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto) #postshow-a>.hd-related-posts-container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto) #postshow-a>.alm-section-wrapper {
        width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 100%);
        max-width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 100%);
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto #post-wrapper>[id^="post-"]>.hd-related-posts-container,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto #post-wrapper>[id^="post-"]>.alm-section-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto main#postshow-a>article[id^="post-"]>.hd-related-posts-container,
    body.single.hd-layout-customizable.hd-lm-ab.hd-aw-auto main#postshow-a>article[id^="post-"]>.alm-section-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-aw-auto #postshow-a>.hd-related-posts-container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-aw-auto #postshow-a>.alm-section-wrapper {
        width: min(var(--hd-content-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.post-thumbnail,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper #arcs-single-filter,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper .si-hero-media-container,
    body.single.hd-layout-customizable.hd-lm-ab #postshow-a #arcs-single-filter,
    body.single.hd-layout-customizable.hd-lm-ab #postshow-a .si-hero-media-container,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper .modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-lm-ab #postshow-a .modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper .landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-lm-ab #postshow-a .landscape-side-by-side__captions {
        width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
        margin-left: auto;
        margin-right: auto;
    }
}

/* Full 模式：關閉 B 欄，A 欄獨佔。 */
body.single.hd-layout-customizable.hd-lm-full .main-layout-wrapper {
    max-width: min(var(--hd-content-max-width-active, 1000px), var(--hd-inline-safe-width, 100%));
}

body.single.hd-layout-customizable.hd-lm-full.hd-cw-fullwidth .main-layout-wrapper {
    max-width: 100%;
}

body.single.hd-layout-customizable.hd-lm-full .main-layout-wrapper>#postshow-b {
    display: none;
}

body.single.hd-layout-customizable.hd-lm-full .main-layout-wrapper>#postshow-a {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* Layout 3 full mode keeps B hidden when sidebar node exists. */
body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-full:not(.hd-aw-auto) .main-layout-wrapper.si-3-main-layout {
    max-width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), var(--hd-inline-safe-width, 100%)) !important;
}

body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-full.hd-aw-auto .main-layout-wrapper.si-3-main-layout {
    max-width: min(var(--hd-content-max-width-active, 1000px), var(--hd-inline-safe-width, 100%)) !important;
}

body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-full.hd-cw-fullwidth .main-layout-wrapper.si-3-main-layout {
    max-width: 100%;
}

body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-full .main-layout-wrapper.si-3-main-layout>#postshow-b {
    display: none;
}

body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-full .main-layout-wrapper.si-3-main-layout>#content-main {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

/* Layout 4 uses legacy structure: #postshow-a/#postshow-b directly under article.container. */
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab>article.container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #container-all>article.container {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    max-width: min(var(--hd-ab-container-width-active, 1600px), 100%);
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-cw-fullwidth>article.container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-cw-fullwidth #container-all>article.container {
    max-width: 100%;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab>article.container>#postshow-a,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #container-all>article.container>#postshow-a {
    flex: 1 1 0%;
    min-width: 0;
    max-width: none;
    width: 100%;
    margin-left: 0;
    margin-right: 0;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto):not(.hd-cw-fullwidth)>article.container>#postshow-a,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab:not(.hd-aw-auto):not(.hd-cw-fullwidth) #container-all>article.container>#postshow-a {
    flex: 0 1 var(--hd-main-column-width, 1000px);
    width: var(--hd-main-column-width, 1000px);
    max-width: var(--hd-main-column-width, 1000px);
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab>article.container>#postshow-b,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #container-all>article.container>#postshow-b {
    flex: 0 0 var(--hd-sidebar-width, 280px);
    width: var(--hd-sidebar-width, 280px);
    margin-left: var(--hd-sidebar-gap, 0px);
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full:not(.hd-aw-auto)>article.container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full:not(.hd-aw-auto) #container-all>article.container {
    max-width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 1200px);
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full.hd-aw-auto>article.container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full.hd-aw-auto #container-all>article.container {
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full.hd-cw-fullwidth>article.container,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full.hd-cw-fullwidth #container-all>article.container {
    max-width: 100%;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full>article.container>#postshow-b,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full #container-all>article.container>#postshow-b {
    display: none;
}

body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full>article.container>#postshow-a,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-full #container-all>article.container>#postshow-a {
    width: 100%;
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* B 欄顯示控制（Desktop / Tablet / Mobile） */
@media (min-width: 1200px) {

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-show .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvd-show .main-layout-wrapper.si-3-main-layout>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-show>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-show #container-all>article.container>#postshow-b {
        display: block !important;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-hide>.container,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-hide #container-all>.container {
        max-width: min(calc(var(--hd-content-max-width-active, 1000px) + 30px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-hide .main-layout-wrapper {
        max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-hide .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide #container-all>article.container>#postshow-b {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-hide .main-layout-wrapper>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide>article.container>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide #container-all>article.container>#postshow-a {
        flex: 1 1 100%;
        width: 100%;
        max-width: none;
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvd-hide:not(.hd-aw-auto) .main-layout-wrapper.si-3-main-layout {
        max-width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 100%);
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvd-hide.hd-aw-auto .main-layout-wrapper.si-3-main-layout {
        max-width: 100%;
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvd-hide .main-layout-wrapper.si-3-main-layout>#postshow-b {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvd-hide .main-layout-wrapper.si-3-main-layout>#content-main {
        flex: 1 1 100%;
        width: 100%;
        max-width: none;
    }

    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide:not(.hd-aw-auto)>article.container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide:not(.hd-aw-auto) #container-all>article.container {
        max-width: min(var(--hd-main-column-width, var(--hd-content-max-width-active, 1000px)), 100%);
    }

    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide.hd-aw-auto>article.container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvd-hide.hd-aw-auto #container-all>article.container {
        max-width: 100%;
    }
}

@media (min-width: 769px) and (max-width: 1199px) {

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show #container-all>article.container>#postshow-b {
        display: block !important;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-hide>.container,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-hide #container-all>.container {
        max-width: min(calc(var(--hd-content-max-width-active, 1000px) + 30px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-hide .main-layout-wrapper {
        max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-hide .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-hide>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-hide #container-all>article.container>#postshow-b {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-hide .main-layout-wrapper>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-hide>article.container>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-hide #container-all>article.container>#postshow-a {
        flex: 1 1 100%;
        width: 100%;
        max-width: none;
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-hide .main-layout-wrapper.si-3-main-layout {
        max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-hide .main-layout-wrapper.si-3-main-layout>#postshow-b {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-hide .main-layout-wrapper.si-3-main-layout>#content-main {
        flex: 1 1 100%;
        width: 100%;
        max-width: none;
    }

    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-hide>article.container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-hide #container-all>article.container {
        max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
    }
}

@media (min-width: 769px) and (max-width: 1180px) {

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--hd-section-gap, 16px);
        max-width: min(var(--hd-content-max-width-active, 1000px), var(--hd-inline-safe-width, 100%));
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout>#content-main,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show>article.container>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show #container-all>article.container>#postshow-a {
        flex: none;
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show #container-all>article.container>#postshow-b {
        display: block !important;
        flex: none;
        width: 100%;
        max-width: min(var(--hd-sidebar-width, 280px), 100%);
        margin: 0 auto;
    }
}

@media (max-width: 768px) {

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-hide .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-hide .main-layout-wrapper.si-3-main-layout>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-hide>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-hide #container-all>article.container>#postshow-b {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-show .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-show .main-layout-wrapper.si-3-main-layout>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show #container-all>article.container>#postshow-b {
        display: block !important;
        margin-left: 0 !important;
    }
}

@media (min-width: 641px) and (max-width: 768px) {

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-hide .main-layout-wrapper,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-show .main-layout-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-hide .main-layout-wrapper.si-3-main-layout,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-show .main-layout-wrapper.si-3-main-layout,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-hide > article.container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show > article.container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-hide #container-all > article.container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show #container-all > article.container {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--hd-section-gap, 16px);
        max-width: min(var(--hd-content-max-width-active, 1000px), var(--hd-inline-safe-width, 100%));
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-hide .main-layout-wrapper > #content-main,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-hide .main-layout-wrapper > #postshow-a,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-show .main-layout-wrapper > #content-main,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-show .main-layout-wrapper > #postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-hide .main-layout-wrapper.si-3-main-layout > #content-main,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-show .main-layout-wrapper.si-3-main-layout > #content-main,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-hide > article.container > #postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show > article.container > #postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-hide #container-all > article.container > #postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show #container-all > article.container > #postshow-a {
        flex: none;
        width: 100%;
        max-width: none;
        min-width: 0;
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvm-show .main-layout-wrapper > #postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvm-show .main-layout-wrapper.si-3-main-layout > #postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show > article.container > #postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvm-show #container-all > article.container > #postshow-b {
        flex: none;
        width: 100%;
        max-width: min(var(--hd-sidebar-width, 280px), 100%);
        min-width: 0;
        margin: 0 auto !important;
    }
}

/* AB 右欄強化樣式（各版型共用）。 */
body.single.hd-layout-customizable.hd-lm-ab.hd-sws-card .main-layout-wrapper>#postshow-b>*,
body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-sws-card .main-layout-wrapper.si-3-main-layout>#postshow-b>*,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-sws-card>article.container>#postshow-b>*,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #container-all>article.container>#postshow-b>* {
    background: #fff;
    border: 1px solid #dfe5ee;
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(19, 35, 62, 0.08);
    padding: 12px;
    margin-bottom: 14px;
}

body.single.hd-layout-customizable.hd-lm-ab.hd-sws-soft .main-layout-wrapper>#postshow-b>*,
body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-sws-soft .main-layout-wrapper.si-3-main-layout>#postshow-b>*,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-sws-soft>article.container>#postshow-b>*,
body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-sws-soft #container-all>article.container>#postshow-b>* {
    background: linear-gradient(180deg, #f7f9fc 0%, #f1f4f9 100%);
    border: 1px solid #e7ebf2;
    border-radius: 12px;
    padding: 10px 12px;
    margin-bottom: 12px;
}

body.single.hd-layout-customizable.hd-lm-ab.hd-sws-card #postshow-b .sidebar-title,
body.single.hd-layout-customizable.hd-lm-ab.hd-sws-soft #postshow-b .sidebar-title {
    margin: 0 0 10px;
    font-weight: 700;
}

/* 分享按鈕模式：偏內嵌時隱藏浮動軌；偏浮動時隱藏內嵌區塊。 */
body.single.hd-layout-customizable.hd-share-inline .isb-share-container.isb-float-left,
body.single.hd-layout-customizable.hd-share-inline .isb-share-container.isb-float-right,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-inline .isb-share-container.isb-float-left,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-inline .isb-share-container.isb-float-right,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-inline .isb-share-container.isb-float-left,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-inline .isb-share-container.isb-float-right {
    display: none !important;
}

body.single.hd-layout-customizable.hd-share-float #post-wrapper>[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-share-float #post-wrapper>[id^="post-"]>.social-share-wrapper,
body.single.hd-layout-customizable.hd-share-float main#postshow-a>article[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-share-float main#postshow-a>article[id^="post-"]>.social-share-wrapper,
body.single.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a>.social-share-wrapper,
body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float>.social-share-wrapper,
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float>.social-share-wrapper,
body.single.hd-layout-customizable.hd-share-float .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-share-float .social-share-wrapper {
    display: none !important;
}

/*
 * The Box primary share block can embed inline-share-button inside
 * `.social-share-wrapper`. Keep that embedded renderer visible even when the
 * page-level share mode is set to float, otherwise the page hides the ISB
 * module and leaves only legacy text/links behind.
 */
body.single.hd-layout-customizable .social-share-wrapper .social-module-group--isb>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right) {
    display: flex !important;
    width: auto !important;
    max-width: none !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

@media (min-width: 769px) {

    body.single.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-right,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float .isb-share-container.isb-float-right,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float .isb-share-container.isb-float-right {
        display: block !important;
    }
}

@media (max-width: 768px) {

    body.single.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-right,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float .isb-share-container.isb-float-right,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float .isb-share-container.isb-float-right {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-share-float #post-wrapper>[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-share-float #post-wrapper>[id^="post-"]>.social-share-wrapper,
    body.single.hd-layout-customizable.hd-share-float main#postshow-a>article[id^="post-"]>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-share-float main#postshow-a>article[id^="post-"]>.social-share-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a>.social-share-wrapper,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"].hd-share-float>.social-share-wrapper,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float>.isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"].hd-share-float>.social-share-wrapper,
    body.single.hd-layout-customizable.hd-share-float .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-share-float .social-share-wrapper {
        display: block !important;
    }
}

/* 分享按鈕模式：浮動（外層）使用固定 rail，不再讓文章內容欄位內縮。 */
body.single.hd-layout-customizable.hd-share-float_outer .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
body.single.hd-layout-customizable.hd-share-float_outer .social-share-wrapper {
    display: none !important;
}

body.single.hd-layout-customizable.hd-share-float_outer .isb-share-container.isb-float-left,
body.single.hd-layout-customizable.hd-share-float_outer .isb-share-container.isb-float-right {
    display: inline-flex !important;
}

@media (max-width: 768px) {

    body.single.hd-layout-customizable.hd-share-float_outer .isb-share-container.isb-float-left,
    body.single.hd-layout-customizable.hd-share-float_outer .isb-share-container.isb-float-right {
        display: none !important;
    }

    body.single.hd-layout-customizable.hd-share-float_outer .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
    body.single.hd-layout-customizable.hd-share-float_outer .social-share-wrapper {
        display: block !important;
    }
}

/* 無限捲動相容：移除空白廣告容器，避免上方出現多餘空隙。 */
body.single.hd-layout-customizable.hd-inf-stable .ad-container-top:empty {
    display: none !important;
}

/* 2-6 佈局特定修正（鎖定在文章層級） */
.si-26-split-inspired {
    width: 100%;
    max-width: 100% !important;
}

.si-26-top-hero {
    max-width: 1200px;
    margin: 0 auto 24px;
}

/* body.is-active-layout-2-6 .main-layout-wrapper {
display: block !important;
} */

/* 移除以下會導致版面震動的規則 */
/* body.is-active-layout-2-6 .main-layout-wrapper > #postshow-b {
display: none !important;
} */



.si-26-split-inspired>[id^="post-"],
.si-26-top-hero__grid {
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
    grid-template-areas:
        "media header"
        "media meta"
        "content content";
    column-gap: 28px;
    row-gap: 14px;
}

.si-26-top-hero__grid {
    grid-template-areas:
        "media header"
        "media meta";
}

.si-26-split-inspired>[id^="post-"]>#arcs-single-filter,
.si-26-split-inspired>[id^="post-"]>.si-hero-media-container,
.si-26-top-hero__grid>#arcs-single-filter,
.si-26-top-hero__grid>.si-hero-media-container {
    grid-area: media;
    margin: 0;
    background: #e4e7eb;
}

.si-26-split-inspired>[id^="post-"]>#arcs-single-filter>figure,
.si-26-split-inspired>[id^="post-"]>.si-hero-media-container>figure,
.si-26-top-hero__grid>#arcs-single-filter>figure,
.si-26-top-hero__grid>.si-hero-media-container>figure {
    margin: 0;
    height: 100%;
    min-height: 360px;
    overflow: hidden;
    position: relative;
}

.si-26-split-inspired>[id^="post-"]>#arcs-single-filter .full-full,
.si-26-top-hero__grid>#arcs-single-filter .full-full {
    margin: 0;
    height: 100%;
    min-height: 360px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #dfe3e8;
    aspect-ratio: auto !important;
}

.si-26-split-inspired>[id^="post-"]>#arcs-single-filter .full-full img,
.si-26-split-inspired>[id^="post-"]>#arcs-single-filter>figure>img,
.si-26-top-hero__grid>#arcs-single-filter .full-full img,
.si-26-top-hero__grid>#arcs-single-filter>figure>img {
    width: 100%;
    height: 100%;
    max-height: none !important;
    display: block;
    object-fit: contain;
}

.si-26-split-inspired>[id^="post-"]>.entry-header,
.si-26-top-hero__grid>.entry-header {
    grid-area: header;
    display: block;
    visibility: visible;
    opacity: 1;
    margin: 0;
    padding: 0;
}

.si-26-split-inspired>[id^="post-"]>.si-single-top,
.si-26-top-hero__grid>.si-single-top {
    grid-area: meta;
    display: flex;
    visibility: visible;
    opacity: 1;
    margin: 0;
    padding: 0;
    border-left: 0;
    min-width: 0;
    flex-direction: column;
    gap: 10px;
}

.si-26-split-inspired .entry-title {
    margin: 10px auto;
    font-size: clamp(2rem, 3.2vw, 2.8rem);
    line-height: 1.25;
}

.si-26-split-inspired .si-single-top-a {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
}

.si-26-split-inspired .si-single-top .byline {
    margin: 0;
}

.main-layout-wrapper.si-26-bottom-columns .si-26-split-inspired>[id^="post-"] {
    display: block;
}

.main-layout-wrapper.si-26-bottom-columns .si-26-split-inspired #si-single-content {
    margin-top: 0;
}

.infinite-scroll-post.si-26-split-inspired,
.infinite-scroll-post.si-23-visual-inspired {
    display: flex;
    flex-direction: column;
}

.infinite-scroll-post.si-26-split-inspired>*,
.infinite-scroll-post.si-23-visual-inspired>* {
    order: 100;
}

.infinite-scroll-post.si-26-split-inspired>[id^="post-"],
.infinite-scroll-post.si-26-split-inspired>#si-single-content,
.infinite-scroll-post.si-23-visual-inspired>[id^="post-"],
.infinite-scroll-post.si-23-visual-inspired>#si-single-content {
    display: block;
}

.infinite-scroll-post.si-26-split-inspired #si-single-content,
.infinite-scroll-post.si-23-visual-inspired #si-single-content {
    margin-top: 0;
}

/* Specific Ordering for si-23/si-26 children */
.infinite-scroll-post.si-23-visual-inspired>#breadcrumb,
.infinite-scroll-post.si-26-split-inspired>#breadcrumb {
    order: 5;
}

.infinite-scroll-post.si-23-visual-inspired>.si-23-top,
.infinite-scroll-post.si-23-visual-inspired>.si-single-top,
.infinite-scroll-post.si-26-split-inspired>.si-26-top-hero {
    order: 10;
}

.infinite-scroll-post.si-23-visual-inspired>.si-hero-media-container,
.infinite-scroll-post.si-26-split-inspired>.si-hero-media-container {
    order: 20;
}

.infinite-scroll-post.si-23-visual-inspired>#si-single-content,
.infinite-scroll-post.si-26-split-inspired>#si-single-content {
    order: 30;
}

.si-26-split-inspired #si-single-content {
    grid-area: content;
    width: 100%;
    max-width: 100%;
    margin-top: 24px;
}

.si-26-split-inspired .arcs-meta-t2 {
    margin-top: 24px;
}

.si-26-split-inspired .arcs-meta-t2-1 {
    word-break: break-word;
    word-wrap: break-word;
    line-height: 1.9;
}

.si-26-split-inspired .arcs-meta-t2-1 a {
    display: inline-block;
    margin: 0 8px 10px 0;
    line-height: 1.8;
    white-space: normal;
}

@media (max-width: 1200px) {

    .si-26-split-inspired>[id^="post-"],
    .si-26-top-hero__grid {
        column-gap: 20px;
    }

    .si-26-split-inspired>[id^="post-"]>#arcs-single-filter>figure,
    .si-26-split-inspired>[id^="post-"]>#arcs-single-filter .full-full,
    .si-26-top-hero__grid>#arcs-single-filter>figure,
    .si-26-top-hero__grid>#arcs-single-filter .full-full {
        min-height: 300px;
    }
}

@media (max-width: 992px) {

    .si-26-split-inspired>[id^="post-"],
    .si-26-top-hero__grid {
        grid-template-columns: minmax(0, 1fr);
        grid-template-areas:
            "media"
            "header"
            "meta"
            "content";
        row-gap: 12px;
    }

    .si-26-top-hero__grid {
        grid-template-areas:
            "media"
            "header"
            "meta";
    }
}



#arcs-single-filter.crop-16-9 {
    background: #fff0ee;
}

#arcs-single-filter>figure {
    background: #eee;
    min-height: 200px;
    /* 至少預留一點高度，避免完全塌陷 */
    margin: 0;
}

/* --- Ad Position Reservations to prevent CLS --- */
/* Only apply if not empty to prevent blank gaps when no ads are served */
.wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty),
.wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) {
    --wp-ad-top-970-reserved-height: clamp(90px, 18vw, 250px);
    box-sizing: border-box;
    width: 100%;
    max-width: min(100%, 970px);
    min-height: var(--wp-ad-top-970-reserved-height, clamp(90px, 18vw, 250px));
    margin: 10px auto;
    text-align: center;
    background-color: #f9f9f9;
}

body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) {
    margin-bottom: 0;
}

body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) {
    margin-bottom: 0;
}

body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) + .main-layout-wrapper,
body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) + .content > .main-layout-wrapper,
body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) + .main-layout-wrapper,
body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) + .content > .main-layout-wrapper {
    margin-top: var(--hd-top-ad-after-spacing, 10px);
}

body.single.hd-layout-customizable .ad-container-top:not(:empty) {
    margin-bottom: var(--hd-top-ad-after-spacing, 20px);
}

@media (min-width: 769px) and (max-width: 1180px) {

    body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) + .main-layout-wrapper,
    body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) + .content > .main-layout-wrapper,
    body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) + .main-layout-wrapper,
    body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) + .content > .main-layout-wrapper {
        margin-top: var(--hd-top-ad-after-spacing-tablet, var(--hd-top-ad-after-spacing, 10px));
    }

    body.single.hd-layout-customizable .ad-container-top:not(:empty) {
        margin-bottom: var(--hd-top-ad-after-spacing-tablet, var(--hd-top-ad-after-spacing, 20px));
    }
}

@media (max-width: 768px) {

    body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) + .main-layout-wrapper,
    body.single.hd-layout-customizable .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty) + .content > .main-layout-wrapper,
    body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) + .main-layout-wrapper,
    body.single.hd-layout-customizable .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) + .content > .main-layout-wrapper {
        margin-top: var(--hd-top-ad-after-spacing-mobile, var(--hd-top-ad-after-spacing-tablet, var(--hd-top-ad-after-spacing, 10px)));
    }

    body.single.hd-layout-customizable .ad-container-top:not(:empty) {
        margin-bottom: var(--hd-top-ad-after-spacing-mobile, var(--hd-top-ad-after-spacing-tablet, var(--hd-top-ad-after-spacing, 20px)));
    }
}

@media (min-width: 992px) {

    .wp-ad-position-container.ad-pos-content-top-ad-970:not(:empty),
    .wp-ad-position-fallback[data-position="content-top-ad-970"]:not(:empty) {
        min-height: var(--wp-ad-top-970-reserved-height, clamp(90px, 18vw, 250px));
    }
}

.ad-container-top:not(:empty) {
    min-height: 90px;
    margin-bottom: 20px;
    background-color: #f9f9f9;
}

/* --- Full Size Image Layout --- */
#postshow-a .full-full,
#arcs-single-filter .full-full {
    display: flex;
    justify-content: center;
    align-items: center;
    width: auto;
    max-width: 100%;
    margin: 0 auto 0px;
    background-color: #eee;
    aspect-ratio: var(--aspect-ratio);
    overflow: hidden;
    position: relative;
}

#postshow-a .full-full img,
#arcs-single-filter .full-full img {
    display: block;
    object-fit: contain;
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    position: static;
    transform: none;
}

/* --- Caption Styles --- */
.wp-caption {
    margin: 10px auto;
    text-align: center;
}

.wp-caption img {
    margin: 0;
    padding: 0;
    border: none;
}

.wp-caption p.wp-caption-text {
    margin: 0;
    padding-bottom: 5px;
    font-size: 11px;
    line-height: 17px;
}

.wp-caption.alignnone {
    display: block;
    height: auto;
    margin: 10px auto;
}

.wp-caption.alignright {
    float: right;
    width: 48%;
    max-width: 343px;
    margin: 10px 0 0;
}

.wp-caption.alignleft {
    float: left;
    width: 48%;
    max-width: 343px;
    margin: 10px 0 0;
}

#si-single-content .wp-caption {
    width: auto !important;
    margin: 10px auto;
    text-align: center;
}

#si-single-content .wp-caption img {
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
    border: none;
}

#si-single-content .wp-caption p.wp-caption-text {
    margin: 0;
    padding-bottom: 5px;
    font-size: 0.688rem;
    line-height: 17px;
}

#si-single-content .wp-caption.alignnone {
    display: block;
    height: auto;
    margin: 10px auto;
}

/* --- Meta Box Styles --- */
.si_meta-t1 {
    display: inline-block;
    width: 100%;
    margin: 15px auto;
    letter-spacing: 2px;
}

.si_meta-t1-1 {
    display: block;
    position: relative;
    margin: 25px auto;
    padding: 15px 20px;
    background-color: #e85a70;
    color: #ffff;
}

.si_meta-t1-1::before {
    position: absolute;
    top: 100%;
    left: 30px;
    width: 0;
    height: 0;
    border: 10px solid transparent;
    border-top: 15px solid #e85a70;
    content: "";
}

/* ==========================================================================
   AUTHOR BOX
   ========================================================================== */

/*.authors-page {
padding: 40px 0;
background-color: #f9f9f9;
}

.authors-container {
display: flex;
flex-wrap: wrap;
gap: 20px;
justify-content: center;
}

.author-card {
background: #fff;
border: 1px solid #ddd;
border-radius: 8px;
width: 300px;
text-align: center;
padding: 20px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
}

.author-card:hover {
transform: translateY(-5px);
box-shadow: 0 6px 10px rgba(0, 0, 0, 0.15);
}

#article-author {
display: grid;
border: 20px solid #f1f1f1;
margin: 20px auto;
grid-template-columns: 0.26fr 1fr;
grid-template-areas:
"author-avatar author-text"
"author-avatar author-social";
}

#article-author a {
text-decoration: none;
}

#article-author a:hover {
opacity: 1;
text-decoration: none;
}

#author-avatar {
padding: 15px;
grid-area: author-avatar;
}

#author-avatar img {
border: none;
vertical-align: middle;
border-radius: 50%;
}

.author-text {
background: #fff;
grid-area: author-text;
padding: 15px;
word-break: break-all;
word-wrap: break-word;
}

.author-social {
text-align: right;
grid-area: author-social;
padding: 10px 15px;
opacity: 0.8;
color: #333;
}

.author-name {
display: block;
padding: 0 0 7px;
overflow: hidden;
font-weight: 900;
font-size: 1.25rem;
line-height: 1.5;
letter-spacing: 2px;
text-decoration: none;
text-overflow: ellipsis;
line-clamp: 3;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}

.author-description {
overflow: hidden;
line-height: 1.6;
}*/

/* ==========================================================================
   POST NAVIGATION
   ========================================================================== */

/*.post-navigation {
display: flex;
justify-content: space-between;
margin: 20px 0;
font-size: 16px;
gap: 10px;
}

.nav-previous a,
.nav-next a {
padding: 10px 20px;
background: #f5f5f5;
border-radius: 5px;
text-decoration: none;
color: #333;
transition: all 0.3s ease;
}

.nav-previous a:hover,
.nav-next a:hover {
background: #0073aa;
color: #fff;
}*/

/* --- Pagination Navigation --- */
.link_pages {
    margin: 40px auto;
    clear: both;
    width: 100%;
}

.link_pages-al {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 10px;
    font-style: normal;
}

.link_pages .post-page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-style: normal;
}

.theme-page-link-item {
    display: inline-block;
    padding: 5px 15px;
    border: 1px solid #eee;
    background: #eee;
    font-style: normal;
}

.theme-page-link-next {
    padding-left: 10px;
}

.theme-page-link-prev {
    padding-right: 10px;
}

.theme-hidden-time {
    display: none !important;
}

/* ==========================================================================
   POST CATEGORY LABEL & TIME
   ========================================================================== */

.post-category-label {
    display: inline-block;
    padding: 0.25em 0.75em;
    font-size: 0.9rem;
    border-radius: 3px;
    margin: 0;
    color: #fff;
    background: #0073aa;
}

.post-category-label+.post-category-label {
    margin-left: 0.5em;
}

.post-category-label a {
    color: #fff;
    text-decoration: none;
}

.post-category-label--main-label,
.post-category-label--title-category {
    display: inline-flex;
    align-items: center;
    gap: 0.42em;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 760;
    letter-spacing: 0.045em;
    line-height: 1.15;
    min-height: 30px;
    padding: 0.48em 0.98em;
    text-transform: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.09);
}

.post-category-label--main-label {
    border: 1px solid rgba(255, 255, 255, 0.32);
}

.post-category-label--main-label::before {
    content: "";
    width: 0.46em;
    height: 0.46em;
    border-radius: 999px;
    background: currentColor;
    opacity: 0.72;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.18);
}

.post-category-label--title-category {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%);
    border: 1px solid #d1d5db;
    color: #374151;
    box-shadow: none;
}

.post-category-label--main-label a,
.post-category-label--title-category a {
    display: inline-flex;
    align-items: center;
    color: inherit;
    text-decoration: none;
}

.post-category-label--main-label a:hover,
.post-category-label--main-label a:focus-visible,
.post-category-label--title-category a:hover,
.post-category-label--title-category a:focus-visible {
    color: inherit;
    text-decoration: none;
}

.si-title-top .sl-category {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
}

.si-title-top .sl-category .post-category-label {
    margin: 0;
}

.si-title-top .sl-category .post-category-label+.post-category-label {
    margin-left: 0;
}

.pre_des_red>span {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 10px 10px 0 0;
    background: #4267b2;
    color: #fff;
}

.time-b,
.time-a {
    min-width: 1px;
    min-height: 1px;
}

.sl-category {
    /*margin: 0 0 20px 0;*/
    font-size: 1rem;
}

.contjpmempo {
    margin-bottom: 15px;
    min-height: 200px;
    margin-top: 20px;
}

/* ==========================================================================
   BLOCKQUOTES & CALLOUTS
   ========================================================================== */

#si-single-content blockquote {
    clear: both;
    margin: 15px auto;
    padding: 35px;
    border-radius: 3px;
    background: #f3f3f3;
    text-align: left;
    border-left: 4px solid #0073aa;
}

#si-single-content blockquote p {
    width: 100%;
    margin: 0;
    font-size: 1.1rem;
}

#si-single-content blockquote ol,
#si-single-content blockquote ul {
    padding: 0;
    word-break: break-all;
    word-wrap: break-word;
}

#si-single-content blockquote li {
    width: 100%;
    padding: 0;
}

#si-single-content blockquote .alt4 {
    display: inline-block;
    width: 100%;
    font-weight: 600;
    text-align: left;
}

#si-single-content blockquote .art4 {
    display: inline-block;
    width: 100%;
    font-weight: 600;
    text-align: right;
}

#si-single-content blockquote .al {
    display: inline-block;
    width: 100%;
    text-align: left;
}

#si-single-content blockquote .ar {
    display: inline-block;
    width: 100%;
    text-align: right;
}

#si-single-content blockquote h4 {
    list-style-type: square;
    width: 86%;
    background: #f3f3f3;
    font-weight: 600;
}

/* --- Special Quote Styles --- */
#sing-shi {
    clear: both;
    max-width: 865px;
    margin: 15px auto;
    padding: 43px;
    border: 5px solid red;
    border-radius: 3px;
    color: #777;
}

#sing-shi:before {
    display: block;
    color: #000;
    font-size: 25px;
    font-family: FontAwesome;
    content: "\f10d";
}

#sing-shi p {
    width: 95%;
    padding: 0 15px;
    font-size: 15px;
    text-align: center;
}

#sing-shi ol,
#sing-shi ul {
    width: 85%;
    padding: 0;
    font-size: 13px;
    word-break: break-all;
    word-wrap: break-word;
}

#sing-shi li {
    width: 100%;
    padding: 0;
    font-size: 13px;
}

#sing-shi h4 {
    list-style-type: square;
    width: 86%;
    background: #f3f3f3;
    font-weight: 600;
    font-size: 17px;
}

/* --- Block Quote Styles --- */
#blq {
    font-size: 1.15rem;
    clear: both;
    margin: 30px auto;
    padding: 30px 30px 30px 30px;
    border-radius: 10px 0 0 10px;
    text-align: left;
    border-left: 6px solid #565656;
    background: #f5f5f5;
}

#blq p {
    width: 100%;
    margin: 0;
    font-size: 1.1rem;
}

#blq ol,
#blq ul {
    padding: 0;
    word-break: break-all;
    word-wrap: break-word;
}

#blq li {
    width: 100%;
    padding: 0;
    font-size: 1.1rem;
}

#blq h4 {
    list-style-type: square;
    width: 86%;
    background: #f3f3f3;
    font-weight: 600;
}

/* --- Special Block Quote 1 --- */
#bq-sp-1 {
    clear: both;
    margin: 0 auto;
    padding: 15px;
    border-radius: 3px;
    background: #fff;
    text-align: left;
}

#bq-sp-1 p {
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 1.1rem;
}

#bq-sp-1 ol {
    width: 91%;
    padding: 0;
    font-size: 1.1rem;
    word-break: break-all;
    word-wrap: break-word;
}

#bq-sp-1 ul {
    margin: 25px 10px 25px 40px;
    padding: 0;
    font-size: 1.1rem;
    word-break: break-all;
    word-wrap: break-word;
}

#bq-sp-1 ul ul {
    margin: 0 0 25px;
}

#bq-sp-1 ul ul li {
    list-style: none;
}

#bq-sp-1 li {
    width: 100%;
    padding: 0;
}

#bq-sp-1 a {
    display: unset;
}

#bq-sp-1 h3 {
    font-size: 1.2rem;
    margin: 25px 0 15px;
    padding: 10px 10px 10px 15px;
    background: #f5f5f5;
}

#bq-sp-1 h4 {
    list-style-type: square;
    font-weight: 600;
    padding-left: 10px;
    margin: 35px 0 35px;
    font-size: 1.1rem;
    border-left: 6px solid #333;
}

#bq-sp-1 h5 {
    font-weight: 600;
    font-size: 1.1rem;
}

/* --- Special Block Quote 2 --- */
#blq-sp-2:before {
    padding-right: 10px;
    padding-left: 10px;
    font-family: FontAwesome;
    content: "\f10d";
}

#blq-sp-2 {
    margin: 20px auto;
    padding: 35px;
    border-radius: 3px;
    background: #fff;
    border: 1px solid #ddd;
}

#blq-sp-2 p {
    width: 92%;
    padding-left: 10px;
    color: #5a5454;
}

#blq-sp-2 ol {
    width: 91%;
    padding: 0;
    word-break: break-all;
    word-wrap: break-word;
}

#blq-sp-2 ul {
    width: 85%;
    padding: 0;
    word-break: break-all;
    word-wrap: break-word;
}

#blq-sp-2 li {
    width: 100%;
    padding: 0;
}

#blq-sp-2 a {
    display: inline-block;
}

#blq-sp-2 h4 {
    list-style-type: square;
    width: 86%;
    background: #f3f3f3;
    font-weight: 600;
}

/* --- Meta Box Styles --- */
#s_meta-t1_p {
    display: inline-block;
    width: 100%;
    margin: 40px auto;
    border-radius: 2px;
    background: #fff;
    letter-spacing: 2px;
}

#s_meta-t1_p ul {
    margin: 10px 10px 10px 15px;
    font-size: 1rem;
}

#s_meta-t1_p li {
    font-size: 1rem;
    margin: 0 auto;
}

.s_meta-t1-1_p {
    display: inline-block;
    margin: 0 auto;
    padding: 10px 12px 10px 24px;
    border-left: 5px solid #6b1b8c;
    border-radius: 3px;
    background: #f5f5f5;
    letter-spacing: 3px;
    word-break: break-all;
    word-wrap: break-word;
}

.s_meta-t1-1_p h2 {
    border: none;
    position: unset;
    background: unset;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    color: #000;
    font-weight: 700;
    line-height: 30px;
    text-decoration: none;
    text-align: justify;
}

.s_meta-t1-1_p h2::before {
    all: unset !important;
}

.s_meta-t1-1_p a {
    opacity: 0.8;
    margin: 5px auto;
    padding: 0;
    text-decoration: none;
    text-align: center;
    transition: all 0.5s ease;
}

.s_meta-t1-1_p a:hover {
    opacity: 1;
    padding: 0;
    text-decoration: underline;
}

.s_meta-t1-1_p p {
    font-size: 1rem;
    max-width: 800px;
    padding-top: 0;
    padding-bottom: 0;
}

.s_meta-t1-sp {
    display: inline-block;
    width: 100%;
    margin: 20px auto;
    border-radius: 2px;
    background: #f5f5f5;
    color: #565656;
    letter-spacing: 2px;
}

.s_meta-t1-1-sp {
    position: relative;
    margin: 0 auto;
    padding: 10px 12px 10px 24px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: 3px;
    text-decoration: none;
    text-align: justify;
    word-break: break-all;
    word-wrap: break-word;
}

.s_meta-t1-1-sp a {
    opacity: 0.8;
    margin: 5px auto;
    padding: 0;
    text-decoration: none;
    text-align: center;
    transition: all 0.5s ease;
}

.s_meta-t1-1-sp a:hover {
    opacity: 1;
    padding: 0;
    text-decoration: underline;
}

.fc-editorial-block--align-left .s_meta-t1-1_p,
.fc-editorial-block--align-left .s_meta-t1-1-sp {
    margin-left: 0 !important;
    margin-right: auto !important;
}

.fc-editorial-block--align-left .s_meta-t1-1_p p,
.fc-editorial-block--align-left .s_meta-t1-1-sp p {
    text-align: left !important;
}

.fc-editorial-block--align-center .s_meta-t1-1_p,
.fc-editorial-block--align-center .s_meta-t1-1-sp {
    margin-left: auto !important;
    margin-right: auto !important;
}

.fc-editorial-block--align-center .s_meta-t1-1_p p,
.fc-editorial-block--align-center .s_meta-t1-1-sp p {
    text-align: center !important;
}

.fc-editorial-block--align-right .s_meta-t1-1_p,
.fc-editorial-block--align-right .s_meta-t1-1-sp {
    margin-left: auto !important;
    margin-right: 0 !important;
}

.fc-editorial-block--align-right .s_meta-t1-1_p p,
.fc-editorial-block--align-right .s_meta-t1-1-sp p {
    text-align: right !important;
}

.s_meta-t1-sp h2 {
    display: inline-block;
    width: 100%;
    margin: 20px auto 0;
    border-radius: 2px;
    background: #f5f5f5;
    color: #565656;
    letter-spacing: 2px;
}

/* ==========================================================================
   VIDEO & YOUTUBE
   ========================================================================== */

.video-container {
    position: relative;
    height: 0;
    padding-top: 30px;
    padding-bottom: 56.25%;
    overflow: hidden;
    margin: 20px auto;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ==========================================================================
   POST FOOTER
   ========================================================================== */

#at-rp-title {
    border-bottom: 2px solid #e1e1e1;
    clear: both;
    margin: 20px 0 0;
    padding: 10px 9px 10px 0;
    font-size: 1.4rem;
    font-weight: 900;
}

#at-rp-title a {
    color: #000;
}

/* ==========================================================================
   CODE BLOCKS
   ========================================================================== */

.wp-block-code code {
    margin-top: 0 !important;
    margin-bottom: 1.6rem;
    padding: 1.5rem 1rem 1rem !important;
    border: solid 1px #dadada;
    background: #f5f6f7 !important;
    line-height: 1.3;
    font-family: Inconsolata, Monaco, "Andale Mono", "Lucida Console",
        "Bitstream Vera Sans Mono", "Courier New", Courier, "Hiragino Sans",
        "Yu Gothic UI", monospace;
    -webkit-font-smoothing: subpixel-antialiased;
}

td.hljs-ln-code {
    padding-left: 15px !important;
}

td.hljs-ln-numbers {
    padding-right: 15px !important;
    border-right: 1px solid #ccc;
    color: #ccc;
    text-align: center;
    vertical-align: top;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.hljs-keyword,
.hljs-attribute,
.hljs-selector-tag,
.hljs-meta-keyword,
.hljs-doctag,
.hljs-name {
    font-weight: 400 !important;
}

.hljs-title,
.hljs-section {
    font-weight: 700;
}

/* ==========================================================================
   SPECIAL LAYOUTS
   ========================================================================== */

/* --- Landscape Side by Side --- */
.modern-landscape-side-by-side {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    justify-content: center;
    align-items: flex-start;
    margin: 0;
}

.modern-landscape-side-by-side figure {
    flex: 1 1 calc(50% - 3px);
    max-width: calc(50% - 3px);
    margin: 0;
    padding: 0;
    text-align: center;
    overflow: hidden;
}

.modern-landscape-side-by-side figure picture {
    display: block;
    width: 100%;
    height: auto;
}

.modern-landscape-side-by-side figure img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.landscape-side-by-side__captions {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e0e0e0;
    width: 100%;
}

.landscape-side-by-side__caption-unified-source {
    font-size: 12px;
    color: #999;
    font-style: italic;
    line-height: 1.6;
    text-decoration: underline;
}

.landscape-side-by-side__captions.align-left {
    text-align: left;
}

.landscape-side-by-side__captions.align-center {
    text-align: center;
}

.landscape-side-by-side__captions.align-right {
    text-align: right;
}

/* ==========================================================================
   Page ARCHIVE HEADERS
   ========================================================================== */

.arci-content {
    height: auto;
    margin: 20px auto;
    /*padding: 20px 40px;*/
    border: none;
    background: #f5f5f5;
    text-align: left;
    word-break: break-all;
    word-wrap: break-word;
}

.arci-content h1 {
    font-size: 1.5rem;
    margin-bottom: 10px;
}

.arci-content p {
    font-size: 1rem;
    margin: 10px auto;
}

/* ==========================================================================
   RESPONSIVE DESIGN - SINGLE POST
   ========================================================================== */

/* --- Desktop Large (1200px and above) --- */
@media (min-width: 1200px) {

    #postshow-a .full-full,
    #arcs-single-filter .full-full {
        max-height: 60vh;
    }
}

/* --- Tablet & Below (1199px and below) --- */
@media (max-width: 1199px) {

    #postshow-a .full-full,
    #arcs-single-filter .full-full {
        aspect-ratio: auto;
        max-height: 75vh;
        width: 100%;
    }

    #postshow-a .full-full img,
    #arcs-single-filter .full-full img {
        max-height: 75vh;
    }
}

/* --- Mobile (479px and below) --- */
@media (max-width: 479px) {

    /* Typography */
    .si-title-top,
    .si-title-top h1,
    .arci-content h1 {
        font-size: 1.4rem;
    }

    #si-single-content h2 {
        font-size: 1.2rem;
        padding: 8px 8px 8px 12px;
    }

    #si-single-content h3 {
        margin: 0 0 20px;
        font-size: 1.1rem;
    }

    /* Author Box */
    #article-author {
        grid-template-columns: 1fr 1fr;
        grid-template-areas:
            "author-avatar author-text"
            "author-social author-social";
        border: 1px solid #f1f1f1;
    }

    /* Featured Image */
    #arcs-single-filter {
        width: auto !important;
        margin: 0 -15px;
    }

    /* Content Adjustments */
    #si-single-content p>img {
        margin-right: 0;
        margin-left: 0;
    }

    /* Blockquotes */
    #si-single-content blockquote,
    #blq,
    #bq-sp-1,
    #blq-sp-2 {
        padding: 20px;
        margin: 15px 0;
    }

    /* Post Navigation */
    .post-navigation {
        flex-direction: column;
    }

    .nav-previous,
    .nav-next {
        width: 100%;
    }

    .nav-previous a,
    .nav-next a {
        width: 100%;
        display: block;
        text-align: center;
    }
}

/* ==========================================================================
   RESPONSIVE DESIGN - SINGLE POST
   ========================================================================== */

/* --- Desktop Large (1200px and above) --- */
@media (min-width: 1200px) {

    #postshow-a .full-full,
    #arcs-single-filter .full-full {
        max-height: 60vh;
    }
}

/* --- Tablet & Below (1199px and below) --- */
@media (max-width: 1199px) {

    #postshow-a .full-full,
    #arcs-single-filter .full-full {
        aspect-ratio: auto;
        max-height: 75vh;
        width: 100%;
    }

    #postshow-a .full-full img,
    #arcs-single-filter .full-full img {
        max-height: 75vh;
    }
}

@media (max-width: 1199px) {

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full {
        width: min(100%, calc(var(--aspect-ratio, 1) * 75vh)) !important;
        max-width: 100% !important;
        aspect-ratio: var(--aspect-ratio) !important;
        max-height: 75vh !important;
        margin-left: auto;
        margin-right: auto;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full>picture,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full>a,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>picture,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>a {
        display: block;
        width: 100%;
        height: 100%;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full>picture>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full>a>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>picture>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>a>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full>img {
        width: 100% !important;
        height: 100% !important;
        max-height: none !important;
        object-fit: contain;
    }
}

@supports (-webkit-touch-callout: none) {

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media {
        width: fit-content !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: min(82vh, 1200px) !important;
        aspect-ratio: auto !important;
        margin-left: auto;
        margin-right: auto;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a {
        display: block;
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: inherit;
        line-height: 0;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>img {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: min(82vh, 1200px) !important;
        object-fit: contain;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."],
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."] {
        width: fit-content !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: min(82vh, 1200px) !important;
        aspect-ratio: auto !important;
        margin-left: auto;
        margin-right: auto;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a {
        display: block;
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: inherit;
        line-height: 0;
    }

    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>img,
    .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>img,
    .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>img {
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: min(82vh, 1200px) !important;
        object-fit: contain;
    }

    @media (max-width: 1199px) {

        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."],
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."],
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>img {
            max-height: 75vh !important;
        }
    }

    @media (max-width: 768px) {

        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."],
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."],
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>img,
        .si-hero-media-container #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>picture>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>picture>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>picture>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>a>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>a>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>a>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full.is-portrait-media>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio: 0."]>img,
        .si-23-visual-inspired #arcs-single-filter.si-23-visual-media .full-full[style*="--aspect-ratio:0."]>img {
            max-height: 72vh !important;
        }
    }
}

/* --- [新增] Medium Devices (e.g., Landscape Tablets) --- */
@media (max-width: 1119px) and (min-width: 769px) {

    /* --- Typography --- */
    /* 適度縮小標題，避免在中型螢幕上過於巨大 */
    .si-title-top h1 {
        font-size: 1.6rem;
        line-height: 1.7;
    }

    /* 適度縮小內文字體 */
    #si-single-content {
        font-size: 1.05rem;
    }

    /* --- Layout --- */
    /* 作者介紹區塊，增加頭像欄的最小寬度，並讓文字欄佔據剩餘空間 */
    #article-author {
        grid-template-columns: 120px 1fr;
        /* 將左側固定為 120px，右側自動填滿 */
        border-width: 15px;
        /* 稍微減少邊框寬度 */
    }

    /* --- Content Adjustments --- */
    /* 假設外層容器的 padding 在此尺寸下縮減為 20px，同步調整圖片的負邊距 */
    /* 注意：這個值需要根據您的整體佈局來決定 */
    #si-single-content p>img {
        margin-right: -20px;
        margin-left: -20px;
    }
}


/* --- Tablet Portrait & Mobile Landscape (768px and below) --- */
/* 為了更精確的控制，可以將原有的479px斷點擴展到768px */
@media (max-width: 768px) {

    /* 作者介紹區塊改為垂直堆疊，更適合窄螢幕 */
    #article-author {
        grid-template-columns: 1fr;
        /* 改為單欄 */
        grid-template-areas:
            "author-avatar"
            "author-text"
            "author-social";
        border: 10px solid #f1f1f1;
        text-align: center;
        /* 頭像和文字置中 */
    }

    .author-social {
        text-align: center;
    }
}

/* --- Mobile (479px and below) --- */
@media (max-width: 479px) {

    /* Typography */
    .si-title-top,
    .si-title-top h1,
    .arci-content h1 {
        font-size: 1.4rem;
    }

    #si-single-content h2 {
        font-size: 1.2rem;
        padding: 8px 8px 8px 12px;
    }

    #si-single-content h3 {
        margin: 0 0 20px;
        font-size: 1.1rem;
    }

    /* Author Box (在手機上調整 grid gap) */
    #article-author {
        grid-template-columns: 1fr;
        /* 確保在手機上也是單欄 */
        grid-template-areas:
            "author-avatar"
            "author-text"
            "author-social";
        border: 1px solid #f1f1f1;
        gap: 0;
        /* 移除網格間距 */
    }

    /* Featured Image */
    #arcs-single-filter {
        width: auto !important;
        margin: 0 -15px;
        /* 這個值通常對應容器的 padding */
    }

    /* Content Adjustments */
    #si-single-content p>img {
        margin-right: 0;
        margin-left: 0;
    }

    /* Blockquotes */
    #si-single-content blockquote,
    #blq,
    #bq-sp-1,
    #blq-sp-2 {
        padding: 20px;
        margin: 15px 0;
    }

    /* Post Navigation */
    .post-navigation {
        flex-direction: column;
    }

    .nav-previous,
    .nav-next {
        width: 100%;
    }

    .nav-previous a,
    .nav-next a {
        width: 100%;
        display: block;
        text-align: center;
    }
}


/* 只修改中尺寸圖片 */
img.size-medium {
    max-width: 390px !important;
    /* 你希望的中尺寸寬度 */
    width: 100%;
    /* 響應式自動縮放 */
    height: auto;
    /* 保持比例 */
}

/* =========================================================================
   CLS 優化: 圖片對齊樣式 (防止版面位移)
   使用 aspect-ratio: auto 讓瀏覽器從 HTML width/height 屬性自動計算比例
   注意：Chrome 88+, Firefox 89+, Safari 15+ 支援此功能
   ========================================================================= */

/* 確保所有內容圖片保持寬高比例以防止 CLS */
#si-single-content img[width][height] {
    /* aspect-ratio: auto 會讓瀏覽器從 HTML 屬性計算比例 */
    aspect-ratio: auto;
    /* 確保設置 height: auto 時仍保持比例 */
    height: auto;
}

#si-single-content img.alignright,
#si-single-content a img.alignright {
    float: right;
    width: 49%;
    max-width: 100%;
    height: auto;
    margin: 5px 0 35px 1%;
    /* 讓瀏覽器從 width/height 屬性自動計算寬高比 */
    aspect-ratio: auto;
}

#si-single-content img.alignleft,
#si-single-content a img.alignleft {
    float: left;
    width: 49%;
    max-width: 100%;
    height: auto;
    margin: 5px 1% 35px 0;
    /* 讓瀏覽器從 width/height 屬性自動計算寬高比 */
    aspect-ratio: auto;
}

#si-single-content img.aligncenter,
#si-single-content a img.aligncenter {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 10px auto;
    /* 讓瀏覽器從 width/height 屬性自動計算寬高比 */
    aspect-ratio: auto;
}

/* =========================================================================
   CLS 優化: 為所有懶載入圖片預留空間
   ========================================================================= */

/* 具有 width 和 height 屬性的圖片，瀏覽器會自動計算寬高比 */
#si-single-content img[width][height],
.entry-content img[width][height] {
    /* 現代瀏覽器在設置 width/height HTML 屬性時會自動處理 */
    height: auto;
}

/* 懶載入圖片需要確保有合適的寬高比 */
#si-single-content img[loading="lazy"][width][height],
.entry-content img[loading="lazy"][width][height] {
    /* 確保懶載入期間保持空間 */
    aspect-ratio: auto;
    height: auto;
}

/* 針對特定尺寸的圖片 (425x756)，手動設定比例作為備用方案 */
img.size-medium.alignleft[width="425"][height="756"],
img.size-medium.alignright[width="425"][height="756"] {
    /* 425:756 ≈ 1:1.78 (接近 9:16) */
    aspect-ratio: 425 / 756;
}

/* ==========================================================================
   Single 2-6 Style Polish
   ========================================================================== */

.si-26-top-hero {
    margin-bottom: clamp(18px, 2.5vw, 30px);
}

.si-26-top-hero__grid {
    align-items: stretch;
    padding: clamp(16px, 2vw, 26px);
    border: 1px solid #e6ebf2;
    border-radius: 18px;
    background: linear-gradient(160deg, #ffffff 0%, #f7f9fc 100%);
    box-shadow: 0 24px 50px -42px rgba(15, 23, 42, 0.38);
}

.si-26-top-hero__grid>#arcs-single-filter {
    border: 1px solid #dbe3ee;
    border-radius: 14px;
    overflow: hidden;
    background: #e8edf4;
}

.si-26-top-hero__grid>#arcs-single-filter>figure,
.si-26-top-hero__grid>#arcs-single-filter .full-full {
    min-height: clamp(260px, 34vw, 460px);
}

.si-26-top-hero #arcs-single-filter figure figcaption {
    padding: 10px 12px;
    background: linear-gradient(to top, rgba(13, 20, 30, 0.72), rgba(13, 20, 30, 0.18));
}

.si-26-top-hero .entry-header {
    align-self: end;
}

.si-26-top-hero .entry-title {
    line-height: 1.16;
    letter-spacing: 0.01em;
    text-wrap: balance;
}

.si-26-top-hero .si-single-top {
    min-width: 0;
    max-height: none;
    padding: 12px 14px;
    border: 1px solid #e3e8f0;
    border-left: 0;
    border-radius: 12px;
    background: #fff;
}

.si-26-top-hero .si-single-top .byline {
    align-items: flex-start;
    padding: 6px 0;
    margin-bottom: 0;
    border-bottom: 1px dashed #e6ebf2;
}

.si-26-top-hero .si-single-top .si-single-top-a>.byline:last-child {
    border-bottom: 0;
}

.si-26-top-hero .si-single-top .byline>i {
    margin-top: 2px;
    color: #3f5877;
}

.si-26-top-hero .si-single-top .meta-content {
    line-height: 1.6;
}

.si-26-top-hero .si-single-top .meta-content>span:first-child {
    color: #607086;
    font-weight: 600;
}

.si-26-top-hero .no-image-title {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(240px, 30vw, 380px);
    padding: 24px;
    background: #e6ebf2;
    color: #3b4655;
    font-size: clamp(1.2rem, 2.8vw, 1.7rem);
    font-weight: 700;
    text-align: center;
}

@media (max-width: 992px) {
    .si-26-top-hero__grid {
        padding: 14px;
        border-radius: 14px;
        row-gap: 14px;
    }

    .si-26-top-hero__grid>#arcs-single-filter,
    .si-26-top-hero__grid>#arcs-single-filter>figure {
        border-radius: 12px;
    }

    .si-26-top-hero__grid>#arcs-single-filter>figure,
    .si-26-top-hero__grid>#arcs-single-filter .full-full {
        min-height: clamp(220px, 54vw, 340px);
    }

    .si-26-top-hero .si-single-top {
        padding: 10px 12px;
    }
}

@media (max-width: 640px) {
    .si-26-top-hero {
        margin-bottom: 16px;
    }

    .si-26-top-hero__grid {
        padding: 12px;
        border-radius: 12px;
    }

    .si-26-top-hero .entry-title {
        font-size: clamp(1.55rem, 7.8vw, 2rem);
    }

}

/* Canonical desktop centering for customizable layouts.
   Legacy rules above still include left/translate centering and can conflict by order. */
@media (min-width: 769px) {

    body.single.hd-layout-customizable #breadcrumb,
    body.single.hd-layout-customizable .main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb {
        width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
        max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
        position: static;
        left: auto;
        transform: none;
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-title-top,
    body.single.hd-layout-customizable .si-26-top-hero__grid>.entry-header {
        width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
        max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
        position: static;
        left: auto;
        transform: none;
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-single-top,
    body.single.hd-layout-customizable .si-26-top-hero__grid>.si-single-top {
        width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
        max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
        position: static;
        left: auto;
        transform: none;
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.post-thumbnail,
    body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.landscape-side-by-side__captions {
        width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
        max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
        position: relative;
        left: auto;
        transform: none;
        margin: 0 auto var(--hd-section-gap, 16px);
    }

    /* AB mode: clamp all major blocks to A column width to avoid drift/overflow. */
    body.single.hd-layout-customizable.hd-lm-ab #breadcrumb,
    body.single.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb {
        width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.si-title-top {
        width: min(var(--hd-title-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.si-single-top {
        width: min(var(--hd-meta-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
    }

    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-lm-ab #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-lm-ab main#postshow-a>article[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a>.post-thumbnail {
        width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
        max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
    }
}

/* Final safeguard: AB mode must render two columns below hero unless explicitly hidden. */
@media (min-width: 1200px) {
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-show .main-layout-wrapper {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-show .main-layout-wrapper>#content-main {
        flex: 1 1 0%;
        min-width: 0;
        max-width: none;
        width: 100%;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-show:not(.hd-aw-auto):not(.hd-cw-fullwidth) .main-layout-wrapper>#content-main {
        flex: 0 1 var(--hd-main-column-width, 1000px);
        width: var(--hd-main-column-width, 1000px);
        max-width: var(--hd-main-column-width, 1000px);
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvd-show .main-layout-wrapper>#postshow-b {
        display: block !important;
        flex: 0 0 var(--hd-sidebar-width, 280px);
        width: var(--hd-sidebar-width, 280px);
        margin-left: var(--hd-sidebar-gap, 0px);
    }
}

@media (min-width: 769px) and (max-width: 1199px) {
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#content-main {
        flex: 1 1 0%;
        min-width: 0;
        max-width: none;
        width: 100%;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show:not(.hd-aw-auto):not(.hd-cw-fullwidth) .main-layout-wrapper>#content-main {
        flex: 0 1 var(--hd-main-column-width, 1000px);
        width: var(--hd-main-column-width, 1000px);
        max-width: var(--hd-main-column-width, 1000px);
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#postshow-b {
        display: block !important;
        flex: 0 0 var(--hd-sidebar-width, 280px);
        width: var(--hd-sidebar-width, 280px);
        margin-left: var(--hd-sidebar-gap, 0px);
    }
}

@media (min-width: 769px) and (max-width: 1180px) {

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--hd-section-gap, 16px);
        max-width: min(var(--hd-content-max-width-active, 1000px), var(--hd-inline-safe-width, 100%));
        margin-left: auto;
        margin-right: auto;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#content-main,
    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout>#content-main,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show>article.container>#postshow-a,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show #container-all>article.container>#postshow-a {
        flex: none;
        width: 100%;
        max-width: none;
        min-width: 0;
    }

    body.single.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-3.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show>article.container>#postshow-b,
    body.single.hd-layout-customizable.hd-layout-key-4.hd-lm-ab.hd-bvt-show #container-all>article.container>#postshow-b {
        display: block !important;
        flex: none;
        width: 100%;
        max-width: min(var(--hd-sidebar-width, 280px), 100%);
        margin: 0 auto;
    }
}

/* Single Display Visibility Classes (global/template/category/post resolved) */
body.single.hd-layout-customizable.hd-display-show-breadcrumb-off #breadcrumb {
    display: none !important;
}

body.single.hd-layout-customizable.hd-display-show-meta-info-off .si-single-top {
    display: none !important;
}

body.single.hd-layout-customizable #breadcrumb.theme-breadcrumb-visible,
#breadcrumb.theme-breadcrumb-visible {
    display: block !important;
}

.single-template-slot--centered {
    margin: 10px auto;
}

body.single.hd-layout-customizable.hd-display-show-date-off .si-single-top .si-time {
    display: none !important;
}

body.single.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-author,
body.single.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-editors,
body.single.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-photographer,
body.single.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-source {
    display: none !important;
}

body.single.hd-layout-customizable.hd-display-show-category-off .si-single-top .si-category {
    display: none !important;
}

body.single.hd-layout-customizable.hd-display-show-reading-time-off .si-single-top .si-read-time {
    display: none !important;
}

body.single.hd-layout-customizable.hd-display-show-views-off .si-single-top .si-views {
    display: none !important;
}

/* Meta styles baseline quality: keep content aligned and prevent overflow. */
body.single.hd-layout-customizable .si-single-top .byline {
    max-width: 100%;
    min-width: 0;
}

body.single.hd-layout-customizable .si-single-top .meta-content {
    max-width: 100%;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-card .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-divider .si-single-top .meta-content {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
}

body.single.hd-layout-customizable.hd-meta-style-card .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-minimal .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-divider .si-single-top .si-category .meta-content>span:last-child {
    max-width: 100%;
    overflow-wrap: anywhere;
}

/* Horizontal meta styles: keep one row whenever possible, wrap only when insufficient space. */
body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 6px;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-single-top-a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-single-top-a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-single-top-a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-single-top-a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-single-top-a,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .byline {
    display: inline-flex;
    align-items: center;
    flex: 0 1 auto;
    max-width: 100%;
    margin: 0;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .meta-content,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .meta-content {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    max-width: 100%;
    min-width: 0;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .meta-content>span,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .meta-content>span,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .meta-content>span,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .meta-content>span,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .meta-content>span,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .meta-content>span,
body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .meta-content>a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .meta-content>a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .meta-content>a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .meta-content>a,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .meta-content>a,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .meta-content>a,
body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top time,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top time,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top time,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top time,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top time,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top time {
    white-space: nowrap;
}

body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-author .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-author .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-author .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-author .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-author .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-category .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-author .meta-content>span:last-child,
body.single.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-category .meta-content>span:last-child {
    display: inline-block;
    max-width: 28ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ==========================================================================
   CUSTOM LAYOUT ORDER SUPPORT
   ========================================================================== */

/* Enable flexbox on post container when using custom order */
article.hd-layout-order-custom>[id^="post-"] {
    display: flex !important;
    flex-direction: column !important;
}

/* Set order based on position (1-4) for breadcrumb */
article.hd-layout-order-custom.hd-lo-1-breadcrumb>[id^="post-"]>#breadcrumb {
    order: 10 !important;
}

article.hd-layout-order-custom.hd-lo-2-breadcrumb>[id^="post-"]>#breadcrumb {
    order: 20 !important;
}

article.hd-layout-order-custom.hd-lo-3-breadcrumb>[id^="post-"]>#breadcrumb {
    order: 30 !important;
}

article.hd-layout-order-custom.hd-lo-4-breadcrumb>[id^="post-"]>#breadcrumb {
    order: 40 !important;
}

/* Set order based on position (1-4) for title */
article.hd-layout-order-custom.hd-lo-1-title>[id^="post-"]>.entry-header {
    order: 10 !important;
}

article.hd-layout-order-custom.hd-lo-2-title>[id^="post-"]>.entry-header {
    order: 20 !important;
}

article.hd-layout-order-custom.hd-lo-3-title>[id^="post-"]>.entry-header {
    order: 30 !important;
}

article.hd-layout-order-custom.hd-lo-4-title>[id^="post-"]>.entry-header {
    order: 40 !important;
}

/* Set order based on position (1-4) for image */
article.hd-layout-order-custom.hd-lo-1-image>[id^="post-"]>.si-hero-media-container,
article.hd-layout-order-custom.hd-lo-1-image>[id^="post-"]>#arcs-single-filter {
    order: 10 !important;
}

article.hd-layout-order-custom.hd-lo-2-image>[id^="post-"]>.si-hero-media-container,
article.hd-layout-order-custom.hd-lo-2-image>[id^="post-"]>#arcs-single-filter {
    order: 20 !important;
}

article.hd-layout-order-custom.hd-lo-3-image>[id^="post-"]>.si-hero-media-container,
article.hd-layout-order-custom.hd-lo-3-image>[id^="post-"]>#arcs-single-filter {
    order: 30 !important;
}

article.hd-layout-order-custom.hd-lo-4-image>[id^="post-"]>.si-hero-media-container,
article.hd-layout-order-custom.hd-lo-4-image>[id^="post-"]>#arcs-single-filter {
    order: 40 !important;
}

/* Set order based on position (1-4) for meta */
article.hd-layout-order-custom.hd-lo-1-meta>[id^="post-"]>.si-single-top {
    order: 10 !important;
}

article.hd-layout-order-custom.hd-lo-2-meta>[id^="post-"]>.si-single-top {
    order: 20 !important;
}

article.hd-layout-order-custom.hd-lo-3-meta>[id^="post-"]>.si-single-top {
    order: 30 !important;
}

article.hd-layout-order-custom.hd-lo-4-meta>[id^="post-"]>.si-single-top {
    order: 40 !important;
}

/* Content always comes after header elements */
article.hd-layout-order-custom>[id^="post-"]>#si-single-content {
    order: 50 !important;
}

/* Other elements get default order 100 */
article.hd-layout-order-custom>[id^="post-"]>* {
    order: 100;
}

/* ==========================================================================
   SINGLE RESPONSIVE REFINEMENTS
   ========================================================================== */

body.single .si-title-top,
body.single .si-single-top,
body.single #si-single-content {
    min-width: 0;
    max-width: 100%;
}

body.single .si-title-top h1,
body.single .entry-header .entry-title {
    max-width: 100%;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: anywhere;
    word-break: normal;
}

body.single .si-single-top {
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

body.single .si-single-top .byline {
    gap: 10px;
}

body.single .si-single-top .meta-content {
    min-width: 0;
    overflow-wrap: anywhere;
}

body.single #si-single-content {
    word-break: normal;
    overflow-wrap: anywhere;
}

body.single #si-single-content p,
body.single #si-single-content li,
body.single #si-single-content blockquote p {
    word-break: normal;
    overflow-wrap: anywhere;
}

body.single #si-single-content ul,
body.single #si-single-content ol {
    padding-left: 1.25em;
}

body.single #si-single-content li {
    letter-spacing: 0.02em;
}

body.single #si-single-content .wp-block-table,
body.single .entry-content .wp-block-table {
    display: block;
    max-width: 100%;
    margin: 1.75rem 0;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    white-space: normal;
}

body.single #si-single-content .wp-block-table table,
body.single #si-single-content .wp-block-table .has-fixed-layout,
body.single .entry-content .wp-block-table table,
body.single .entry-content .wp-block-table .has-fixed-layout {
    width: max-content;
    min-width: 100%;
    margin: 0;
    table-layout: auto;
    white-space: normal;
    border-collapse: collapse;
}

body.single #si-single-content .wp-block-table th,
body.single #si-single-content .wp-block-table td,
body.single .entry-content .wp-block-table th,
body.single .entry-content .wp-block-table td {
    min-width: 0;
    padding: 0.82rem 0.95rem;
    vertical-align: top;
    font-size: 0.98em;
    line-height: 1.72;
    white-space: normal;
    word-break: normal;
    overflow-wrap: anywhere;
}

body.single #si-single-content .wp-block-table figcaption,
body.single .entry-content .wp-block-table figcaption {
    margin-top: 0.7rem;
    font-size: 0.9rem;
    line-height: 1.65;
    color: #666;
    white-space: normal;
    overflow-wrap: anywhere;
}

@media (max-width: 1180px) {
    body.single .si-title-top h1 {
        font-size: clamp(1.65rem, 2vw + 1rem, 2.2rem);
        line-height: 1.55;
    }

    body.single .si-single-top {
        padding-left: 16px;
        margin-bottom: 20px;
    }

    body.single #si-single-content {
        font-size: 1.05rem;
        line-height: 1.88;
    }

    body.single #si-single-content .wp-block-table,
    body.single .entry-content .wp-block-table {
        margin: 1.5rem 0;
    }

    body.single #si-single-content .wp-block-table table,
    body.single #si-single-content .wp-block-table .has-fixed-layout,
    body.single .entry-content .wp-block-table table,
    body.single .entry-content .wp-block-table .has-fixed-layout {
        min-width: max(100%, 42rem);
    }

    body.single #si-single-content .wp-block-table th,
    body.single #si-single-content .wp-block-table td,
    body.single .entry-content .wp-block-table th,
    body.single .entry-content .wp-block-table td {
        padding: 0.74rem 0.86rem;
        font-size: 0.95em;
        line-height: 1.68;
    }

    body.single #si-single-content p>img {
        margin-right: -12px;
        margin-left: -12px;
        border-radius: 14px;
    }
}

@media (max-width: 768px) {
    body.single .si-title-top {
        gap: 10px;
    }

    body.single .si-title-top h1 {
        font-size: clamp(1.45rem, 5vw, 1.9rem);
        line-height: 1.45;
        margin-bottom: 10px;
    }

    body.single .si-single-top {
        margin: 12px 0 18px;
        padding: 14px 0 0 14px;
        border-left-width: 4px;
    }

    body.single .si-single-top.si-article-action-bar {
        padding: var(--si-article-action-bar-padding-y, 14px) var(--si-article-action-bar-padding-x, 16px);
        border-left-width: 0;
    }

    body.single .si-single-top .byline {
        align-items: flex-start;
    }

    body.single .si-single-top .byline>i {
        width: 18px;
        margin-top: 0.18em;
    }

    body.single .si-single-top .si-single-top-a {
        display: grid;
        gap: 8px;
    }

    body.single.hd-layout-customizable:not(.hd-meta-style-horizontal):not(.hd-meta-style-horizontal-compact):not(.hd-meta-style-horizontal-soft):not(.hd-meta-style-horizontal-segmented):not(.hd-meta-style-horizontal-segmented-borders):not(.hd-meta-style-chips):not(.hd-meta-style-inline) .si-single-top .si-single-top-a {
        width: 100%;
        max-width: 100%;
        padding-left: 0;
        margin-left: 0;
        justify-items: start;
    }

    body.single.hd-layout-customizable:not(.hd-meta-style-horizontal):not(.hd-meta-style-horizontal-compact):not(.hd-meta-style-horizontal-soft):not(.hd-meta-style-horizontal-segmented):not(.hd-meta-style-horizontal-segmented-borders):not(.hd-meta-style-chips):not(.hd-meta-style-inline) .si-single-top .si-single-top-a>.byline,
    body.single.hd-layout-customizable:not(.hd-meta-style-horizontal):not(.hd-meta-style-horizontal-compact):not(.hd-meta-style-horizontal-soft):not(.hd-meta-style-horizontal-segmented):not(.hd-meta-style-horizontal-segmented-borders):not(.hd-meta-style-chips):not(.hd-meta-style-inline) .si-single-top .si-category,
    body.single.hd-layout-customizable:not(.hd-meta-style-horizontal):not(.hd-meta-style-horizontal-compact):not(.hd-meta-style-horizontal-soft):not(.hd-meta-style-horizontal-segmented):not(.hd-meta-style-horizontal-segmented-borders):not(.hd-meta-style-chips):not(.hd-meta-style-inline) .si-single-top .si-category .meta-content {
        padding-left: 0 !important;
        margin-left: 0 !important;
    }

    body.single .si-single-top .meta-content {
        display: inline-flex;
        flex-wrap: wrap;
        gap: 4px 6px;
    }

    body.single .si-single-top .meta-content>span,
    body.single .si-single-top .meta-content>a,
    body.single .si-single-top time {
        white-space: normal !important;
    }

    body.single #si-single-content {
        font-size: 1rem;
        line-height: 1.92;
        text-align: left;
        padding-right: 12px;
        padding-left: 12px;
        box-sizing: border-box;
    }

    body.single #si-single-content p>img {
        margin-right: 0;
        margin-left: 0;
        border-radius: 12px;
    }

    body.single #si-single-content .wp-block-table,
    body.single .entry-content .wp-block-table {
        margin: 1.3rem 0;
        padding-bottom: 0.1rem;
        white-space: normal;
    }

    body.single #si-single-content .wp-block-table table,
    body.single #si-single-content .wp-block-table .has-fixed-layout,
    body.single .entry-content .wp-block-table table,
    body.single .entry-content .wp-block-table .has-fixed-layout {
        min-width: max(100%, 34rem);
    }

    body.single #si-single-content .wp-block-table th,
    body.single #si-single-content .wp-block-table td,
    body.single .entry-content .wp-block-table th,
    body.single .entry-content .wp-block-table td {
        padding: 0.66rem 0.78rem;
        font-size: 0.93em;
        line-height: 1.62;
    }

    body.single #si-single-content ul,
    body.single #si-single-content ol {
        margin: 20px 0 24px;
        padding-left: 1.15em;
    }

    body.single #si-single-content li {
        margin: 8px 0;
        font-size: 1rem;
        letter-spacing: 0.01em;
    }

    body.single #si-single-content h2 {
        margin: 26px 0 16px;
        padding: 10px 12px;
        font-size: 1.3rem;
        line-height: 1.45;
    }

    body.single #si-single-content h3 {
        margin: 26px 0 14px;
        padding: 10px;
        font-size: 1.15rem;
        line-height: 1.55;
    }
}

@media (max-width: 479px) {
    body.single .si-title-top h1 {
        font-size: 1.32rem;
    }

    body.single .si-single-top {
        padding-left: 12px;
    }

    body.single #si-single-content {
        font-size: 0.97rem;
        padding-right: 10px;
        padding-left: 10px;
    }

    body.single #si-single-content .wp-block-table table,
    body.single #si-single-content .wp-block-table .has-fixed-layout,
    body.single .entry-content .wp-block-table table,
    body.single .entry-content .wp-block-table .has-fixed-layout {
        min-width: max(100%, 30rem);
    }
}

/* ==========================================================================
   SINGLE SHRINK SAFEGUARDS
   Scoped to smaller viewports so desktop layout tokens stay untouched.
   ========================================================================== */

@media (max-width: 1180px) {

    body.single .main-layout-wrapper,
    body.single #postshow-a,
    body.single #content-main,
    body.single #postshow-b,
    body.single #sidebar,
    body.single #post-wrapper,
    body.single #post-wrapper>[id^="post-"],
    body.single main#postshow-a>article[id^="post-"] {
        min-width: 0;
        box-sizing: border-box;
    }

    body.single .si-single-top {
        overflow: visible;
    }

    body.single .si-single-top>div,
    body.single .si-single-top .si-single-top-a,
    body.single .si-single-top .byline,
    body.single .si-single-top .meta-content {
        min-width: 0;
        max-width: 100%;
    }

    body.single .si-single-top>div {
        max-height: none;
    }
}

/* ==========================================================================
   SINGLE WIDTH CONVERGENCE CONTRACT
   RWD-only variable layer. Desktop layout tokens stay untouched; smaller
   viewports share one safe-width contract instead of one-off hard overrides.
   ========================================================================== */

@media (max-width: 1320px) {
    body.single.hd-layout-customizable {
        --hd-single-safe-gutter: clamp(12px, 2.5vw, 24px);
        --hd-single-safe-viewport-width: min(100%, calc(100vw - (var(--hd-single-safe-gutter) * 2)));
        --hd-single-content-width-contract: min(var(--hd-content-max-width-active, var(--hd-content-max-width, 1000px)), var(--hd-single-safe-viewport-width));
        --hd-single-title-width-contract: min(var(--hd-title-max-width-active, var(--hd-content-max-width-active, 1000px)), var(--hd-single-safe-viewport-width));
        --hd-single-meta-width-contract: min(var(--hd-meta-max-width-active, var(--hd-content-max-width-active, 1000px)), var(--hd-single-safe-viewport-width));
        --hd-single-breadcrumb-width-contract: min(var(--hd-breadcrumb-max-width-active, var(--hd-content-max-width-active, 1000px)), var(--hd-single-safe-viewport-width));
        --hd-single-media-width-contract: min(var(--hd-featured-image-max-width-active, var(--hd-content-max-width-active, 1000px)), var(--hd-single-safe-viewport-width));
    }

    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) .main-layout-wrapper,
    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) #content-main,
    body.single.hd-layout-customizable:not(.hd-cw-fullwidth) #si-single-content {
        width: 100%;
        max-width: var(--hd-single-content-width-contract);
        box-sizing: border-box;
    }

    body.single.hd-layout-customizable #breadcrumb,
    body.single.hd-layout-customizable .main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb {
        max-width: var(--hd-single-breadcrumb-width-contract);
        box-sizing: border-box;
    }

    body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-title-top {
        max-width: var(--hd-single-title-width-contract);
        box-sizing: border-box;
    }

    body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-single-top {
        max-width: var(--hd-single-meta-width-contract);
        box-sizing: border-box;
    }

    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.post-thumbnail {
        max-width: var(--hd-single-media-width-contract);
        box-sizing: border-box;
    }

    body.single.hd-layout-customizable #article-author,
    body.single.hd-layout-customizable #comments,
    body.single.hd-layout-customizable .comments-area,
    body.single.hd-layout-customizable .comment-respond {
        max-width: var(--hd-single-content-width-contract);
        box-sizing: border-box;
    }
}

@media (max-width: 768px) {
    body.single.hd-layout-customizable {
        --hd-inline-safe-width: 100%;
    }

    body.single.hd-layout-customizable #si-single-content {
        max-width: min(var(--hd-content-max-width-active, 1000px), var(--hd-inline-safe-width));
    }

    body.single.hd-layout-customizable #breadcrumb,
    body.single.hd-layout-customizable .main-layout-wrapper.si-3-main-layout>#content-main>#breadcrumb,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.entry-header,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-title-top,
    body.single.hd-layout-customizable #post-wrapper>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable #post-wrapper.si-3-layout>[id^="post-"]>.si-single-top,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-single-top,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable #post-wrapper:not(.si-26-split-inspired)>[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable main#postshow-a>article[id^="post-"]>.post-thumbnail,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>#arcs-single-filter,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.si-hero-media-container,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.landscape-side-by-side__captions,
    body.single.hd-layout-customizable.hd-layout-key-4 #postshow-a>.post-thumbnail,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>#arcs-single-filter,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.si-hero-media-container,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.modern-landscape-side-by-side,
    body.single.hd-layout-customizable #post-wrapper.si-3-featured-title-below>[id^="post-"]>.landscape-side-by-side__captions {
        max-width: min(100%, var(--hd-inline-safe-width));
    }
}

/* ==========================================================================
   SINGLE CONTENT H2 STYLE PRESETS
   Controlled by Article Settings > Reading Style and single-post overrides.
   ========================================================================== */

body.hd-single-h2-style-left-border #si-single-content h2,
body.hd-single-h2-style-accent-bar #si-single-content h2,
body.hd-single-h2-style-underline #si-single-content h2,
body.hd-single-h2-style-double-line #si-single-content h2,
body.hd-single-h2-style-pill #si-single-content h2,
body.hd-single-h2-style-gradient #si-single-content h2,
body.hd-single-h2-style-card #si-single-content h2,
body.hd-single-h2-style-marker #si-single-content h2,
body.hd-single-h2-style-numbered #si-single-content h2,
body.hd-single-h2-style-editorial #si-single-content h2,
body.hd-single-h2-style-minimal #si-single-content h2 {
    position: relative;
    clear: both;
    overflow: visible;
    min-width: 1px;
    min-height: 1px;
    margin: 34px 0 20px;
    padding: 0.35em 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    color: #1f2937;
    font-weight: 800;
    line-height: 1.45;
    letter-spacing: 0.02em;
}

body.hd-single-h2-style-left-border #si-single-content h2 {
    padding: 0.28em 0.75em;
    border-left: 6px solid var(--hd-single-h2-accent, #e91e63);
    background: color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 7%, #ffffff);
}

body.hd-single-h2-style-accent-bar #si-single-content h2 {
    padding-top: 0.85em;
}

body.hd-single-h2-style-accent-bar #si-single-content h2::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 72px;
    height: 5px;
    border-radius: 999px;
    background: var(--hd-single-h2-accent, #e91e63);
}

body.hd-single-h2-style-underline #si-single-content h2 {
    padding-bottom: 0.45em;
    border-bottom: 3px solid color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 28%, #e5e7eb);
}

body.hd-single-h2-style-underline #si-single-content h2::after {
    content: "";
    position: absolute;
    right: auto;
    bottom: -3px;
    left: 0;
    width: 96px;
    height: 3px;
    border-radius: 999px;
    background: var(--hd-single-h2-accent, #e91e63);
}

body.hd-single-h2-style-double-line #si-single-content h2 {
    padding: 0.55em 0;
    border-top: 2px solid color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 34%, #d1d5db);
    border-bottom: 2px solid color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 34%, #d1d5db);
}

body.hd-single-h2-style-pill #si-single-content h2 {
    display: inline-flex;
    align-items: center;
    width: auto;
    max-width: 100%;
    padding: 0.48em 1em;
    border-radius: 999px;
    background: var(--hd-single-h2-accent, #e91e63);
    color: #ffffff;
}

body.hd-single-h2-style-gradient #si-single-content h2 {
    padding: 0.72em 0.95em;
    border-radius: 16px;
    background:
        linear-gradient(135deg, color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 92%, #111827), var(--hd-single-h2-accent, #e91e63));
    color: #ffffff;
    box-shadow: 0 16px 36px color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 22%, transparent);
}

body.hd-single-h2-style-card #si-single-content h2 {
    padding: 0.75em 0.95em;
    border: 1px solid color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 18%, #e5e7eb);
    border-radius: 18px;
    background: #ffffff;
    box-shadow: 0 14px 40px rgba(15, 23, 42, 0.08);
}

body.hd-single-h2-style-card #si-single-content h2::before {
    content: "";
    position: absolute;
    top: 14px;
    bottom: 14px;
    left: 0;
    width: 5px;
    border-radius: 0 999px 999px 0;
    background: var(--hd-single-h2-accent, #e91e63);
}

body.hd-single-h2-style-marker #si-single-content h2 {
    z-index: 0;
    display: inline;
    padding: 0.05em 0.18em;
    background:
        linear-gradient(transparent 58%, color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 32%, #fff7ed) 0);
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

body.hd-single-h2-style-numbered #si-single-content {
    counter-reset: hd-single-h2;
}

body.hd-single-h2-style-numbered #si-single-content h2 {
    display: flex;
    align-items: flex-start;
    gap: 0.65em;
}

body.hd-single-h2-style-numbered #si-single-content h2::before {
    counter-increment: hd-single-h2;
    content: counter(hd-single-h2, decimal-leading-zero);
    flex: 0 0 auto;
    min-width: 2.4em;
    padding: 0.14em 0.42em;
    border-radius: 999px;
    background: var(--hd-single-h2-accent, #e91e63);
    color: #ffffff;
    font-size: 0.72em;
    line-height: 1.55;
    text-align: center;
}

body.hd-single-h2-style-editorial #si-single-content h2 {
    padding-left: 1.2em;
    font-family: inherit;
    font-size: clamp(1.55rem, 1.25rem + 1vw, 2.15rem);
    line-height: 1.22;
}

body.hd-single-h2-style-editorial #si-single-content h2::before {
    content: "";
    position: absolute;
    top: 0.12em;
    left: 0;
    width: 0.42em;
    height: 0.42em;
    border-radius: 999px;
    background: var(--hd-single-h2-accent, #e91e63);
    box-shadow: 0 0.58em 0 color-mix(in srgb, var(--hd-single-h2-accent, #e91e63) 46%, #f3f4f6);
}

body.hd-single-h2-style-minimal #si-single-content h2 {
    padding: 0 0 0.25em;
    color: #111827;
    letter-spacing: 0.01em;
}

body.hd-single-h2-style-minimal #si-single-content h2::before {
    content: "#";
    margin-right: 0.38em;
    color: var(--hd-single-h2-accent, #e91e63);
    font-weight: 900;
}

@media (max-width: 768px) {

    body.hd-single-h2-style-left-border #si-single-content h2,
    body.hd-single-h2-style-accent-bar #si-single-content h2,
    body.hd-single-h2-style-underline #si-single-content h2,
    body.hd-single-h2-style-double-line #si-single-content h2,
    body.hd-single-h2-style-pill #si-single-content h2,
    body.hd-single-h2-style-gradient #si-single-content h2,
    body.hd-single-h2-style-card #si-single-content h2,
    body.hd-single-h2-style-marker #si-single-content h2,
    body.hd-single-h2-style-numbered #si-single-content h2,
    body.hd-single-h2-style-editorial #si-single-content h2,
    body.hd-single-h2-style-minimal #si-single-content h2 {
        margin: 28px 0 16px;
        font-size: 1.28rem;
    }

    body.hd-single-h2-style-pill #si-single-content h2,
    body.hd-single-h2-style-marker #si-single-content h2 {
        display: inline;
    }

    body.hd-single-h2-style-numbered #si-single-content h2 {
        display: flex;
    }
}

/* Comments: default closed / strict moderation UI */
.si-comments-shell {
    margin: 36px auto 0;
    padding: clamp(20px, 3vw, 32px);
    border: 1px solid rgba(226, 232, 240, 0.92);
    border-radius: 24px;
    background: linear-gradient(135deg, #ffffff 0%, #fbfcff 54%, #f8fafc 100%);
    box-shadow: 0 18px 48px rgba(15, 23, 42, 0.06);
    color: #111827;
}

.si-comments-shell__head {
    display: grid;
    gap: 6px;
    margin-bottom: 18px;
}

.si-comments-shell__eyebrow {
    margin: 0;
    color: #64748b;
    font-size: 0.72rem;
    font-weight: 780;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.si-comments-shell__title {
    margin: 0;
    font-size: clamp(1.35rem, 1.18rem + 0.8vw, 1.9rem);
    line-height: 1.24;
}

.si-comments-shell__summary {
    max-width: 720px;
    margin: 0;
    color: #64748b;
    font-size: 0.96rem;
    line-height: 1.75;
}

.si-comments-list {
    display: grid;
    gap: 14px;
    margin: 20px 0;
    padding: 0;
    list-style: none;
}

.si-comments-list .children {
    position: relative;
    display: grid;
    gap: 12px;
    margin: 12px 0 0 clamp(18px, 4vw, 44px);
    padding: 0 0 0 clamp(14px, 2vw, 22px);
    list-style: none;
}

.si-comments-list .children::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 10px;
    left: 0;
    width: 2px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(148, 163, 184, 0.48), rgba(148, 163, 184, 0.12));
}

.si-comments-list .children>.si-comment-item {
    position: relative;
}

.si-comments-list .children>.si-comment-item::before {
    content: "";
    position: absolute;
    top: 28px;
    left: calc(clamp(14px, 2vw, 22px) * -1);
    width: clamp(10px, 1.8vw, 18px);
    height: 2px;
    border-radius: 999px;
    background: rgba(148, 163, 184, 0.46);
}

.si-comment-card {
    display: grid;
    grid-template-columns: 56px minmax(0, 1fr);
    gap: 14px;
    padding: 16px;
    border: 1px solid rgba(226, 232, 240, 0.9);
    border-radius: 18px;
    background: #fff;
}

.si-comment-item--depth-2 .si-comment-card,
.si-comment-item--depth-3 .si-comment-card,
.si-comment-item--depth-4 .si-comment-card,
.si-comment-item--depth-5 .si-comment-card,
.si-comment-item--depth-6 .si-comment-card {
    background: #fbfdff;
}

.si-comment-item--depth-3 .si-comment-card,
.si-comment-item--depth-4 .si-comment-card,
.si-comment-item--depth-5 .si-comment-card,
.si-comment-item--depth-6 .si-comment-card {
    grid-template-columns: 48px minmax(0, 1fr);
    padding: 14px;
}

.si-comment-item--depth-3 .si-comment-card__avatar img,
.si-comment-item--depth-4 .si-comment-card__avatar img,
.si-comment-item--depth-5 .si-comment-card__avatar img,
.si-comment-item--depth-6 .si-comment-card__avatar img {
    width: 48px;
    height: 48px;
}

.si-comment-card__avatar img {
    display: block;
    width: 56px;
    height: 56px;
    border-radius: 999px;
    object-fit: cover;
}

.si-comment-card__body,
.si-comment-card__header {
    display: grid;
    gap: 6px;
    min-width: 0;
}

.si-comment-card__author {
    color: #111827;
    font-weight: 720;
    line-height: 1.35;
}

.si-comment-card__author a {
    color: inherit;
    text-decoration: none;
}

.si-comment-card__meta,
.si-comment-card__meta a {
    color: #64748b;
    font-size: 0.84rem;
    text-decoration: none;
}

.si-comment-card__pending,
.si-comments-policy,
.si-comments-closed {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    border: 1px solid rgba(251, 191, 36, 0.42);
    border-radius: 14px;
    background: #fffbeb;
    color: #92400e;
    font-size: 0.92rem;
    line-height: 1.65;
}

.si-comments-closed {
    border-color: rgba(148, 163, 184, 0.34);
    background: #f8fafc;
    color: #475569;
}

.si-comments-policy strong,
.si-comments-closed strong {
    flex: 0 0 auto;
    color: #111827;
}

.si-comment-card__content {
    color: #334155;
    line-height: 1.8;
}

.si-comment-card__content p {
    margin: 0 0 0.9em;
}

.si-comment-card__content p:last-child {
    margin-bottom: 0;
}

.si-comment-card__reply {
    margin-top: 8px;
}

.si-comment-card__reply a,
.si-comments-pagination a,
.si-comments-pagination span {
    display: inline-flex;
    align-items: center;
    min-height: 34px;
    padding: 6px 12px;
    border: 1px solid rgba(148, 163, 184, 0.4);
    border-radius: 999px;
    background: #fff;
    color: #334155;
    font-size: 0.86rem;
    font-weight: 680;
    text-decoration: none;
}

.si-comments-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 18px 0;
}

.si-comments-form-title {
    margin: 24px 0 8px;
    font-size: 1.15rem;
}

.si-comments-form-note,
.comment-form-comment label {
    color: #64748b;
    font-size: 0.92rem;
}

.comment-form-comment {
    display: grid;
    gap: 8px;
}

.comment-form-comment textarea,
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"] {
    width: 100%;
    border: 1px solid rgba(148, 163, 184, 0.5);
    border-radius: 14px;
    background: #fff;
    color: #111827;
    box-sizing: border-box;
}

.comment-form-comment textarea {
    min-height: 150px;
    padding: 12px 14px;
    resize: vertical;
}

.comment-form .form-submit .submit {
    border: 0;
    border-radius: 999px;
    background: #111827;
    color: #fff;
    padding: 10px 18px;
    font-weight: 760;
    cursor: pointer;
}

.si-comment-hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

.si-comments-turnstile {
    margin: 12px 0;
}

@media (max-width: 640px) {
    .si-comments-shell {
        padding: 18px;
        border-radius: 20px;
    }

    .si-comments-list {
        gap: 12px;
        margin-top: 16px;
    }

    .si-comments-list .children {
        gap: 10px;
        margin-left: 10px;
        padding-left: 12px;
    }

    .si-comments-list .children>.si-comment-item::before {
        top: 23px;
        left: -12px;
        width: 10px;
    }

    .si-comment-card {
        grid-template-columns: 44px minmax(0, 1fr);
        padding: 14px;
    }

    .si-comment-card__avatar img {
        width: 44px;
        height: 44px;
    }

    .si-comment-item--depth-2 .si-comment-card,
    .si-comment-item--depth-3 .si-comment-card,
    .si-comment-item--depth-4 .si-comment-card,
    .si-comment-item--depth-5 .si-comment-card,
    .si-comment-item--depth-6 .si-comment-card {
        grid-template-columns: 36px minmax(0, 1fr);
        gap: 10px;
        padding: 12px;
    }

    .si-comment-item--depth-2 .si-comment-card__avatar img,
    .si-comment-item--depth-3 .si-comment-card__avatar img,
    .si-comment-item--depth-4 .si-comment-card__avatar img,
    .si-comment-item--depth-5 .si-comment-card__avatar img,
    .si-comment-item--depth-6 .si-comment-card__avatar img {
        width: 36px;
        height: 36px;
    }

    .si-comments-policy,
    .si-comments-closed {
        flex-direction: column;
        gap: 4px;
    }
}


/* === frontend-toc.css === */
/* ==========================================================================
   Super Module - 前台智慧目錄 (TOC) & 浮動按鈕樣式
   Version: 15.3 (修正版 - 左側☰圖示, 右側文字切換)
   ========================================================================== */

/* ==========================================================================
   1. 內嵌目錄樣式 ([id^="toc_container"])
   ========================================================================== */

[id^="toc_container"] {
margin: 30px auto 40px;
box-sizing: border-box;
min-width: var(--hd-toc-min-width, 68%);
padding: 25px 32px;
background: #fff;
border-top: 4px solid var(--hd-toc-theme-color, #6bb6ff);
box-shadow: 0 2px 15px rgba(0,0,0,0.08);
border-radius: 8px;
display: table;
}

[data-hd-toc-container] {
display: block;
width: min(100%, var(--hd-toc-max-width, 860px));
max-width: 100%;
min-width: 0;
text-align: left;
}

[data-hd-toc-container].hd-toc-container--align-left {
margin-left: 0;
margin-right: auto;
}

[data-hd-toc-container].hd-toc-container--align-center {
margin-left: auto;
margin-right: auto;
}

[data-hd-toc-container].hd-toc-container--align-right {
margin-left: auto;
margin-right: 0;
}

.hd-toc-container--editor-preview {
margin-top: 12px;
margin-bottom: 12px;
}

/* --- 重置 --- */
[id^="toc_container"] ul, [id^="toc_container"] li {
list-style: none !important;
background: none !important;
padding: 0 !important; margin: 0 !important;
}
.entry-content [id^="toc_container"] ul li::before,
.entry-content [id^="toc_container"] ul li::after {
content: none !important;
}

/* Shield TOC list spacing/typography from article-body list presets like
   `body.single #si-single-content ul` so the TOC keeps its own card rhythm. */
body.single #si-single-content [id^="toc_container"] ul.toc_list,
[id^="toc_container"] ul.toc_list {
margin: 0 !important;
padding: 0 !important;
font-size: inherit !important;
width: 100% !important;
}

body.single #si-single-content [id^="toc_container"] p.toc_title + ul.toc_list,
[id^="toc_container"] p.toc_title + ul.toc_list {
margin: 20px 0 0 !important;
padding: 20px 0 0 !important;
}

body.single #si-single-content [id^="toc_container"] > ul.toc_list > li > ul.toc_list,
[id^="toc_container"] > ul.toc_list > li > ul.toc_list {
margin: 8px 0 0 40px !important;
padding-left: 14px !important;
}

body.single #si-single-content [data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list,
[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
margin: 8px 40px 0 0 !important;
padding-left: 0 !important;
padding-right: 14px !important;
}

/* --- 標題 --- */
[id^="toc_container"] .toc_title {
font-weight: bold;
font-size: 1.2rem;
padding: 0;
margin: 0;
display: flex;
align-items: center;
gap: 12px;
color: #333;
}

/* ▼▼▼【核心修正：左側主圖示樣式】▼▼▼ */
/* 移除舊的 Dashicon ::before 樣式 */
[id^="toc_container"] .toc_title::before {
content: none !important;
}
/* 為新的 ☰ span 添加樣式 */
[id^="toc_container"] .toc-main-icon {
display: flex;
align-items: center;
justify-content: center;
flex-shrink: 0;
width: 32px;
height: 32px;
border-radius: 8px; /* 可改為 50% 變圓形 */
background-color: var(--hd-toc-theme-color, #6bb6ff);
color: #fff;
font-size: 20px;
font-weight: bold;
line-height: 1;
}



/* ▼▼▼【核心修正：右側文字切換按鈕樣式】▼▼▼ */
[id^="toc_container"] .toc_toggle { margin-left: auto; }
[id^="toc_container"] .toc_toggle .hd-toc-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
min-height: 34px;
padding: 6px 12px;
font-size: 12px;
font-weight: 700;
letter-spacing: 0;
color: #475569;
background-color: #f8fafc;
border: 1px solid rgba(148, 163, 184, 0.24);
border-radius: 999px;
text-decoration: none;
box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s, transform .2s;
cursor: pointer;
}
[id^="toc_container"] .toc_toggle a::before {
content: "—";
font-size: 10px;
font-weight: 800;
line-height: 1;
}
[id^="toc_container"] .toc_toggle .hd-toc-toggle::before {
content: "—";
font-size: 10px;
font-weight: 800;
line-height: 1;
}
[id^="toc_container"] .toc_toggle a[aria-expanded="false"]::before {
content: "+";
font-size: 12px;
}
[id^="toc_container"] .toc_toggle .hd-toc-toggle[aria-expanded="false"]::before {
content: "+";
font-size: 12px;
}
[id^="toc_container"] .toc_toggle .hd-toc-toggle:hover,
[id^="toc_container"] .toc_toggle .hd-toc-toggle:focus-visible {
color: var(--hd-toc-theme-color, #6bb6ff);
background-color: #eff6ff;
border-color: rgba(107, 182, 255, 0.32);
box-shadow: 0 10px 22px rgba(15, 23, 42, 0.1);
transform: translateY(-1px);
outline: none;
}



/* --- 列表容器 --- */
[id^="toc_container"] p.toc_title + ul.toc_list {
padding-top: 20px;
margin-top: 20px;
border-top: 1px solid #eee;
width: 100%;
justify-items: stretch;
}

[data-hd-toc-container].is-collapsed > ul.toc_list,
[data-hd-toc-container][data-current-state="collapsed"] > ul.toc_list {
display: none;
}

/* --- 列表通用 --- */
[id^="toc_container"] li { position: relative; }
[id^="toc_container"] a { text-decoration: none; display: inline-block; transition: color .2s, background-color .2s, border-color .2s, box-shadow .2s; color: #333; line-height: 1.7; overflow-wrap: anywhere; }
[id^="toc_container"] a:hover { color: var(--hd-toc-theme-color, #6bb6ff); }
/* H2 主層級 */
[id^="toc_container"] > ul.toc_list > li { display: flex; align-items: flex-start; flex-wrap: wrap; padding: 8px 0 !important; min-width: 0 !important; }
[id^="toc_container"] > ul.toc_list > li > a { font-size: 1rem; font-weight: bold; flex: 1 1 calc(100% - 40px); min-width: 0; }
[id^="toc_container"] { counter-reset: toc-h2-counter; }
[id^="toc_container"] > ul.toc_list > li::before { counter-increment: toc-h2-counter; content: counter(toc-h2-counter) !important; display: flex !important; align-items: center; justify-content: center; flex-shrink: 0; width: 28px; height: 28px; margin-right: 12px; border-radius: 50%; background-color: var(--hd-toc-theme-color, #6bb6ff); color: #fff; font-size: 14px; font-weight: bold; }
/* H3 子層級 */
[id^="toc_container"] > ul.toc_list > li > ul.toc_list { flex: 0 0 100%; box-sizing: border-box; margin-top: 8px; margin-left: 40px; padding-left: 14px; position: relative; width: 100%; min-width: 0; }
[id^="toc_container"] > ul.toc_list > li.has-children > ul.toc_list::before { content: none !important; display: none !important; }
[id^="toc_container"] > ul.toc_list > li > ul.toc_list li { padding: 4px 0 !important; }
[id^="toc_container"] > ul.toc_list > li > ul.toc_list li a { font-size: 0.9rem; font-weight: normal; color: #555; }
[id^="toc_container"] > ul.toc_list > li > ul.toc_list li::before { content: none !important; display: none !important; }

[data-hd-toc-container].hd-toc-container--align-left .toc_title,
[data-hd-toc-container].hd-toc-container--align-left .toc_list,
[data-hd-toc-container].hd-toc-container--align-left .toc_list li,
[data-hd-toc-container].hd-toc-container--align-left .toc_list li a {
text-align: left;
}

[data-hd-toc-container].hd-toc-container--align-left .toc_title {
justify-content: flex-start;
}

[data-hd-toc-container].hd-toc-container--align-left .toc_toggle {
margin-left: 0;
}

[data-hd-toc-container].hd-toc-container--align-center .toc_list {
justify-items: center;
}

[data-hd-toc-container].hd-toc-container--align-center .toc_title {
justify-content: center;
}

[data-hd-toc-container].hd-toc-container--align-center .toc_toggle {
margin-left: 0;
}

[data-hd-toc-container].hd-toc-container--align-right .toc_title,
[data-hd-toc-container].hd-toc-container--align-right .toc_list,
[data-hd-toc-container].hd-toc-container--align-right .toc_list li,
[data-hd-toc-container].hd-toc-container--align-right .toc_list li a {
text-align: right;
}

[data-hd-toc-container].hd-toc-container--align-right .toc_title {
justify-content: flex-end;
}

[data-hd-toc-container].hd-toc-container--align-right .toc_toggle {
margin-left: 0;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li {
justify-content: flex-end;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li::before {
order: 2;
margin-left: 12px;
margin-right: 0;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li > a {
order: 1;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
margin-left: 0;
margin-right: 40px;
padding-left: 0;
padding-right: 14px;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li.has-children > ul.toc_list::before {
    content: none !important;
    display: none !important;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li {
padding: 4px 0;
}

[data-hd-toc-container].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li::before {
content: none !important;
display: none !important;
}

/* --- RWD --- */
@media only screen and (max-width: 667px) {
[id^="toc_container"] { padding: 20px; width: auto; display: block; }
[data-hd-toc-container] { width: 100%; margin-left: 0; margin-right: 0; }
[id^="toc_container"] .toc_title { flex-wrap: wrap; row-gap: 8px; }
[id^="toc_container"] .toc_toggle { margin-left: 0; }
[id^="toc_container"] > ul.toc_list > li > ul.toc_list { margin-left: 34px; }
}

/* ==========================================================================
   2. 浮動按鈕 (TOC & Back to Top)
   ========================================================================== */
.hd-floating-buttons { position: fixed; z-index: 9999; display: flex; flex-direction: column; gap: 10px; }
.hd-floating-buttons.pos-right { right: 20px; }
.hd-floating-buttons.pos-left { left: 20px; }
.hd-floating-buttons.pos-bottom-right { right: 20px; left: auto; }
.hd-floating-buttons.pos-bottom-left { left: 20px; right: auto; }

.hd-floating-buttons:not([class*="btt-fixed-"]):not(.is-fixed-bottom) { top: 60%; transform: translateY(-50%); }
.hd-floating-buttons.btt-fixed-bottom-right, 
.hd-floating-buttons.is-fixed-bottom.pos-bottom-right { top: auto; bottom: calc(100px + var(--hd-bottom-fixed-safe-offset, 0px)); right: 10px; left: auto; transform: none; }
.hd-floating-buttons.btt-fixed-bottom-left,
.hd-floating-buttons.is-fixed-bottom.pos-bottom-left { top: auto; bottom: calc(30px + var(--hd-bottom-fixed-safe-offset, 0px)); left: 20px; right: auto; transform: none; }
.hd-floating-buttons.btt-only { top: auto; bottom: calc(100px + var(--hd-bottom-fixed-safe-offset, 0px)); right: 10px; left: auto; transform: none; }
.hd-floating-buttons.btt-only.btt-fixed-bottom-left { bottom: calc(30px + var(--hd-bottom-fixed-safe-offset, 0px)); left: 20px; right: auto; }

/* --- RWD Visibility --- */
@media (min-width: 992px) { .hd-hide-desktop { display: none !important; } }
@media (min-width: 768px) and (max-width: 991px) { .hd-hide-tablet { display: none !important; } }
@media (max-width: 767px) { .hd-hide-mobile { display: none !important; } }

.hd-floating-buttons.btt-pos-above { flex-direction: column-reverse; }
#hd-toc-floating-button, #hd-back-to-top-button { width: 50px; height: 50px; border-radius: 50%; color: white; border: none; cursor: pointer; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); display: flex; align-items: center; justify-content: center; text-decoration: none; transition: transform 0.2s, background-color 0.2s, filter 0.2s; }
#hd-toc-floating-button:hover, #hd-back-to-top-button:hover { transform: scale(1.1); filter: brightness(0.92); }
#hd-toc-floating-container { 
    position: relative; 
    opacity: 0; 
    visibility: hidden; 
    transform: translateY(20px); 
    transition: opacity 0.3s, visibility 0.3s, transform 0.3s; 
}
#hd-toc-floating-container.is-visible { 
    opacity: 1; 
    visibility: visible; 
    transform: translateY(0); 
}
#hd-toc-floating-container.hd-toc-empty-shell {
    display: none;
}
#hd-toc-floating-button { font-size: 24px; line-height: 1; padding: 0; background-color: var(--hd-toc-theme-color, #6bb6ff); }
#hd-toc-floating-nav { 
    position: absolute; 
    background: white; 
    border-radius: 8px; 
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); 
    width: 300px; 
    max-height: 70vh; 
    padding: 0; 
    display: flex; 
    flex-direction: column; 
    opacity: 0; 
    visibility: hidden; 
    transform: scale(0.95); 
    transition: opacity 0.2s, transform 0.2s, visibility 0.2s; 
    z-index: 10000;
    right: 0;
}
/* 垂直位置：當在側邊時置中，當在底部時向上展開 (包含 BTT 固定底部的狀況) */
.hd-floating-buttons:not(.is-fixed-bottom):not([class*="btt-fixed-bottom"]) #hd-toc-floating-nav { top: 0; transform: scale(0.95) translateY(-40%); }
.hd-floating-buttons.is-fixed-bottom #hd-toc-floating-nav,
.hd-floating-buttons[class*="btt-fixed-bottom"] #hd-toc-floating-nav { bottom: calc(100% + 15px); top: auto; transform: scale(0.95) translateY(10px); }

.hd-floating-buttons.pos-right #hd-toc-floating-nav { right: calc(100% + 10px); transform-origin: right center; }
.hd-floating-buttons.pos-left #hd-toc-floating-nav { left: calc(100% + 10px); transform-origin: left center; }
.hd-floating-buttons.pos-bottom-right #hd-toc-floating-nav { 
    right: 0; /* 改回 0，對齊按鈕右側，避免貼齊螢幕邊緣導致被切到 */
    transform-origin: bottom right; 
    text-align: right;
}
.hd-floating-buttons.pos-bottom-left #hd-toc-floating-nav { left: 0; transform-origin: bottom left; }

/* 當目錄在右側時，調整縮進方向 */
.hd-floating-buttons.pos-bottom-right #hd-toc-floating-nav .toc-level-3 a { padding-left: 0; padding-right: 20px; }
.hd-floating-buttons.pos-bottom-right #hd-toc-floating-nav .toc-level-4 a { padding-left: 0; padding-right: 40px; }
.hd-floating-buttons.pos-bottom-right #hd-toc-floating-nav .toc-level-5 a { padding-left: 0; padding-right: 60px; }
.hd-floating-buttons.pos-bottom-right #hd-toc-floating-nav .toc-level-6 a { padding-left: 0; padding-right: 80px; }


/* --- Active State Transforms --- */
/* 普通側邊位置 (垂直置中) */
.hd-floating-buttons:not(.is-fixed-bottom):not([class*="btt-fixed-bottom"]) #hd-toc-floating-container.is-active #hd-toc-floating-nav { 
    opacity: 1; 
    visibility: visible; 
    transform: scale(1) translateY(-50%); 
}
/* 底部位置 (錨定在按鈕上方展開) */
.hd-floating-buttons.is-fixed-bottom #hd-toc-floating-container.is-active #hd-toc-floating-nav,
.hd-floating-buttons[class*="btt-fixed-bottom"] #hd-toc-floating-container.is-active #hd-toc-floating-nav { 
    opacity: 1; 
    visibility: visible; 
    transform: scale(1) translateY(0); 
}

.hd-toc-nav-inner { padding: 15px 20px; overflow-y: auto; flex-grow: 1; }
#hd-toc-floating-nav .toc_title { font-size: 16px; font-weight: bold; margin: 0 0 10px; padding-bottom: 10px; border-bottom: 1px solid #eee; color: var(--hd-toc-theme-color, #6bb6ff); }
#hd-toc-floating-nav ul, #hd-toc-floating-nav li { list-style: none; padding: 0; margin: 0; }
#hd-toc-floating-nav a { text-decoration: none; color: #333; display: block; padding: 6px 0; border-radius: 4px; transition: background-color 0.2s; }
#hd-toc-floating-nav a:hover { background-color: #f0f7ff; color: var(--hd-toc-theme-color, #6bb6ff); }
#hd-toc-floating-nav .toc-level-3 a { padding-left: 20px; }
#hd-toc-floating-nav .toc-level-4 a { padding-left: 40px; }
#hd-toc-floating-nav .toc-level-5 a { padding-left: 60px; }
#hd-toc-floating-nav .toc-level-6 a { padding-left: 80px; }
.hd-toc-btt-wrapper { padding: 10px 20px; border-top: 1px solid #e9ecef; }
.hd-toc-back-to-top { font-weight: bold; color: var(--hd-toc-theme-color, #6bb6ff); }
#hd-back-to-top-button { background: rgba(0, 0, 0, 0.5); flex-direction: column; line-height: 1; opacity: 0; visibility: hidden; transform: translateY(20px); transition: opacity 0.3s, visibility 0.3s, transform 0.3s; }
#hd-back-to-top-button:hover { background: rgba(0, 0, 0, 0.7); filter: none; }
#hd-back-to-top-button.is-visible { opacity: 1; visibility: visible; transform: translateY(0); }
.hd-btt-arrow { font-size: 14px; }
.hd-btt-text { font-size: 10px; font-weight: bold; margin-top: 2px; }

.hd-floating-buttons.hd-btt-runtime-wrapper {
position: fixed !important;
z-index: 9999 !important;
top: auto !important;
transform: none !important;
display: flex !important;
flex-direction: column !important;
gap: 10px !important;
}
.hd-floating-buttons.hd-btt-runtime-wrapper.btt-fixed-bottom-right {
right: 10px !important;
left: auto !important;
bottom: calc(100px + var(--hd-bottom-fixed-safe-offset, 0px)) !important;
}
.hd-floating-buttons.hd-btt-runtime-wrapper.btt-fixed-bottom-left {
left: 20px !important;
right: auto !important;
bottom: calc(30px + var(--hd-bottom-fixed-safe-offset, 0px)) !important;
}
#hd-back-to-top-button.hd-btt-runtime {
width: 50px !important;
height: 50px !important;
border-radius: 50% !important;
border: 0 !important;
background: rgba(0, 0, 0, .58) !important;
color: #fff !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
flex-direction: column !important;
line-height: 1 !important;
text-decoration: none !important;
box-shadow: 0 2px 10px rgba(0, 0, 0, .2) !important;
opacity: 0 !important;
visibility: hidden !important;
transform: translateY(20px) !important;
transition: opacity .25s ease, visibility .25s ease, transform .25s ease !important;
pointer-events: auto !important;
}
#hd-back-to-top-button.hd-btt-runtime.is-visible {
opacity: 1 !important;
visibility: visible !important;
transform: translateY(0) !important;
}
#hd-back-to-top-button.hd-btt-runtime .hd-btt-arrow {
font-size: 14px !important;
}
#hd-back-to-top-button.hd-btt-runtime .hd-btt-text {
font-size: 10px !important;
font-weight: 700 !important;
margin-top: 2px !important;
}
@media (min-width: 1024px) {
#hd-back-to-top-button.hd-btt-hide-desktop { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
#hd-back-to-top-button.hd-btt-hide-tablet { display: none !important; }
}
@media (max-width: 767px) {
#hd-back-to-top-button.hd-btt-hide-mobile { display: none !important; }
}

/* ==========================================================================
   1.1 Manual TOC block variants
   ========================================================================== */
[id^="toc_container"].hd-toc-container--minimal {
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
border: 1px solid rgba(148, 163, 184, 0.22);
border-top: 3px solid var(--hd-toc-theme-color, #6bb6ff);
box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
padding: 18px 18px 16px;
border-radius: 18px;
min-width: 0;
display: block;
}

[id^="toc_container"].hd-toc-container--minimal .toc_title {
font-size: 1.02rem;
font-weight: 700;
color: #0f172a;
align-items: center;
gap: 10px;
}

[id^="toc_container"].hd-toc-container--minimal .toc-main-icon {
width: 30px;
height: 30px;
border-radius: 999px;
font-size: 17px;
box-shadow: 0 10px 20px rgba(107, 182, 255, 0.18);
}

[id^="toc_container"].hd-toc-container--minimal .toc_toggle a {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 34px;
padding: 6px 12px;
background: #fff;
border: 1px solid rgba(148, 163, 184, 0.24);
border-radius: 999px;
font-size: 12px;
font-weight: 700;
color: #475569;
}

[id^="toc_container"].hd-toc-container--minimal .toc_toggle .hd-toc-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 34px;
padding: 6px 12px;
background: #fff;
border: 1px solid rgba(148, 163, 184, 0.24);
border-radius: 999px;
font-size: 12px;
font-weight: 700;
color: #475569;
}

[id^="toc_container"].hd-toc-container--minimal .toc_toggle .hd-toc-toggle:hover {
background: #eff6ff;
border-color: rgba(107, 182, 255, 0.36);
color: var(--hd-toc-theme-color, #6bb6ff);
}

[id^="toc_container"].hd-toc-container--minimal p.toc_title + ul.toc_list {
display: grid;
gap: 10px;
margin-top: 16px;
padding-top: 16px;
border-top-color: rgba(203, 213, 225, 0.72);
justify-items: stretch;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li {
padding: 0;
align-items: stretch;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li::before {
position: absolute;
left: 12px;
top: 12px;
z-index: 1;
background: #eff6ff !important;
color: var(--hd-toc-theme-color, #6bb6ff);
width: 32px;
height: 32px;
margin-right: 0;
border: 1px solid rgba(107, 182, 255, 0.22);
box-shadow: none;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > a {
display: block;
flex: 1 1 100%;
padding: 12px 14px 12px 56px;
min-height: 56px;
border: 1px solid rgba(203, 213, 225, 0.86);
border-radius: 14px;
background: #fff;
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);
color: #0f172a;
line-height: 1.55;
text-align: left;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > a:hover {
background: #f8fbff;
border-color: rgba(107, 182, 255, 0.35);
box-shadow: 0 12px 24px rgba(15, 23, 42, 0.08);
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > ul.toc_list {
margin-top: 8px;
margin-left: 0;
padding-left: 56px;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li.has-children > ul.toc_list::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > ul.toc_list li {
padding: 0;
margin-top: 6px;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > ul.toc_list li a {
display: block;
padding: 6px 10px;
border-radius: 10px;
background: rgba(248, 250, 252, 0.92);
color: #475569;
text-align: left;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > ul.toc_list li a:hover {
background: #eef6ff;
color: var(--hd-toc-theme-color, #6bb6ff);
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > ul.toc_list li::before {
top: 13px;
transform: none;
font-size: 14px;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-left .toc_title,
[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-left > ul.toc_list > li > a,
[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-left > ul.toc_list > li > ul.toc_list li a {
text-align: left;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-center .toc_title {
justify-content: center;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-center .toc_toggle {
margin-left: 0;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-center > ul.toc_list > li {
justify-content: center;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-center > ul.toc_list > li > a {
text-align: center;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right .toc_title {
justify-content: flex-end;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right .toc_toggle {
margin-left: 0;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li {
justify-content: flex-end;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li::before {
left: auto;
right: 12px;
margin-left: 0;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li > a {
padding: 12px 56px 12px 14px;
text-align: right;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
padding-left: 0;
padding-right: 56px;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li.has-children > ul.toc_list::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li {
padding: 0;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li::before {
left: auto;
right: 0;
}

[id^="toc_container"].hd-toc-container--minimal.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li a {
text-align: right;
}

[id^="toc_container"].hd-toc-container--soft {
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
border-top-width: 3px;
box-shadow: 0 18px 36px rgba(15, 23, 42, 0.08);
}

[id^="toc_container"].hd-toc-container--accent {
background: linear-gradient(135deg, rgba(107, 182, 255, 0.12) 0%, #ffffff 88%);
border-top-width: 0;
border-left: 6px solid var(--hd-toc-theme-color, #6bb6ff);
padding-left: 28px;
}

[id^="toc_container"].hd-toc-container--accent .toc-main-icon {
box-shadow: 0 12px 24px rgba(107, 182, 255, 0.22);
}

[id^="toc_container"].hd-toc-container--editorial {
background: #0f172a;
border-top-width: 0;
color: #e2e8f0;
box-shadow: 0 22px 44px rgba(15, 23, 42, 0.22);
}

[id^="toc_container"].hd-toc-container--editorial .toc_title,
[id^="toc_container"].hd-toc-container--editorial a,
[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li a {
color: #e2e8f0;
}

[id^="toc_container"].hd-toc-container--editorial p.toc_title + ul.toc_list {
border-top-color: rgba(226, 232, 240, 0.16);
}

[id^="toc_container"].hd-toc-container--editorial .toc_toggle .hd-toc-toggle {
background: rgba(226, 232, 240, 0.12);
color: #e2e8f0;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li::before {
color: #93c5fd;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"].hd-toc-container--editorial a:hover {
color: #93c5fd;
}

@media only screen and (max-width: 667px) {
[id^="toc_container"].hd-toc-container--minimal {
padding: 16px 14px 14px;
border-radius: 16px;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li::before {
left: 10px;
top: 10px;
width: 30px;
height: 30px;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > a {
padding: 10px 12px 10px 48px;
min-height: 50px;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li > ul.toc_list {
padding-left: 48px;
}

[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li.has-children > ul.toc_list::before {
    content: none !important;
    display: none !important;
}
}

/* ==========================================================================
   1.2 Accordion TOC style variant
   ========================================================================== */
[id^="toc_container"].hd-toc-container--accordion {
    background: #ffffff;
    border: 1px solid #eaeaea;
    padding: 40px;
    border-radius: 0;
    display: block;
    width: 100%;
    box-shadow: none;
    box-sizing: border-box;
}

[id^="toc_container"].hd-toc-container--accordion .toc_title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #1a1a1a;
    padding-bottom: 14px;
    border-bottom: 2px solid #1a1a1a;
    margin-bottom: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
}

[id^="toc_container"].hd-toc-container--accordion .toc-main-icon {
    display: none !important;
}

[id^="toc_container"].hd-toc-container--accordion .toc_toggle {
    display: inline-flex !important;
    margin-left: auto;
}

/* High-specificity overrides for the list, spacing, borders and colors */
[id^="toc_container"][class*="hd-toc-container--"] p.toc_title + ul.toc_list,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] p.toc_title + ul.toc_list {
    padding-top: 12px !important;
    margin-top: 0 !important;
    border-top: none !important;
}

/* List items styling */
[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li {
    border-bottom: 1px solid #eaeaea !important;
    padding: 16px 0 !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    position: relative !important;
    margin: 0 !important;
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li:last-child,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li:last-child {
    border-bottom: none !important;
}

/* Disable counters or bullets on H2 (Only for Accordion style) */
[id^="toc_container"].hd-toc-container--accordion > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--accordion > ul.toc_list > li::before {
    content: none !important;
    display: none !important;
}

/* Numbering show/hide settings */
[id^="toc_container"].no-numbering > ul.toc_list > li::before,
.hd-toc-container--editor-preview.no-numbering > ul.toc_list > li::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"].hd-toc-container--accordion.has-numbering > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--accordion.has-numbering > ul.toc_list > li::before {
    counter-increment: toc-h2-counter;
    content: counter(toc-h2-counter) ". " !important;
    display: inline-flex !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: inherit !important;
    background: none !important;
    border-radius: 0 !important;
    width: auto !important;
    height: auto !important;
    margin-right: 6px !important;
    position: static !important;
}

[id^="toc_container"].hd-toc-container--accordion.has-numbering.hd-toc-container--align-right > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--accordion.has-numbering.hd-toc-container--align-right > ul.toc_list > li::before {
    margin-right: 0 !important;
    margin-left: 6px !important;
    order: 2 !important;
}

/* Ensure H3 and H4 subheadings under accordion have NO bullets/numbers */
[id^="toc_container"].hd-toc-container--accordion ul.toc_list ul.toc_list li::before,
.hd-toc-container--editor-preview.hd-toc-container--accordion ul.toc_list ul.toc_list li::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"].hd-toc-container--accordion ul.toc_list ul.toc_list li,
.hd-toc-container--editor-preview.hd-toc-container--accordion ul.toc_list ul.toc_list li {
    padding: 16px 0 !important;
}

/* Normalize minimal style circle layout to flow naturally like the default style */
[id^="toc_container"].hd-toc-container--minimal > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--minimal > ul.toc_list > li::before {
    position: static !important;
    margin-right: 12px !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    box-shadow: none !important;
}

/* H2 Anchors */
[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li > a,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li > a {
    font-size: 1rem !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    flex: 1 !important;
    line-height: 1.5 !important;
    transition: color 0.2s ease !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-height: 0 !important;
    text-align: left !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > a,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li > a {
    color: #ffffff !important;
}

[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li > a:hover,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li > a:hover {
    color: var(--hd-toc-theme-color, #6bb6ff) !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > a:hover,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li > a:hover {
    color: #93c5fd !important;
}

/* Child toggle button '+' on the right */
.hd-toc-child-toggle {
    background: #ffffff;
    border: 1px solid #cccccc;
    color: #555555;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 3px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 400;
    transition: all 0.2s ease;
    margin-left: 12px;
    outline: none;
    padding: 0;
    line-height: 1;
    box-shadow: none;
}

.hd-toc-child-toggle:hover {
    border-color: var(--hd-toc-theme-color, #6bb6ff);
    color: var(--hd-toc-theme-color, #6bb6ff);
    background: #fafafa;
}

.hd-toc-child-toggle[aria-expanded="true"] {
    background-color: #ffffff;
    color: #555555;
    border-color: #cccccc;
}

/* Child subheadings list */
[id^="toc_container"][class*="hd-toc-container--"] li ul.toc_list,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] li ul.toc_list {
    flex: 0 0 100% !important;
    display: none !important;
    padding-right: 0 !important;
    border-left: none !important;
    border-right: none !important;
}

/* Specific margins and paddings for accordion vs non-accordion styles */
[id^="toc_container"].hd-toc-container--accordion > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--accordion > ul.toc_list > li > ul.toc_list {
    margin: 15px auto !important;
    padding-left: 0px !important;
    padding-right: 0 !important;
}

[id^="toc_container"]:not(.hd-toc-container--accordion)[class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview:not(.hd-toc-container--accordion)[class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list {
    margin: 15px auto !important;
    padding-left: 40px !important;
    padding-right: 0 !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li > ul.toc_list {
    border-left: none !important;
}

/* Disable old dashed list borders */
[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li.has-children > ul.toc_list::before,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li.has-children > ul.toc_list::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"][class*="hd-toc-container--"] li.is-child-expanded > ul.toc_list,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] li.is-child-expanded > ul.toc_list {
    display: block !important;
}

[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 16px 0 !important;
    position: relative !important;
    border-bottom: 1px solid #eaeaea !important;
    margin: 0 !important;
    background: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    border-top: none !important;
    border-left: none !important;
    border-right: none !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
}

[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li:last-child,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li:last-child {
    border-bottom: none !important;
}



[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li a,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li a {
    font-size: 0.95rem !important;
    font-weight: 500 !important;
    color: #555555 !important;
    transition: color 0.2s ease !important;
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    text-align: left !important;
    min-height: 0 !important;
    flex: 1 !important;
    line-height: 1.5 !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li a,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li a {
    color: #cbd5e1 !important;
}

[id^="toc_container"][class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li a:hover,
.hd-toc-container--editor-preview[class*="hd-toc-container--"] > ul.toc_list > li > ul.toc_list li a:hover {
    color: var(--hd-toc-theme-color, #6bb6ff) !important;
}

[id^="toc_container"].hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li a:hover,
.hd-toc-container--editor-preview.hd-toc-container--editorial > ul.toc_list > li > ul.toc_list li a:hover {
    color: #93c5fd !important;
}

/* Alignment Overrides */
[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li {
    justify-content: flex-end !important;
}

[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li::before,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li::before {
    order: 2 !important;
    margin-left: 12px !important;
    margin-right: 0 !important;
}

[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > a,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > a {
    text-align: right !important;
    order: 1 !important;
}

[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right .hd-toc-child-toggle,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right .hd-toc-child-toggle {
    order: 0 !important;
    margin-left: 0 !important;
    margin-right: 12px !important;
}

[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
    border-left: none !important;
    padding-left: 0 !important;
}

[id^="toc_container"].hd-toc-container--accordion.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--accordion.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
    margin: 12px 0 0 0 !important;
    padding-right: 16px !important;
    padding-left: 0 !important;
    border-right: none !important;
}

[id^="toc_container"]:not(.hd-toc-container--accordion)[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview:not(.hd-toc-container--accordion)[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
    margin: 12px 0 0 0 !important;
    padding-right: 40px !important;
    padding-left: 0 !important;
    border-right: none !important;
}

[id^="toc_container"].hd-toc-container--editorial.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--editorial.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
    border-right: none !important;
}

[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li::before,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li::before {
    content: none !important;
    display: none !important;
}

[id^="toc_container"][class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li a,
.hd-toc-container--editor-preview[class*="hd-toc-container--"].hd-toc-container--align-right > ul.toc_list > li > ul.toc_list li a {
    text-align: right !important;
}

/* H4 lists style and guide lines */
[id^="toc_container"] ul.toc_list ul.toc_list ul.toc_list,
.hd-toc-container--editor-preview ul.toc_list ul.toc_list ul.toc_list {
    margin: 0 !important;
    padding-left: 20px !important;
    padding-right: 0 !important;
    border-left: 2px dashed #d0e0f0 !important;
    border-right: none !important;
}

[id^="toc_container"].hd-toc-container--align-right ul.toc_list ul.toc_list ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--align-right ul.toc_list ul.toc_list ul.toc_list {
    margin: 0 !important;
    padding-right: 20px !important;
    padding-left: 0 !important;
    border-right: 2px dashed #d0e0f0 !important;
    border-left: none !important;
}

@media only screen and (max-width: 667px) {
    [id^="toc_container"][class*="hd-toc-container--"] {
        padding: 20px !important;
    }
}

/* ==========================================================================
   1.3 Rose outline TOC style variant
   ========================================================================== */
[id^="toc_container"].hd-toc-container--rose_outline,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline {
display: block !important;
width: min(100%, var(--hd-toc-max-width, 760px)) !important;
padding: 32px 48px !important;
border: 3px solid #e67e9b !important;
border-top: 3px solid #e67e9b !important;
border-radius: 22px !important;
background: #fffafb !important;
box-shadow: 0 18px 44px rgba(191, 47, 91, 0.08) !important;
color: #b82f57 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_title,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_title {
display: flex !important;
align-items: center !important;
gap: 12px !important;
padding: 0 !important;
border: 0 !important;
margin: 0 !important;
width: 100% !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc-main-icon,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc-main-icon {
display: none !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc-title-text,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc-title-text {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 58px !important;
padding: 10px 32px !important;
border-radius: 10px !important;
background: #d93567 !important;
color: #fff !important;
font-size: 1.3rem !important;
font-weight: 800 !important;
line-height: 1.2 !important;
letter-spacing: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle {
margin-left: auto !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 54px !important;
height: 54px !important;
min-height: 54px !important;
padding: 0 !important;
border: 2px solid #a39ba0 !important;
border-radius: 9px !important;
background: #fff !important;
color: #918a8f !important;
box-shadow: none !important;
font-size: 0 !important;
line-height: 1 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle::before,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle::before,
[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle[aria-expanded="false"]::before,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle[aria-expanded="false"]::before {
content: "☰" !important;
font-size: 25px !important;
font-weight: 700 !important;
line-height: 1 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle:hover,
[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle:focus-visible,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle:hover,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle:focus-visible {
border-color: #d93567 !important;
color: #d93567 !important;
background: #fff5f8 !important;
transform: none !important;
outline: 2px solid rgba(217, 53, 103, 0.18) !important;
outline-offset: 2px !important;
}

[id^="toc_container"].hd-toc-container--rose_outline p.toc_title + ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline p.toc_title + ul.toc_list {
display: grid !important;
gap: 22px !important;
margin: 44px 0 0 !important;
padding: 0 !important;
border: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li {
display: flex !important;
align-items: flex-start !important;
justify-content: flex-start !important;
gap: 10px !important;
padding: 0 !important;
border: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.has-numbering > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.has-numbering > ul.toc_list > li::before {
counter-increment: toc-h2-counter !important;
content: counter(toc-h2-counter) "." !important;
display: inline-flex !important;
align-items: baseline !important;
justify-content: flex-start !important;
width: auto !important;
height: auto !important;
min-width: 2.1em !important;
margin: 0 !important;
border: 0 !important;
border-radius: 0 !important;
background: transparent !important;
color: #b82f57 !important;
font-size: 1.22rem !important;
font-weight: 800 !important;
line-height: 1.55 !important;
letter-spacing: 0 !important;
box-shadow: none !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > a,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > a {
display: inline-flex !important;
align-items: baseline !important;
min-height: 0 !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #b82f57 !important;
font-size: 1.22rem !important;
font-weight: 800 !important;
line-height: 1.55 !important;
letter-spacing: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > a:hover,
[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > a:focus-visible,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > a:hover,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > a:focus-visible {
color: #d93567 !important;
text-decoration: underline !important;
text-decoration-thickness: 2px !important;
text-underline-offset: 4px !important;
outline: none !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .hd-toc-child-toggle,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .hd-toc-child-toggle {
width: 28px !important;
height: 28px !important;
margin-left: auto !important;
border: 1px solid rgba(217, 53, 103, 0.34) !important;
border-radius: 8px !important;
background: #fff !important;
color: #b82f57 !important;
font-size: 15px !important;
font-weight: 800 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .hd-toc-child-toggle:hover,
[id^="toc_container"].hd-toc-container--rose_outline .hd-toc-child-toggle:focus-visible,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .hd-toc-child-toggle:hover,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .hd-toc-child-toggle:focus-visible {
background: #fff0f5 !important;
border-color: #d93567 !important;
outline: 2px solid rgba(217, 53, 103, 0.16) !important;
outline-offset: 2px !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list {
flex: 0 0 100% !important;
margin: 12px 0 0 0 !important;
padding: 0 0 0 44px !important;
border-left: 3px solid #f3bfd0 !important;
border-right: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline li.is-child-expanded > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline li.is-child-expanded > ul.toc_list {
display: grid !important;
gap: 6px !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li {
display: flex !important;
align-items: center !important;
justify-content: flex-start !important;
padding: 0 !important;
border: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a {
display: inline-flex !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
color: #939097 !important;
font-size: 1.02rem !important;
font-weight: 700 !important;
line-height: 1.75 !important;
letter-spacing: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a:hover,
[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a:focus-visible,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a:hover,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a:focus-visible {
color: #b82f57 !important;
text-decoration: underline !important;
text-underline-offset: 4px !important;
outline: none !important;
}

[id^="toc_container"].hd-toc-container--rose_outline ul.toc_list ul.toc_list ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline ul.toc_list ul.toc_list ul.toc_list {
margin: 6px 0 0 !important;
padding-left: 24px !important;
border-left: 3px solid #f3bfd0 !important;
border-right: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.hd-toc-container--align-center .toc_title,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.hd-toc-container--align-center .toc_title {
justify-content: center !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.hd-toc-container--align-center .toc_toggle,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.hd-toc-container--align-center .toc_toggle {
margin-left: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.hd-toc-container--align-right > ul.toc_list > li,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.hd-toc-container--align-right > ul.toc_list > li {
justify-content: flex-end !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.hd-toc-container--align-right.has-numbering > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.hd-toc-container--align-right.has-numbering > ul.toc_list > li::before {
order: 2 !important;
margin-left: 10px !important;
margin-right: 0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.hd-toc-container--align-right > ul.toc_list > li > ul.toc_list {
padding-left: 0 !important;
padding-right: 44px !important;
border-left: 0 !important;
border-right: 3px solid #f3bfd0 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline.hd-toc-container--align-right ul.toc_list ul.toc_list ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.hd-toc-container--align-right ul.toc_list ul.toc_list ul.toc_list {
padding-left: 0 !important;
padding-right: 24px !important;
border-left: 0 !important;
border-right: 3px solid #f3bfd0 !important;
}

@media (prefers-color-scheme: dark) {
[id^="toc_container"].hd-toc-container--rose_outline,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline {
background: #21141a !important;
border-color: #e78aa5 !important;
box-shadow: 0 18px 44px rgba(0, 0, 0, 0.28) !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc-title-text,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc-title-text {
background: #d93567 !important;
color: #fff !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle {
background: #2b2026 !important;
border-color: #c9a8b3 !important;
color: #ead8de !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > a,
[id^="toc_container"].hd-toc-container--rose_outline.has-numbering > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > a,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.has-numbering > ul.toc_list > li::before {
color: #f08eab !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list li a {
color: #d4c6cc !important;
}
}

@media only screen and (max-width: 667px) {
[id^="toc_container"].hd-toc-container--rose_outline,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline {
padding: 22px 20px !important;
border-radius: 18px !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_title,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_title {
align-items: flex-start !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc-title-text,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc-title-text {
min-height: 48px !important;
padding: 8px 22px !important;
font-size: 1.12rem !important;
}

[id^="toc_container"].hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline .toc_toggle .hd-toc-toggle {
width: 48px !important;
height: 48px !important;
min-height: 48px !important;
}

[id^="toc_container"].hd-toc-container--rose_outline p.toc_title + ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline p.toc_title + ul.toc_list {
margin-top: 30px !important;
gap: 18px !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > a,
[id^="toc_container"].hd-toc-container--rose_outline.has-numbering > ul.toc_list > li::before,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > a,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline.has-numbering > ul.toc_list > li::before {
font-size: 1.08rem !important;
line-height: 1.55 !important;
}

[id^="toc_container"].hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list,
.hd-toc-container--editor-preview.hd-toc-container--rose_outline > ul.toc_list > li > ul.toc_list {
padding-left: 28px !important;
}
}


/* === frontend-feedback.css === */
/* Feedback frontend styles */
.hd-feedback-wrapper { 
border: 1px solid #e0e0e0; 
padding: 20px; 
margin: 2em 0; 
border-radius: 8px; 
background: #f9f9f9; 
}

.hd-feedback-wrapper.is-processing {
opacity: 0.88;
}

.hd-feedback-state {
background: #fbfcfe;
}

.hd-feedback-state--muted {
background: #f7f7f8;
}
.widget .hd-feedback-wrapper { 
margin: 0; 
}
.hd-feedback-question { 
margin-bottom: 20px; 
padding-bottom: 20px; 
border-bottom: 1px dashed #ddd; 
transition: opacity .2s ease;
}
.hd-feedback-question.is-muted {
opacity: .5;
}
.hd-feedback-question:last-of-type { 
margin-bottom: 0; 
padding-bottom: 0; 
border-bottom: none; 
}
.hd-feedback-question .question-text { 
margin: 0 0 15px 0; 
font-weight: bold; 
font-size: 1.1em;
}

/* 按鈕容器 */
.hd-feedback-options {
display: flex;
flex-wrap: wrap;
gap: 10px;
}

/* 是/否 按鈕樣式 */
.hd-feedback-btn-yesno {
text-decoration: none !important; 
border: 1px solid #ccc; 
padding: 5px 15px; 
border-radius: 20px; 
transition: all 0.2s ease-in-out;
background-color: #fff;
color: #333;
font-weight: 500;
}

.hd-feedback-option-body {
display: inline-flex;
align-items: center;
gap: 10px;
min-width: 0;
}

.hd-feedback-option-text {
display: inline-flex;
align-items: center;
gap: 8px;
min-width: 0;
overflow-wrap: anywhere;
}

.hd-feedback-option-thumb {
display: block;
width: 56px;
height: 56px;
border-radius: 10px;
object-fit: cover;
flex: 0 0 56px;
background: #eef2f7;
}

.hd-feedback-btn-yesno--with-image,
.hd-feedback-option-label--with-image {
align-items: center;
}
.hd-feedback-btn-yesno:focus,
.hd-feedback-btn-yesno:active {
outline: none;
border-color: #2271b1;
box-shadow: 0 0 0 3px rgba(34,113,177,.15);
}
.hd-feedback-btn-yesno:hover { 
transform: translateY(-2px);
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}
.hd-feedback-btn-yesno[data-vote='yes']:hover { 
border-color: #4CAF50; 
background-color: #e8f5e9; 
color: #2e7d32;
}
.hd-feedback-btn-yesno[data-vote='no']:hover { 
border-color: #F44336; 
background-color: #ffebee; 
color: #c62828;
}

/* 單選/複選 樣式 */
.hd-feedback-option-label {
display: block;
width: 100%;
padding: 8px 12px;
border: 1px solid #ddd;
border-radius: 4px;
background: #fff;
cursor: pointer;
transition: border-color 0.2s, background-color 0.2s;
}

.hd-feedback-option-label--with-image .hd-feedback-option-body {
display: grid;
grid-template-columns: 56px minmax(0, 1fr);
align-items: center;
}

.hd-feedback-option-label--with-image input {
margin-top: 20px;
align-self: start;
}
.hd-feedback-option-label:hover {
background-color: #f5f5f5;
border-color: #bbb;
}
.hd-feedback-option-label.is-selected {
border-color: #2271b1;
background: #eef6ff;
box-shadow: inset 0 0 0 1px rgba(34,113,177,.12);
}
.hd-feedback-option-label input {
margin-right: 8px;
}

/* 提交按鈕 */
.hd-feedback-submit-btn {
margin-top: 15px;
padding: 8px 20px;
border: none;
background-color: #0073aa;
color: white;
border-radius: 4px;
cursor: pointer;
transition: background-color 0.2s;
}
.hd-feedback-submit-btn:hover {
background-color: #005a87;
}

.hd-feedback-submit-btn:disabled {
cursor: not-allowed;
opacity: 0.55;
box-shadow: none;
background-color: #8aa4b8;
}

.hd-feedback-antispam {
margin-top: 16px;
}

.hd-feedback-honeypot {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
pointer-events: none;
}

.hd-feedback-turnstile {
display: flex;
justify-content: flex-start;
margin-top: 12px;
}

.hd-feedback-turnstile:empty {
display: none;
}

.hd-feedback-status {
margin: 0 0 16px;
padding: 12px 14px;
border-radius: 8px;
border: 1px solid transparent;
font-size: 14px;
line-height: 1.6;
}

.hd-feedback-status.hd-is-hidden {
display: none;
}

.hd-feedback-status p {
margin: 0;
}

.hd-feedback-status.is-info {
background: #eef6ff;
border-color: #c6def6;
color: #0f4c81;
}

.hd-feedback-status.is-success {
background: #edf9f0;
border-color: #b8e0c1;
color: #1f6b33;
}

.hd-feedback-status.is-error {
background: #fff2f2;
border-color: #f0c6c6;
color: #a61b1b;
}

.hd-feedback-progress {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin-top: 14px;
padding: 10px 12px;
border: 1px solid #dbe4ee;
border-radius: 10px;
background: #f8fbff;
color: #334155;
font-size: 13px;
}

.hd-feedback-progress.hd-is-hidden {
display: none;
}

.hd-feedback-progress__label {
font-weight: 600;
color: #1f2937;
}

.hd-feedback-progress__value {
font-size: 15px;
line-height: 1;
color: #0f4c81;
}

.hd-feedback-progress.is-complete {
border-color: #b8e0c1;
background: #edf9f0;
}

.hd-feedback-pagination {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
margin: 18px 0 12px;
padding: 12px 14px;
border: 1px solid #dbe5ef;
border-radius: 14px;
background: #f8fbff;
}

.hd-feedback-pagination.hd-is-hidden {
display: none;
}

.hd-feedback-pagination__status {
flex: 1;
text-align: center;
font-size: 13px;
font-weight: 700;
color: #334155;
}

.hd-feedback-pagination__prev,
.hd-feedback-pagination__next {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 104px;
min-height: 40px;
padding: 0 16px;
border-radius: 999px;
border: 1px solid #cbd5e1;
background: #fff;
color: #0f172a;
font-weight: 600;
cursor: pointer;
transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}

.hd-feedback-pagination__prev:hover,
.hd-feedback-pagination__next:hover {
border-color: #93c5fd;
box-shadow: 0 8px 20px rgba(59, 130, 246, 0.12);
transform: translateY(-1px);
}

.hd-feedback-pagination__prev:disabled,
.hd-feedback-pagination__next:disabled {
opacity: .55;
cursor: not-allowed;
box-shadow: none;
transform: none;
}

.hd-feedback-option-btn.is-selected,
.hd-feedback-btn-yesno.is-selected {
border-color: #2563eb;
background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
color: #0f172a;
box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
}

.hd-feedback-option-btn.is-selected .hd-feedback-option-text,
.hd-feedback-btn-yesno.is-selected .hd-feedback-option-text {
color: #0f172a;
}

.hd-feedback-buttons-value {
display: none !important;
}

.hd-feedback-input-meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 10px;
margin-top: -2px;
margin-bottom: 10px;
font-size: 12px;
color: #667085;
}

.hd-feedback-input-count strong {
color: #111827;
}

.hd-feedback-input-hint {
text-align: right;
}

.hd-feedback-thanks {
margin-top: 10px;
padding: 10px 12px;
border-radius: 8px;
background: #edf9f0;
color: #1f6b33;
font-weight: 600;
}

.hd-feedback-thanks.hd-is-hidden {
display: none;
}

.hd-feedback-text-input,
.hd-feedback-textarea-input {
width: 100%;
margin-bottom: 10px;
padding: 8px;
border: 1px solid #ddd;
border-radius: 4px;
}

/* --- 固定內容樣式 --- */
.hd-feedback-fixed-content {
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid #e0e0e0;
font-size: 0.95em;
color: #555;
}
.hd-feedback-fixed-content p:last-child {
margin-bottom: 0;
}

.hd-feedback-wrapper.is-poll-template-issue-card {
padding: 0;
border: 1px solid #d7dee7;
border-radius: 18px;
background: #fff;
overflow: hidden;
box-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
}

.hd-feedback-wrapper.is-poll-template-issue-card::before {
display: none;
}

.hd-issue-poll-card {
padding: 24px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-spotlight:not(.is-poll-template-issue-card) {
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
border-color: #cfd8e3;
box-shadow: 0 16px 34px rgba(15, 23, 42, 0.09);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-spotlight:not(.is-poll-template-issue-card) .hd-feedback-poll-shell {
padding: 0 0 8px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-spotlight:not(.is-poll-template-issue-card) .hd-feedback-poll-shell__title {
font-size: clamp(1.55rem, 2.8vw, 2.25rem);
line-height: 1.2;
font-weight: 800;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-spotlight {
border-color: #cad5e5;
box-shadow: 0 20px 44px rgba(15, 23, 42, 0.11);
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-spotlight .hd-issue-poll-card {
padding: 28px;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-spotlight .hd-issue-poll-card__cover {
margin-bottom: 26px;
border-radius: 22px;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-spotlight .hd-feedback-question--issue-card .question-text {
font-size: clamp(1.9rem, 3.4vw, 3rem);
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-spotlight .hd-issue-poll-card__question-description {
max-width: 56rem;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-compact:not(.is-poll-template-issue-card) {
padding: 16px;
border-radius: 14px;
background: #ffffff;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-compact:not(.is-poll-template-issue-card) .hd-feedback-poll-shell__title {
font-size: 1.2rem;
line-height: 1.3;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact {
border-radius: 16px;
box-shadow: 0 10px 26px rgba(15, 23, 42, 0.07);
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact .hd-issue-poll-card {
padding: 18px;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact .hd-issue-poll-card__cover {
margin-bottom: 16px;
border-radius: 14px;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact .hd-feedback-question--issue-card .question-text {
margin-bottom: 14px;
font-size: clamp(1.3rem, 2.2vw, 2rem);
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact .hd-issue-poll-card__summaryline,
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact .hd-poll-results-summary--issue-card,
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-compact .hd-issue-poll-analytics {
margin-bottom: 14px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-compact .hd-feedback-schedule-strip {
padding: 12px 14px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-compact .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-compact .hd-feedback-option-btn {
padding: 10px 14px;
border-radius: 12px;
}

.hd-issue-poll-card__cover {
margin: 0 0 22px;
border-radius: 18px;
overflow: hidden;
background: linear-gradient(135deg, #e5e7eb 0%, #f8fafc 100%);
box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08);
}

.hd-issue-poll-card__cover img {
display: block;
width: 100%;
aspect-ratio: 16 / 9;
object-fit: cover;
}

.hd-issue-poll-card__status-row {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 12px;
margin-bottom: 18px;
}

.hd-issue-poll-card__badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 34px;
padding: 0 14px;
border-radius: 999px;
border: 1px solid #ef4444;
background: #fff5f5;
color: #dc2626;
font-size: 13px;
font-weight: 700;
white-space: nowrap;
}

.hd-issue-poll-card__period {
font-size: 15px;
font-weight: 600;
color: #334155;
}

.hd-feedback-fixed-content--issue-card {
margin-bottom: 24px;
padding-bottom: 24px;
border-bottom: 1px solid #e5e7eb;
font-size: 1rem;
line-height: 1.85;
color: #334155;
}

.hd-feedback-fixed-content--issue-card img,
.hd-feedback-fixed-content--issue-card iframe,
.hd-feedback-fixed-content--issue-card video {
display: block;
max-width: 100%;
height: auto;
margin: 0 0 18px;
border-radius: 14px;
}

.hd-feedback-question--issue-card {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}

.hd-feedback-question--issue-card .question-text {
margin: 0 0 18px;
font-size: clamp(1.7rem, 3vw, 2.75rem);
line-height: 1.24;
font-weight: 800;
letter-spacing: 0;
color: #111827;
}

.hd-issue-poll-card__question-description {
margin: -6px 0 18px;
font-size: 1rem;
line-height: 1.9;
color: #475569;
}

.hd-issue-poll-card__summaryline {
display: flex;
flex-wrap: wrap;
align-items: baseline;
justify-content: space-between;
gap: 10px 18px;
margin: 0 0 18px;
}

.hd-issue-poll-card__total {
font-size: clamp(1.5rem, 2.8vw, 2.6rem);
line-height: 1.15;
font-weight: 800;
color: #1f2937;
}

.hd-issue-poll-card__leading {
font-size: 14px;
font-weight: 600;
color: #4f46e5;
}

.hd-poll-results-summary--issue-card {
margin-bottom: 20px;
}

.hd-issue-poll-analytics {
margin: 0 0 22px;
padding: 18px;
border: 1px solid #dbe5ef;
border-radius: 16px;
background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.hd-issue-poll-analytics__overview {
display: grid;
grid-template-columns: minmax(180px, 220px) minmax(0, 1fr);
gap: 18px;
align-items: center;
}

.hd-issue-poll-analytics__chart-card {
display: flex;
align-items: center;
justify-content: center;
padding: 6px;
}

.hd-issue-poll-analytics__donut {
position: relative;
display: flex;
align-items: center;
justify-content: center;
width: 170px;
height: 170px;
border-radius: 50%;
background: var(--hd-issue-poll-gradient, conic-gradient(#2563eb 0 100%));
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.55);
}

.hd-issue-poll-analytics__donut::after {
content: "";
position: absolute;
inset: 20px;
border-radius: 50%;
background: #ffffff;
box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.06);
}

.hd-issue-poll-analytics__donut-center {
position: relative;
z-index: 1;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
text-align: center;
}

.hd-issue-poll-analytics__donut-label {
font-size: 12px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #64748b;
}

.hd-issue-poll-analytics__donut-center strong {
font-size: 1.8rem;
line-height: 1;
color: #0f172a;
}

.hd-issue-poll-analytics__metrics {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}

.hd-issue-poll-analytics__metric {
display: flex;
flex-direction: column;
gap: 5px;
min-width: 0;
padding: 12px 14px;
border-radius: 12px;
background: #ffffff;
border: 1px solid #dbe5ef;
}

.hd-issue-poll-analytics__metric-label {
font-size: 11px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #64748b;
}

.hd-issue-poll-analytics__metric strong {
font-size: 15px;
line-height: 1.45;
color: #0f172a;
word-break: break-word;
}

.hd-issue-poll-analytics__legend {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
gap: 10px;
margin-top: 16px;
}

.hd-issue-poll-analytics__legend-item {
display: flex;
align-items: flex-start;
gap: 10px;
padding: 10px 12px;
border-radius: 12px;
background: #ffffff;
border: 1px solid #e2e8f0;
}

.hd-issue-poll-analytics__legend-swatch {
flex: 0 0 12px;
width: 12px;
height: 12px;
margin-top: 5px;
border-radius: 999px;
}

.hd-issue-poll-analytics__legend-text {
display: flex;
flex-direction: column;
gap: 2px;
min-width: 0;
}

.hd-issue-poll-analytics__legend-title {
font-size: 14px;
font-weight: 700;
line-height: 1.4;
color: #1e293b;
word-break: break-word;
}

.hd-issue-poll-analytics__legend-meta {
font-size: 12px;
line-height: 1.5;
color: #64748b;
}

.hd-issue-poll-analytics__footnote {
margin: 14px 0 0;
font-size: 12px;
line-height: 1.6;
color: #64748b;
}

@media (max-width: 768px) {
.hd-issue-poll-analytics__overview {
grid-template-columns: 1fr;
}

.hd-issue-poll-analytics__chart-card {
padding: 0;
}

.hd-issue-poll-analytics__donut {
width: 150px;
height: 150px;
}

.hd-issue-poll-analytics__metrics {
grid-template-columns: 1fr 1fr;
}
}

@media (max-width: 560px) {
.hd-issue-poll-analytics {
padding: 16px;
}

.hd-issue-poll-analytics__metrics,
.hd-issue-poll-analytics__legend {
grid-template-columns: 1fr;
}

.hd-issue-poll-analytics__donut {
width: 138px;
height: 138px;
}
}

.is-poll-template-issue-card .hd-feedback-options {
gap: 14px;
}

.is-poll-template-issue-card .hd-feedback-btn-yesno,
.is-poll-template-issue-card .hd-feedback-option-label {
border-radius: 14px;
}

.is-poll-template-issue-card .hd-feedback-btn-yesno {
padding: 12px 18px;
font-weight: 700;
}

.is-poll-template-issue-card .hd-feedback-submit-btn {
width: 100%;
margin-top: 18px;
padding: 14px 22px;
border-radius: 14px;
font-size: 16px;
font-weight: 700;
}

/* --- 投票結果樣式 --- */
.hd-poll-results-summary {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
gap: 10px;
margin: 0 0 16px;
}

.hd-poll-results-summary__item {
display: flex;
flex-direction: column;
gap: 4px;
padding: 10px 12px;
border: 1px solid #dbe5ef;
border-radius: 10px;
background: #f8fbff;
}

.hd-poll-results-summary__label {
font-size: 11px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: #64748b;
}

.hd-poll-results-summary__item strong {
font-size: 15px;
line-height: 1.35;
color: #0f172a;
}

.hd-poll-results-list {
margin-top: 15px;
}
.poll-result-item {
margin-bottom: 12px;
padding: 10px 12px;
border: 1px solid #e2e8f0;
border-radius: 12px;
background: #fff;
}

.poll-result-item.is-leading {
border-color: #93c5fd;
background: #f8fbff;
}
.poll-option-label {
display: flex;
justify-content: space-between;
align-items: center;
gap: 12px;
margin-bottom: 5px;
font-weight: 500;
}

.poll-option-name {
display: inline-flex;
align-items: center;
gap: 8px;
min-width: 0;
}

.poll-option-name--with-image {
align-items: center;
}

.poll-leading-badge {
display: inline-flex;
align-items: center;
height: 22px;
padding: 0 8px;
border-radius: 999px;
background: #dbeafe;
color: #1d4ed8;
font-size: 11px;
font-weight: 700;
white-space: nowrap;
}

.poll-percentage {
white-space: nowrap;
color: #334155;
}
.poll-bar-container {
width: 100%;
background-color: #eee;
border-radius: 4px;
height: 12px;
overflow: hidden;
}
.poll-bar {
height: 100%;
background-color: #0073aa;
border-radius: 4px;
transition: width 0.5s ease-in-out;
}
.poll-bar--p0 { width: 0%; }
.poll-bar--p1 { width: 1%; }
.poll-bar--p2 { width: 2%; }
.poll-bar--p3 { width: 3%; }
.poll-bar--p4 { width: 4%; }
.poll-bar--p5 { width: 5%; }
.poll-bar--p6 { width: 6%; }
.poll-bar--p7 { width: 7%; }
.poll-bar--p8 { width: 8%; }
.poll-bar--p9 { width: 9%; }
.poll-bar--p10 { width: 10%; }
.poll-bar--p11 { width: 11%; }
.poll-bar--p12 { width: 12%; }
.poll-bar--p13 { width: 13%; }
.poll-bar--p14 { width: 14%; }
.poll-bar--p15 { width: 15%; }
.poll-bar--p16 { width: 16%; }
.poll-bar--p17 { width: 17%; }
.poll-bar--p18 { width: 18%; }
.poll-bar--p19 { width: 19%; }
.poll-bar--p20 { width: 20%; }
.poll-bar--p21 { width: 21%; }
.poll-bar--p22 { width: 22%; }
.poll-bar--p23 { width: 23%; }
.poll-bar--p24 { width: 24%; }
.poll-bar--p25 { width: 25%; }
.poll-bar--p26 { width: 26%; }
.poll-bar--p27 { width: 27%; }
.poll-bar--p28 { width: 28%; }
.poll-bar--p29 { width: 29%; }
.poll-bar--p30 { width: 30%; }
.poll-bar--p31 { width: 31%; }
.poll-bar--p32 { width: 32%; }
.poll-bar--p33 { width: 33%; }
.poll-bar--p34 { width: 34%; }
.poll-bar--p35 { width: 35%; }
.poll-bar--p36 { width: 36%; }
.poll-bar--p37 { width: 37%; }
.poll-bar--p38 { width: 38%; }
.poll-bar--p39 { width: 39%; }
.poll-bar--p40 { width: 40%; }
.poll-bar--p41 { width: 41%; }
.poll-bar--p42 { width: 42%; }
.poll-bar--p43 { width: 43%; }
.poll-bar--p44 { width: 44%; }
.poll-bar--p45 { width: 45%; }
.poll-bar--p46 { width: 46%; }
.poll-bar--p47 { width: 47%; }
.poll-bar--p48 { width: 48%; }
.poll-bar--p49 { width: 49%; }
.poll-bar--p50 { width: 50%; }
.poll-bar--p51 { width: 51%; }
.poll-bar--p52 { width: 52%; }
.poll-bar--p53 { width: 53%; }
.poll-bar--p54 { width: 54%; }
.poll-bar--p55 { width: 55%; }
.poll-bar--p56 { width: 56%; }
.poll-bar--p57 { width: 57%; }
.poll-bar--p58 { width: 58%; }
.poll-bar--p59 { width: 59%; }
.poll-bar--p60 { width: 60%; }
.poll-bar--p61 { width: 61%; }
.poll-bar--p62 { width: 62%; }
.poll-bar--p63 { width: 63%; }
.poll-bar--p64 { width: 64%; }
.poll-bar--p65 { width: 65%; }
.poll-bar--p66 { width: 66%; }
.poll-bar--p67 { width: 67%; }
.poll-bar--p68 { width: 68%; }
.poll-bar--p69 { width: 69%; }
.poll-bar--p70 { width: 70%; }
.poll-bar--p71 { width: 71%; }
.poll-bar--p72 { width: 72%; }
.poll-bar--p73 { width: 73%; }
.poll-bar--p74 { width: 74%; }
.poll-bar--p75 { width: 75%; }
.poll-bar--p76 { width: 76%; }
.poll-bar--p77 { width: 77%; }
.poll-bar--p78 { width: 78%; }
.poll-bar--p79 { width: 79%; }
.poll-bar--p80 { width: 80%; }
.poll-bar--p81 { width: 81%; }
.poll-bar--p82 { width: 82%; }
.poll-bar--p83 { width: 83%; }
.poll-bar--p84 { width: 84%; }
.poll-bar--p85 { width: 85%; }
.poll-bar--p86 { width: 86%; }
.poll-bar--p87 { width: 87%; }
.poll-bar--p88 { width: 88%; }
.poll-bar--p89 { width: 89%; }
.poll-bar--p90 { width: 90%; }
.poll-bar--p91 { width: 91%; }
.poll-bar--p92 { width: 92%; }
.poll-bar--p93 { width: 93%; }
.poll-bar--p94 { width: 94%; }
.poll-bar--p95 { width: 95%; }
.poll-bar--p96 { width: 96%; }
.poll-bar--p97 { width: 97%; }
.poll-bar--p98 { width: 98%; }
.poll-bar--p99 { width: 99%; }
.poll-bar--p100 { width: 100%; }
.poll-total-votes, .poll-status-ended {
margin-top: 15px;
font-size: 0.9em;
color: #666;
text-align: right;
}
.poll-status-ended {
font-weight: bold;
color: #c00;
}

.hd-feedback-notice {
margin-top: 14px;
padding-top: 12px;
border-top: 1px dashed #d7dbe0;
}

.hd-feedback-notice p {
margin: 0;
}

.hd-feedback-notice--inline {
margin-top: 10px;
text-align: right;
}

.hd-feedback-notice__text {
color: #777;
font-size: 0.85em;
}

.hd-feedback-limit-warning {
color: #d9534f;
}

/*
==============================================
[純HTML範本庫] 整合樣式庫 v2.1 (新聞稿樣式分離)
==============================================
*/

/* --- 模式一：預設的藍色資訊框樣式 (適用於一般內容) --- */
.hd-pure-html-wrapper { margin: 2em 0; padding: 20px 25px; border-radius: 8px; background-color: #f0f6fc; border: 1px solid #d1e4f6; border-left: 5px solid #72aee6; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
.widget .hd-pure-html-wrapper { margin: 0; }
.hd-pure-html-wrapper h1, .hd-pure-html-wrapper h2, .hd-pure-html-wrapper h3, .hd-pure-html-wrapper h4 { color: #1d5b94; margin-top: 0; padding-bottom: 0; border-bottom: none; }
.hd-pure-html-wrapper p { color: #333; line-height: 1.7; }
.hd-pure-html-wrapper > *:last-child { margin-bottom: 0; }
.hd-pure-html-wrapper a { color: #005a87; font-weight: bold; text-decoration: underline; transition: color 0.2s; }
.hd-pure-html-wrapper a:hover { color: #c00; }
.hd-pure-html-wrapper ul, .hd-pure-html-wrapper ol { padding-left: 25px; }

/* --- 核心整合邏輯 --- */
.hd-pure-html-wrapper:has(> .announcement-card),
.hd-pure-html-wrapper:has(> .sponsor-card),
.hd-pure-html-wrapper:has(> .news-release-card) { padding: 0; background: transparent; border: none; box-shadow: none; }

/* --- 模式二：卡片範本樣式 --- */

/* --- 2a. 新聞稿卡片 (News Release Card) - 藍色底座樣式 --- */
.news-release-card { margin: 0; padding: 20px 25px; border-radius: 8px; background-color: #f0f6fc; border: 1px solid #d1e4f6; border-left: 5px solid #72aee6; box-shadow: 0 1px 3px rgba(0,0,0,0.04); }
.news-release-card .news-title { color: #1d5b94; font-size: 1.25em; font-weight: bold; margin-top: 0; margin-bottom: 12px; }
.news-release-card .news-description { color: #333; line-height: 1.7; margin-bottom: 20px; }
.news-release-card .news-link { display: inline-block; padding: 8px 18px; background-color: #005a87; color: #fff !important; font-weight: bold; text-decoration: none; border-radius: 6px; transition: opacity 0.2s; }
.news-release-card .news-link:hover { opacity: 0.85; }

/* --- 2b. 通知卡片 (Announcement Card) - 白色底座樣式 --- */
.announcement-card { padding: 20px 25px; border-radius: 8px; background-color: #fff; border: 1px solid #e5e7eb; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -1px rgba(0, 0, 0, 0.03); margin: 0; position: relative; overflow: hidden; }
.announcement-card::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; }
.announcement-card .announcement-title { font-size: 1.25em; font-weight: bold; color: #111827; margin-top: 0; margin-bottom: 12px; display: flex; align-items: center; }
.announcement-card .announcement-title i { margin-right: 10px; font-size: 1.1em; width: 20px; text-align: center; }
.announcement-card .announcement-description, .announcement-card .announcement-description p { font-size: 1em; color: #4b5563; line-height: 1.7; margin-top: 0; margin-bottom: 20px; }
.announcement-card .announcement-link { display: inline-block; padding: 10px 20px; color: #fff !important; font-weight: bold; text-decoration: none; border-radius: 6px; transition: opacity 0.2s ease-in-out; border: none; }
.announcement-card .announcement-link:hover { opacity: 0.85; }
.announcement-card.info::before, .announcement-card.info .announcement-link { background-color: #3b82f6; }
.announcement-card.info .announcement-title i { color: #3b82f6; }
.announcement-card.success::before, .announcement-card.success .announcement-link { background-color: #22c55e; }
.announcement-card.success .announcement-title i { color: #22c55e; }
.announcement-card.warning::before, .announcement-card.warning .announcement-link { background-color: #f59e0b; }
.announcement-card.warning .announcement-title i { color: #f59e0b; }
.announcement-card.danger::before, .announcement-card.danger .announcement-link { background-color: #ef4444; }
.announcement-card.danger .announcement-title i { color: #ef4444; }

/* --- 2c. 贊助卡片 (Sponsor Card) --- */
.sponsor-card { background: #ffffff; border-radius: 12px; padding: 25px 30px; border: 1px solid #e5e7eb; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); text-align: center; margin: 0; }
.sponsor-card .sponsor-card-title { font-size: 1.5em; font-weight: bold; color: #111827; margin-top: 0; margin-bottom: 8px; }
.sponsor-card .sponsor-card-description { font-size: 1em; color: #4b5563; margin-bottom: 25px; max-width: 600px; margin-left: auto; margin-right: auto; }
.sponsor-card .sponsor-links-container { display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; }
.sponsor-card .sponsor-link { display: inline-flex; align-items: center; justify-content: center; padding: 10px 20px; border-radius: 8px; text-decoration: none !important; font-weight: bold; color: #fff !important; transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; border: none; cursor: pointer; min-width: 140px; }
.sponsor-card .sponsor-link:hover { transform: translateY(-3px); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); }
.sponsor-card .sponsor-link i { margin-right: 8px; font-size: 1.2em; }
.sponsor-card .sponsor-link.jko { background-color: #DE4B2B; }
.sponsor-card .sponsor-link.linepay { background-color: #00B900; }
.sponsor-card .sponsor-link.bank { background-color: #2F60A3; }
.sponsor-card .sponsor-link.paypal { background-color: #0070BA; }

@media (max-width: 640px) {
.hd-feedback-progress,
.hd-feedback-input-meta {
flex-direction: column;
align-items: flex-start;
}

.hd-feedback-input-hint {
text-align: left;
}

.hd-issue-poll-card {
padding: 18px;
}

.hd-feedback-question--issue-card .question-text {
font-size: 1.85rem;
}

.hd-issue-poll-card__summaryline {
align-items: flex-start;
}

.hd-issue-poll-card__total {
font-size: 2rem;
}
}

/* Batch 1191: feedback UI convergence */
.hd-feedback-wrapper {
position: relative;
border: 1px dashed #cbd5e1;
border-radius: 18px;
padding: 20px;
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
box-shadow: 0 18px 40px rgba(15, 23, 42, 0.06);
overflow: hidden;
transition: opacity .22s ease, transform .22s ease, max-height .22s ease, margin .22s ease, padding .22s ease, border-width .22s ease;
}

.hd-feedback-wrapper::before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: 0;
width: 4px;
background: linear-gradient(180deg, #2563eb 0%, #60a5fa 100%);
opacity: .95;
}

.hd-feedback-wrapper.is-collapsing {
opacity: 0;
transform: translateY(-4px);
max-height: 0;
margin-top: 0;
margin-bottom: 0;
padding-top: 0;
padding-bottom: 0;
border-width: 0;
}

.hd-feedback-wrapper.is-auto-hidden {
display: none !important;
}

.hd-feedback-fixed-content {
position: relative;
margin-bottom: 16px;
padding-bottom: 14px;
border-bottom: 1px dashed #d7e1ee;
color: #475569;
}

.hd-feedback-question {
position: relative;
margin: 0;
padding: 0;
border-bottom: none;
}

.hd-feedback-question + .hd-feedback-question {
margin-top: 16px;
padding-top: 16px;
border-top: 1px dashed #d7e1ee;
}

.hd-feedback-question .question-text {
margin: 0 0 14px;
font-size: 1.02rem;
line-height: 1.7;
letter-spacing: .01em;
color: #0f172a;
word-break: break-word;
}

.hd-feedback-question-description {
margin: -4px 0 14px;
font-size: 0.94rem;
line-height: 1.7;
color: #64748b;
}

.hd-feedback-options {
gap: 12px;
}

.hd-feedback-options--buttons {
display: flex;
flex-wrap: wrap;
gap: 12px;
}

.hd-feedback-btn-yesno,
.hd-feedback-option-btn,
.hd-feedback-submit-btn,
.hd-feedback-option-label {
border-radius: 999px;
}

.hd-feedback-btn-yesno {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 44px;
padding: 10px 16px;
border-color: #d6dce5;
background: #fff;
font-weight: 700;
line-height: 1.35;
}

.hd-feedback-option-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 44px;
padding: 10px 16px;
border: 1px solid #d6dce5;
background: #fff;
color: #1e293b;
font-weight: 700;
line-height: 1.35;
border-radius: 999px;
box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
cursor: pointer;
transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.hd-feedback-btn-yesno:hover {
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.hd-feedback-option-btn:hover {
transform: translateY(-2px);
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
border-color: #bfd0e4;
background: #f8fbff;
color: #0f4c81;
}

.hd-feedback-option-btn:focus,
.hd-feedback-option-btn:active {
outline: none;
border-color: #2271b1;
box-shadow: 0 0 0 3px rgba(34, 113, 177, 0.15);
}

.hd-feedback-option-btn:disabled {
cursor: not-allowed;
opacity: 0.55;
transform: none;
box-shadow: none;
}

.hd-feedback-option-label {
display: inline-flex;
align-items: center;
gap: 8px;
min-height: 44px;
width: auto;
max-width: 100%;
padding: 10px 16px;
border-color: #d6dce5;
font-weight: 600;
color: #1e293b;
}

.hd-feedback-option-label input {
margin-right: 0;
}

.hd-feedback-submit-btn {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 46px;
padding: 10px 18px;
margin-top: 18px;
font-weight: 800;
box-shadow: 0 10px 24px rgba(0, 115, 170, 0.16);
}

.hd-feedback-status,
.hd-feedback-thanks,
.hd-feedback-progress {
border-radius: 14px;
}

.hd-feedback-status.is-persistent {
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
}

.hd-feedback-progress {
margin-top: 16px;
}

.hd-feedback-notice {
margin-top: 16px;
padding-top: 14px;
border-top: 1px dashed #d7e1ee;
}

@media (max-width: 640px) {
.hd-feedback-wrapper {
padding: 18px 16px;
border-radius: 16px;
}

.hd-feedback-btn-yesno,
.hd-feedback-option-btn,
.hd-feedback-option-label,
.hd-feedback-submit-btn {
width: 100%;
justify-content: center;
}
}

.hd-feedback-issue-page {
padding: clamp(28px, 4vw, 56px) 0;
}

.hd-feedback-issue-page__inner {
width: min(100%, 1280px);
margin: 0 auto;
padding: 0 clamp(16px, 3vw, 28px);
}

.hd-feedback-issue-page__article {
display: grid;
gap: 22px;
}

.hd-feedback-issue-page__header {
display: grid;
gap: 18px;
}

.hd-feedback-issue-page__utility {
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 10px 12px;
}

.hd-feedback-issue-page__hero {
display: grid;
gap: 20px;
padding: 24px;
border-radius: 26px;
border: 1px solid rgba(226, 232, 240, 0.9);
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
box-shadow: 0 20px 40px rgba(15, 23, 42, 0.08);
}

.hd-feedback-issue-page__hero--list {
padding: 34px 36px;
background:
radial-gradient(circle at top left, rgba(255,255,255,0.16), transparent 34%),
linear-gradient(135deg, #14324d 0%, #24557d 56%, #3b82b5 100%);
border-color: rgba(191, 219, 254, 0.16);
box-shadow: 0 28px 54px rgba(15, 23, 42, 0.14);
}

.hd-feedback-issue-page__hero.has-cover {
grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
align-items: stretch;
}

.hd-feedback-issue-page__hero-media {
position: relative;
overflow: hidden;
border-radius: 22px;
min-height: 100%;
background: #dbeafe;
}

.hd-feedback-issue-page__hero-media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.hd-feedback-issue-page__hero-body {
display: grid;
align-content: center;
gap: 16px;
min-width: 0;
}

.hd-feedback-issue-page__hero-stats {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 12px;
}

.hd-feedback-issue-page__hero-stat {
display: grid;
gap: 4px;
padding: 14px 16px;
border-radius: 16px;
background: rgba(255, 255, 255, 0.14);
border: 1px solid rgba(255, 255, 255, 0.18);
backdrop-filter: blur(6px);
}

.hd-feedback-issue-page__hero-stat-label {
font-size: 11px;
font-weight: 700;
letter-spacing: .04em;
text-transform: uppercase;
color: rgba(226, 232, 240, 0.84);
}

.hd-feedback-issue-page__hero-stat strong {
font-size: 24px;
line-height: 1.1;
color: #fff;
}

.hd-feedback-issue-page__hero-actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
}

.hd-feedback-issue-page__hero-action {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 0 18px;
border-radius: 999px;
border: 1px solid rgba(255, 255, 255, 0.24);
background: rgba(255, 255, 255, 0.12);
color: #fff;
font-size: 14px;
font-weight: 700;
text-decoration: none !important;
transition: background-color .2s ease, border-color .2s ease, transform .2s ease;
}

.hd-feedback-issue-page__hero-action:hover,
.hd-feedback-issue-page__hero-action:focus {
background: rgba(255, 255, 255, 0.22);
border-color: rgba(255, 255, 255, 0.36);
color: #fff;
transform: translateY(-1px);
}

.hd-feedback-issue-page__hero-action--primary {
background: #ffffff;
border-color: #ffffff;
color: #14324d;
}

.hd-feedback-issue-page__hero-action--primary:hover,
.hd-feedback-issue-page__hero-action--primary:focus {
background: #eff6ff;
border-color: #eff6ff;
color: #14324d;
}

.hd-feedback-issue-page__utility--hero {
justify-content: space-between;
}

.hd-feedback-issue-page__kicker {
display: inline-flex;
align-items: center;
min-height: 32px;
padding: 0 12px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.12);
border: 1px solid rgba(255, 255, 255, 0.2);
color: #eff6ff;
font-size: 12px;
font-weight: 700;
letter-spacing: .08em;
text-transform: uppercase;
}

.hd-feedback-issue-page__eyebrow {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px 12px;
}

.hd-feedback-issue-page__badge {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 34px;
padding: 0 14px;
border-radius: 999px;
background: linear-gradient(135deg, #1d4ed8 0%, #3b82f6 100%);
color: #fff;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.02em;
}

.hd-feedback-issue-page__period {
font-size: 14px;
font-weight: 600;
color: #334155;
}

.hd-feedback-issue-page__title {
margin: 0;
font-size: clamp(2rem, 4vw, 3.2rem);
line-height: 1.18;
letter-spacing: 0;
}

.hd-feedback-issue-page__content .hd-feedback-wrapper {
margin: 0;
}

.hd-feedback-issue-page__intro {
margin: 0;
font-size: 1rem;
line-height: 1.8;
color: #4b5563;
}

.hd-feedback-issue-page__intro p {
margin: 0;
}

.hd-feedback-issue-page__metrics {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 12px;
}

.hd-feedback-issue-page__metric {
display: grid;
gap: 6px;
padding: 14px 16px;
border-radius: 18px;
background: rgba(239, 246, 255, 0.88);
border: 1px solid rgba(191, 219, 254, 0.78);
}

.hd-feedback-issue-page__metric-label {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.02em;
text-transform: uppercase;
color: #64748b;
}

.hd-feedback-issue-page__metric strong {
font-size: 1.02rem;
line-height: 1.4;
color: #0f172a;
}

.hd-feedback-issue-page__lead {
padding: 24px;
border-radius: 24px;
background: #fff;
border: 1px solid rgba(226, 232, 240, 0.9);
box-shadow: 0 16px 32px rgba(15, 23, 42, 0.06);
}

.hd-feedback-issue-page__back-link,
.hd-feedback-issue-page__related-link {
display: inline-flex;
align-items: center;
gap: 8px;
min-height: 38px;
padding: 0 16px;
border-radius: 999px;
background: #eff6ff;
border: 1px solid rgba(37, 99, 235, 0.16);
color: #1d4ed8;
font-size: 13px;
font-weight: 700;
text-decoration: none !important;
transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.hd-feedback-issue-page__back-link:hover,
.hd-feedback-issue-page__related-link:hover {
background: #dbeafe;
border-color: rgba(37, 99, 235, 0.24);
color: #1e40af;
}

.hd-feedback-issue-page__hero--list .hd-feedback-issue-page__title,
.hd-feedback-issue-page__hero--list .hd-feedback-issue-page__intro,
.hd-feedback-issue-page__hero--list .hd-feedback-issue-page__period {
color: #fff;
}

.hd-feedback-issue-page__hero--list .hd-feedback-issue-page__related-link {
background: rgba(255,255,255,0.14);
border-color: rgba(255,255,255,0.22);
color: #fff;
}

.hd-feedback-issue-page__hero--list .hd-feedback-issue-page__related-link:hover {
background: rgba(255,255,255,0.22);
border-color: rgba(255,255,255,0.34);
color: #fff;
}

.hd-feedback-issue-page__related {
display: grid;
gap: 16px;
padding-top: 8px;
}

.hd-feedback-issue-page__related-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}

.hd-feedback-issue-page__related-title {
margin: 0;
font-size: clamp(1.25rem, 2vw, 1.6rem);
line-height: 1.25;
color: #0f172a;
}

.hd-feedback-issue-page--list a,
.hd-feedback-issue-page--list a:hover,
.hd-feedback-issue-page--list a:focus,
.hd-feedback-issue-page--list a:active {
text-decoration: none !important;
}

.hd-feedback-issue-list {
display: grid;
gap: 24px;
}

.hd-feedback-issue-list__header {
display: grid;
gap: 8px;
}

.hd-feedback-issue-list__heading {
margin: 0;
font-size: clamp(1.6rem, 3vw, 2.3rem);
line-height: 1.2;
color: #0f172a;
}

.hd-feedback-issue-list__toolbar {
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
gap: 12px 16px;
}

.hd-feedback-issue-list__filters,
.hd-feedback-issue-list__sorts {
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.hd-feedback-issue-list__views {
display: inline-flex;
gap: 4px;
padding: 4px;
border-radius: 14px;
border: 1px solid rgba(226, 232, 240, 0.9);
background: #f8fafc;
}

.hd-feedback-issue-list__filter,
.hd-feedback-issue-list__sort {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 34px;
padding: 0 14px;
border: 1px solid #d7dee7;
border-radius: 999px;
background: #ffffff;
color: #334155;
font-size: 13px;
font-weight: 700;
text-decoration: none !important;
transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

.hd-feedback-issue-list__filter.is-active,
.hd-feedback-issue-list__sort.is-active,
.hd-feedback-issue-list__filter:hover,
.hd-feedback-issue-list__sort:hover {
border-color: #2563eb;
background: #eff6ff;
color: #1d4ed8;
}

.hd-feedback-issue-list__view {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 36px;
padding: 0 14px;
border-radius: 10px;
color: #64748b;
font-size: 13px;
font-weight: 700;
text-decoration: none !important;
transition: background-color .2s ease, color .2s ease, box-shadow .2s ease;
}

.hd-feedback-issue-list__view.is-active,
.hd-feedback-issue-list__view:hover {
background: #fff;
color: #1a3a5c;
box-shadow: 0 8px 18px rgba(15,23,42,0.08);
}

.hd-feedback-issue-list__section-title {
margin: 0 0 14px;
font-size: 1.05rem;
font-weight: 800;
color: #0f172a;
}

.hd-feedback-issue-list__featured,
.hd-feedback-issue-list__grid {
display: grid;
gap: 18px;
}

.hd-feedback-issue-list__featured-grid,
.hd-feedback-issue-list__grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px;
}

.hd-feedback-issue-list__grid.is-compact {
grid-template-columns: 1fr;
}

.hd-feedback-issue-list__grid.is-list,
.hd-feedback-issue-list__featured-grid.is-list {
grid-template-columns: 1fr;
}

.hd-feedback-issue-list__card {
height: 100%;
border: 1px solid #dbe5ef;
border-radius: 16px;
background: #ffffff;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06);
overflow: hidden;
}

.hd-feedback-issue-list__link {
display: flex;
flex-direction: column;
height: 100%;
color: inherit;
text-decoration: none !important;
}

.hd-feedback-issue-list__media {
aspect-ratio: 16 / 9;
background: #e5edf5;
overflow: hidden;
}

.hd-feedback-issue-list__media img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}

.hd-feedback-issue-list__body {
display: flex;
flex-direction: column;
gap: 12px;
padding: 18px;
}

.hd-feedback-issue-list__meta {
display: flex;
flex-wrap: wrap;
gap: 8px 10px;
align-items: center;
}

.hd-feedback-issue-list__badge,
.hd-feedback-issue-list__featured {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 28px;
padding: 0 10px;
border-radius: 999px;
font-size: 12px;
font-weight: 700;
white-space: nowrap;
}

.hd-feedback-issue-list__badge {
background: #eff6ff;
color: #1d4ed8;
}

.status-upcoming .hd-feedback-issue-list__badge {
background: #fff7ed;
color: #c2410c;
}

.status-ended .hd-feedback-issue-list__badge {
background: #f3f4f6;
color: #4b5563;
}

.hd-feedback-issue-list__featured {
background: #eef2ff;
color: #4338ca;
}

.hd-feedback-issue-list__period {
font-size: 12px;
font-weight: 600;
color: #64748b;
}

.hd-feedback-issue-list__title {
margin: 0;
font-size: 1.15rem;
line-height: 1.45;
color: #0f172a;
}

.hd-feedback-issue-list__summary {
margin: 0;
font-size: 14px;
line-height: 1.7;
color: #475569;
}

.hd-feedback-issue-list__summary--muted {
color: #64748b;
}

.hd-feedback-issue-list__question-block {
display: grid;
gap: 8px;
padding: 14px 16px;
border-radius: 16px;
background: #f8fafc;
border: 1px solid rgba(226, 232, 240, 0.94);
}

.hd-feedback-issue-list__question-label {
font-size: 12px;
font-weight: 800;
letter-spacing: .05em;
text-transform: uppercase;
color: #64748b;
}

.hd-feedback-issue-list__question-text {
margin: 0;
font-size: 14px;
line-height: 1.7;
font-weight: 700;
color: #0f172a;
}

.hd-feedback-issue-list__stats {
display: flex;
flex-wrap: wrap;
gap: 8px 14px;
margin-top: auto;
font-size: 13px;
font-weight: 700;
color: #1e293b;
}

.hd-feedback-issue-list__stats-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 10px;
margin: 0 0 14px;
}

.hd-feedback-issue-list__metric {
display: flex;
flex-direction: column;
gap: 4px;
padding: 12px 14px;
border-radius: 14px;
background: #f8fafc;
border: 1px solid rgba(226, 232, 240, 0.92);
}

.hd-feedback-issue-list__metric-label {
font-size: 11px;
font-weight: 700;
letter-spacing: .02em;
color: #64748b;
}

.hd-feedback-issue-list__metric strong {
font-size: 18px;
line-height: 1.15;
color: #0f172a;
}

.hd-feedback-issue-list__stat {
display: inline-flex;
align-items: center;
gap: 6px;
}

.hd-feedback-issue-list__option-block {
display: grid;
gap: 10px;
padding: 14px 16px;
border-radius: 16px;
background: #f8fbff;
border: 1px solid rgba(226, 232, 240, 0.92);
}

.hd-feedback-issue-list__option-label {
font-size: 12px;
font-weight: 800;
letter-spacing: .05em;
text-transform: uppercase;
color: #64748b;
}

.hd-feedback-issue-list__options {
display: grid;
gap: 10px;
margin: 0;
padding: 0;
list-style: none;
}

.hd-feedback-issue-list__option {
display: grid;
gap: 7px;
}

.hd-feedback-issue-list__option-copy {
display: flex;
justify-content: space-between;
align-items: baseline;
gap: 12px;
}

.hd-feedback-issue-list__option-text {
font-size: 14px;
font-weight: 700;
color: #0f172a;
}

.hd-feedback-issue-list__option-meta {
display: inline-flex;
gap: 10px;
font-size: 12px;
font-weight: 700;
color: #334155;
white-space: nowrap;
}

.hd-feedback-issue-list__option-bar {
display: block;
width: 100%;
height: 8px;
border-radius: 999px;
background: #e2e8f0;
overflow: hidden;
}

.hd-feedback-issue-list__option-bar-fill {
display: block;
height: 100%;
border-radius: inherit;
background: linear-gradient(90deg, #93c5fd 0%, #60a5fa 100%);
}

.hd-feedback-issue-list__option-bar-fill.is-leading {
background: linear-gradient(90deg, #2563eb 0%, #3b82f6 100%);
}

.hd-feedback-issue-list__empty {
margin: 0;
padding: 20px 22px;
border: 1px dashed #cbd5e1;
border-radius: 16px;
background: #f8fafc;
font-size: 15px;
line-height: 1.7;
color: #475569;
}

.hd-feedback-issue-list__card.is-compact .hd-feedback-issue-list__link {
flex-direction: row;
}

.hd-feedback-issue-list__card.is-compact .hd-feedback-issue-list__media {
flex: 0 0 34%;
aspect-ratio: 4 / 3;
}

.hd-feedback-issue-list__card.is-compact .hd-feedback-issue-list__body {
padding: 14px 16px;
}

.hd-feedback-issue-list__card.is-list {
border-radius: 20px;
border-color: rgba(226, 232, 240, 0.94);
box-shadow: 0 16px 34px rgba(15, 23, 42, 0.08);
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__link {
display: grid;
grid-template-columns: minmax(250px, 340px) minmax(0, 1fr);
align-items: stretch;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__media {
position: relative;
aspect-ratio: auto;
min-height: 100%;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__body {
padding: 22px 24px;
gap: 14px;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__title {
font-size: 1.25rem;
line-height: 1.45;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__summary {
font-size: 15px;
line-height: 1.75;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__option-block {
padding: 16px 18px;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats-grid {
grid-template-columns: repeat(4, minmax(0, 1fr));
margin-bottom: 4px;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__metric {
padding: 14px 16px;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats.is-popular {
gap: 12px 18px;
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__header {
padding: 0;
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__hero {
background:
radial-gradient(circle at top left, rgba(255,255,255,0.16), transparent 34%),
linear-gradient(135deg, #14324d 0%, #24557d 56%, #3b82b5 100%);
border-color: rgba(191, 219, 254, 0.16);
box-shadow: 0 28px 54px rgba(15, 23, 42, 0.14);
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__title,
.hd-feedback-issue-page--popular .hd-feedback-issue-page__intro,
.hd-feedback-issue-page--popular .hd-feedback-issue-page__period,
.hd-feedback-issue-page--popular .hd-feedback-issue-page__metric strong {
color: #fff;
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__metric {
background: rgba(15, 23, 42, 0.2);
border-color: rgba(191, 219, 254, 0.22);
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__metric-label {
color: rgba(226, 232, 240, 0.82);
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__lead {
background: rgba(255, 255, 255, 0.96);
}

@media (max-width: 900px) {
.hd-feedback-issue-page__hero.has-cover {
grid-template-columns: 1fr;
}
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__toolbar {
display: flex;
justify-content: space-between;
align-items: center;
gap: 20px;
flex-wrap: wrap;
margin-bottom: 30px;
padding: 18px;
border-radius: 22px;
border: 1px solid rgba(226, 232, 240, 0.92);
background: rgba(255, 255, 255, 0.94);
box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06);
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__filters,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__sorts {
display: flex;
gap: 10px;
flex-wrap: wrap;
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__filter,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__sort {
display: inline-block;
padding: 12px 24px;
background: #f8fafc;
color: #334155;
text-decoration: none;
border-radius: 30px;
font-weight: 600;
transition: all 0.2s ease;
border: 1px solid rgba(226, 232, 240, 0.9);
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__filter.is-active,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__sort.is-active,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__filter:hover,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__sort:hover {
background: #eff6ff;
border-color: rgba(147, 197, 253, 0.9);
color: #1d4ed8;
box-shadow: 0 10px 22px rgba(37, 99, 235, 0.12);
}

.hd-feedback-issue-list__grid.is-popular,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__featured-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 24px;
}

.hd-feedback-issue-list__card.is-popular {
border: 1px solid rgba(226, 232, 240, 0.92);
border-radius: 20px;
background: #fff;
box-shadow: 0 16px 32px rgba(15, 23, 42, 0.08);
transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease;
}

.hd-feedback-issue-list__card.is-popular:hover {
transform: translateY(-6px);
box-shadow: 0 26px 48px rgba(15, 23, 42, 0.14);
}

.hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__media {
position: relative;
background: linear-gradient(135deg, #f0f0f1 0%, #e5e7eb 100%);
}

.hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__media img {
transition: transform 0.4s ease;
}

.hd-feedback-issue-list__card.is-popular:hover .hd-feedback-issue-list__media img {
transform: scale(1.05);
}

.hd-feedback-issue-list__media--placeholder {
display: flex;
align-items: center;
justify-content: center;
}

.hd-feedback-issue-list__media-placeholder-icon {
font-size: 48px;
opacity: .68;
}

.hd-feedback-issue-list__rank {
position: absolute;
top: 12px;
left: 12px;
z-index: 2;
width: 38px;
height: 38px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 999px;
background: rgba(20, 20, 30, 0.85);
backdrop-filter: blur(4px);
color: #fff;
font-size: 16px;
font-weight: 700;
box-shadow: 0 2px 8px rgba(0,0,0,0.2);
}

.hd-feedback-issue-list__rank.is-top-3[data-rank="1"] {
background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 100%);
color: #ffffff;
}

.hd-feedback-issue-list__rank.is-top-3[data-rank="2"] {
background: linear-gradient(135deg, #2563eb 0%, #3b82f6 100%);
color: #ffffff;
}

.hd-feedback-issue-list__rank.is-top-3[data-rank="3"] {
background: linear-gradient(135deg, #3b82f6 0%, #60a5fa 100%);
color: #eff6ff;
}

.hd-feedback-issue-list__media-flag {
position: absolute;
top: 12px;
right: 12px;
z-index: 2;
display: inline-flex;
align-items: center;
padding: 4px 8px;
border-radius: 999px;
background: rgba(15, 23, 42, 0.82);
color: #fff;
font-size: 11px;
font-weight: 700;
}

.hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__body {
padding: 20px 20px 22px;
}

.hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__title {
font-size: 18px;
line-height: 1.4;
color: #0f172a;
}

.hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__summary {
flex: 1 1 auto;
font-size: 14px;
line-height: 1.6;
color: #64748b;
}

.hd-feedback-issue-list__stats.is-popular {
gap: 15px;
font-size: 13px;
color: #64748b;
}

.hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__stat:first-child {
font-weight: 700;
color: #e11d48;
}

.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__toolbar {
display: flex;
justify-content: space-between;
align-items: center;
gap: 18px;
padding: 18px 20px;
border-radius: 22px;
border: 1px solid rgba(226, 232, 240, 0.92);
background: rgba(255, 255, 255, 0.96);
box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06);
}

.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__filters,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__sorts {
display: flex;
gap: 10px;
flex-wrap: wrap;
}

.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__filter,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__sort {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 40px;
padding: 0 16px;
border-radius: 999px;
background: #f8fafc;
border: 1px solid rgba(226, 232, 240, 0.9);
color: #334155;
font-weight: 700;
}

.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__filter.is-active,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__sort.is-active,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__filter:hover,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__sort:hover {
background: #eff6ff;
border-color: rgba(147, 197, 253, 0.9);
color: #1d4ed8;
box-shadow: 0 10px 22px rgba(37, 99, 235, 0.12);
}

.hd-feedback-issue-list__pagination {
margin-top: 8px;
}

.hd-feedback-issue-list__result-summary {
display: inline-flex;
align-items: center;
min-height: 36px;
padding: 0 14px;
border-radius: 999px;
background: #f8fafc;
border: 1px solid rgba(226, 232, 240, 0.92);
color: #475569;
font-size: 13px;
font-weight: 700;
}

.hd-feedback-issue-list__pagination .pagination {
justify-content: center;
}

body.fc-dark-mode .hd-feedback-issue-list__card.is-popular,
body.hd-dark-mode .hd-feedback-issue-list__card.is-popular,
body.dark-mode .hd-feedback-issue-list__card.is-popular {
background: #20242a;
border-color: rgba(148, 163, 184, 0.18);
box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
}

body.fc-dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__title,
body.hd-dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__title,
body.dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__title {
color: #f8fafc;
}

body.fc-dark-mode .hd-feedback-issue-list__metric,
body.hd-dark-mode .hd-feedback-issue-list__metric,
body.dark-mode .hd-feedback-issue-list__metric {
background: rgba(15, 23, 42, 0.28);
border-color: rgba(148, 163, 184, 0.16);
}

body.fc-dark-mode .hd-feedback-issue-list__metric strong,
body.hd-dark-mode .hd-feedback-issue-list__metric strong,
body.dark-mode .hd-feedback-issue-list__metric strong {
color: #f8fafc;
}

body.fc-dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__summary,
body.fc-dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__stats.is-popular,
body.hd-dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__summary,
body.hd-dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__stats.is-popular,
body.dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__summary,
body.dark-mode .hd-feedback-issue-list__card.is-popular .hd-feedback-issue-list__stats.is-popular {
color: #cbd5e1;
}

body.fc-dark-mode .hd-feedback-issue-list__card.is-list,
body.hd-dark-mode .hd-feedback-issue-list__card.is-list,
body.dark-mode .hd-feedback-issue-list__card.is-list {
background: #20242a;
border-color: rgba(148, 163, 184, 0.18);
box-shadow: 0 18px 42px rgba(0, 0, 0, 0.22);
}

body.fc-dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__title,
body.hd-dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__title,
body.dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__title {
color: #f8fafc;
}

body.fc-dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__summary,
body.fc-dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats.is-popular,
body.hd-dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__summary,
body.hd-dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats.is-popular,
body.dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__summary,
body.dark-mode .hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats.is-popular {
color: #cbd5e1;
}

@media (max-width: 960px) {
.hd-feedback-issue-list__featured-grid,
.hd-feedback-issue-list__grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__link {
grid-template-columns: 1fr;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

@media (max-width: 640px) {
.hd-feedback-issue-list__toolbar {
align-items: flex-start;
}

.hd-feedback-issue-page__utility,
.hd-feedback-issue-page__utility--hero {
align-items: flex-start;
}

.hd-feedback-issue-page__hero,
.hd-feedback-issue-page__lead {
padding: 18px;
border-radius: 20px;
}

.hd-feedback-issue-page__hero--list {
padding: 26px 22px;
}

.hd-feedback-issue-page__hero-stats {
grid-template-columns: repeat(2, minmax(0, 1fr));
}

.hd-feedback-issue-list__stats-grid {
grid-template-columns: 1fr;
}

.hd-feedback-issue-list__featured-grid,
.hd-feedback-issue-list__grid,
.hd-feedback-issue-list__grid.is-compact,
.hd-feedback-issue-list__grid.is-list,
.hd-feedback-issue-list__featured-grid.is-list {
grid-template-columns: 1fr;
}

.hd-feedback-issue-list__card.is-compact .hd-feedback-issue-list__link {
flex-direction: column;
}

.hd-feedback-issue-list__card.is-compact .hd-feedback-issue-list__media {
flex-basis: auto;
aspect-ratio: 16 / 9;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__body {
padding: 18px 16px;
}

.hd-feedback-issue-list__card.is-list .hd-feedback-issue-list__stats-grid {
grid-template-columns: 1fr;
}

.hd-feedback-issue-page--popular .hd-feedback-issue-page__header {
padding: 32px 16px;
border-radius: 22px;
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__toolbar {
display: block;
padding: 14px;
border-radius: 18px;
}

.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__toolbar {
display: block;
padding: 14px;
border-radius: 18px;
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__filters,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__sorts,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__filters,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__sorts,
.hd-feedback-issue-list__views {
flex-wrap: nowrap;
overflow-x: auto;
gap: 10px;
margin-bottom: 12px;
padding-bottom: 5px;
scrollbar-width: none;
-ms-overflow-style: none;
}

.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__filters::-webkit-scrollbar,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__sorts::-webkit-scrollbar,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__filters::-webkit-scrollbar,
.hd-feedback-issue-list.layout-list .hd-feedback-issue-list__sorts::-webkit-scrollbar {
display: none;
}

.hd-feedback-issue-list__result-summary {
margin-bottom: 12px;
}

.hd-feedback-issue-list__grid.is-popular,
.hd-feedback-issue-list.layout-popular .hd-feedback-issue-list__featured-grid {
grid-template-columns: 1fr;
}

.hd-feedback-issue-list__option-copy {
flex-direction: column;
align-items: flex-start;
}

.hd-feedback-issue-page__related-header {
align-items: flex-start;
flex-direction: column;
}
}

/* Batch 1418: feedback mode split, explicit option media layout, and opt-in poll charts. */
.hd-feedback-wrapper.is-mode-feedback {
background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
border-color: #d9e5f2;
}

.fc-feedback-embed.hd-feedback-wrapper,
.fc-feedback-embed .hd-feedback-wrapper {
margin: 1.5rem 0;
}

.fc-feedback-embed-frame {
display: grid;
gap: 12px;
margin: 1.5rem 0;
}

.fc-feedback-embed-frame .hd-feedback-title {
margin: 0;
font-size: 1.05rem;
line-height: 1.45;
color: #0f172a;
}

.hd-feedback-schedule-strip {
display: grid;
gap: 10px;
margin: 0 0 16px;
padding: 12px 14px;
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 16px;
background: rgba(248, 250, 252, 0.82);
}

.hd-feedback-schedule-strip__heading {
display: inline-flex;
align-items: center;
font-size: 12px;
font-weight: 800;
letter-spacing: 0.05em;
text-transform: uppercase;
color: #475569;
}

.hd-feedback-schedule-strip__status {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 28px;
padding: 0 10px;
border-radius: 999px;
background: #eff6ff;
border: 1px solid #bfdbfe;
color: #1d4ed8;
font-size: 12px;
font-weight: 700;
justify-self: start;
}

.hd-feedback-schedule-strip__items {
display: flex;
flex-wrap: wrap;
gap: 10px;
}

.hd-feedback-schedule-strip__item {
display: inline-flex;
align-items: center;
gap: 8px;
min-height: 34px;
padding: 0 12px;
border-radius: 999px;
background: #ffffff;
border: 1px solid rgba(148, 163, 184, 0.22);
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
}

.hd-feedback-schedule-strip__item-label {
font-size: 12px;
font-weight: 700;
color: #64748b;
}

.hd-feedback-schedule-strip__item-value {
font-size: 13px;
line-height: 1.4;
color: #0f172a;
}

.fc-feedback-embed.hd-feedback-wrapper.is-mode-feedback,
.fc-feedback-embed .hd-feedback-wrapper.is-mode-feedback {
background: linear-gradient(180deg, #f6fbff 0%, #ffffff 100%);
border-color: #dbe7f4;
box-shadow: 0 16px 34px rgba(15, 23, 42, 0.06);
}

.hd-feedback-wrapper.is-mode-simple_feedback {
padding: 16px 18px;
background: linear-gradient(180deg, #fcfcfd 0%, #ffffff 100%);
border-color: #e5e7eb;
}

.fc-feedback-embed.hd-feedback-wrapper.is-mode-simple_feedback,
.fc-feedback-embed .hd-feedback-wrapper.is-mode-simple_feedback {
padding: 14px 16px;
background: #ffffff;
border-color: #e5e7eb;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question {
margin-bottom: 14px;
padding-bottom: 14px;
}

.hd-feedback-wrapper.is-mode-simple_feedback .question-text {
font-size: 1rem;
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) {
background: linear-gradient(180deg, #f7faff 0%, #ffffff 100%);
border-color: #d7e6fb;
box-shadow: 0 14px 34px rgba(37, 99, 235, 0.08);
}

.fc-feedback-embed.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card),
.fc-feedback-embed .hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) {
background:
radial-gradient(circle at top right, rgba(96, 165, 250, 0.16), transparent 26%),
linear-gradient(180deg, #f7faff 0%, #ffffff 100%);
border-color: #cfe2ff;
box-shadow: 0 18px 40px rgba(37, 99, 235, 0.1);
}

.hd-feedback-poll-shell {
display: grid;
gap: 12px;
margin: 0 0 18px;
padding: 0 0 16px;
border-bottom: 1px dashed #d7e6fb;
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-schedule-strip {
border-color: rgba(191, 219, 254, 0.9);
background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-schedule-strip__status {
background: #dbeafe;
border-color: #93c5fd;
color: #1d4ed8;
}

.hd-feedback-poll-shell__meta {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
flex-wrap: wrap;
}

.hd-feedback-poll-shell__badge {
display: inline-flex;
align-items: center;
min-height: 30px;
padding: 0 12px;
border-radius: 999px;
background: #eff6ff;
border: 1px solid #bfdbfe;
color: #1d4ed8;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.02em;
}

.hd-feedback-poll-shell__period {
color: #475569;
font-size: 13px;
line-height: 1.6;
}

.hd-feedback-poll-shell__title {
margin: 0;
font-size: clamp(1.1rem, 2vw, 1.4rem);
line-height: 1.35;
color: #0f172a;
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-question {
background: #ffffff;
border: 1px solid rgba(191, 219, 254, 0.85);
border-radius: 18px;
padding: 18px;
box-shadow: 0 8px 22px rgba(37, 99, 235, 0.06);
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-question + .hd-feedback-question {
margin-top: 16px;
padding-top: 18px;
border-top: 1px solid rgba(191, 219, 254, 0.85);
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .question-text {
font-size: 1.08rem;
font-weight: 800;
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-question-description {
color: #516074;
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-schedule-strip__item {
border-color: rgba(191, 219, 254, 0.78);
}

.hd-feedback-wrapper:not(.is-poll-template-issue-card) .hd-feedback-options--buttons .hd-feedback-option-btn {
display: inline-flex;
width: auto;
max-width: 100%;
}

.hd-feedback-options--buttons {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}

.hd-feedback-options--horizontal {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}

.hd-feedback-options--list {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 12px;
}

.hd-feedback-options--vertical {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 12px;
}

.hd-feedback-options--list .hd-feedback-btn-yesno,
.hd-feedback-options--list .hd-feedback-option-btn,
.hd-feedback-options--list .hd-feedback-option-label {
display: flex;
width: 100%;
max-width: none;
}

.hd-feedback-options--horizontal .hd-feedback-btn-yesno,
.hd-feedback-options--horizontal .hd-feedback-option-btn,
.hd-feedback-options--horizontal .hd-feedback-option-label {
display: flex;
width: 100%;
max-width: none;
}

.hd-feedback-options--buttons .hd-feedback-btn-yesno,
.hd-feedback-options--buttons .hd-feedback-option-btn {
display: flex;
width: 100%;
max-width: none;
min-height: 56px;
}

.hd-feedback-options--vertical .hd-feedback-btn-yesno,
.hd-feedback-options--vertical .hd-feedback-option-btn,
.hd-feedback-options--vertical .hd-feedback-option-label {
width: 100%;
}

.hd-feedback-btn-yesno--horizontal,
.hd-feedback-option-label--horizontal {
align-items: stretch;
}

.hd-feedback-btn-yesno--vertical,
.hd-feedback-option-btn--vertical,
.hd-feedback-option-label--vertical {
width: 100%;
}

.hd-feedback-option-body {
display: grid;
gap: 12px;
width: 100%;
min-width: 0;
}

.hd-feedback-option-body--horizontal {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--vertical {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--list {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--horizontal.hd-feedback-option-body--image_text,
.hd-feedback-option-body--horizontal.hd-feedback-option-body--auto {
grid-template-columns: 156px minmax(0, 1fr);
align-items: center;
}

.hd-feedback-option-body--list.hd-feedback-option-body--image_text,
.hd-feedback-option-body--list.hd-feedback-option-body--auto {
grid-template-columns: minmax(180px, 220px) minmax(0, 1fr);
align-items: center;
}

.hd-feedback-option-body--vertical.hd-feedback-option-body--image_text,
.hd-feedback-option-body--vertical.hd-feedback-option-body--image_only,
.hd-feedback-option-body--vertical.hd-feedback-option-body--auto {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-media {
display: block;
width: 100%;
min-width: 0;
}

.hd-feedback-option-thumb {
display: block;
width: 100%;
height: auto;
min-height: 148px;
aspect-ratio: 4 / 3;
border-radius: 16px;
object-fit: contain;
object-position: center;
padding: 8px;
box-sizing: border-box;
background: #f8fafc;
border: 1px solid rgba(148, 163, 184, 0.16);
}

.hd-feedback-option-body--horizontal .hd-feedback-option-media {
width: 156px;
}

.hd-feedback-option-body--list .hd-feedback-option-media {
width: min(220px, 100%);
}

.hd-feedback-option-body--horizontal .hd-feedback-option-thumb {
aspect-ratio: 4 / 3;
}

.hd-feedback-option-body--image_only .hd-feedback-option-thumb {
aspect-ratio: 4 / 3;
min-height: 220px;
}

.hd-feedback-option-body--list.hd-feedback-option-body--image_only .hd-feedback-option-thumb,
.hd-feedback-option-body--horizontal.hd-feedback-option-body--image_only .hd-feedback-option-thumb {
min-height: 260px;
}

.hd-feedback-option-copy {
display: grid;
gap: 6px;
min-width: 0;
align-content: center;
}

.hd-feedback-option-text {
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 700;
line-height: 1.45;
}

.hd-feedback-option-description {
display: block;
margin: 0;
font-size: 0.9rem;
line-height: 1.6;
color: #64748b;
}

.hd-feedback-option-label,
.hd-feedback-btn-yesno,
.hd-feedback-option-btn {
padding: 12px 14px;
border-radius: 18px;
}

.hd-feedback-option-label--with-marker,
.hd-feedback-btn-yesno--with-marker {
align-items: stretch;
gap: 12px;
}

.hd-feedback-option-marker {
display: inline-flex;
align-items: center;
justify-content: center;
flex: 0 0 36px;
width: 36px;
min-width: 36px;
height: 36px;
margin-top: 2px;
border-radius: 999px;
background: color-mix(in srgb, var(--hd-feedback-accent, #2563eb) 10%, #ffffff);
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent, #2563eb) 16%, var(--hd-feedback-border, #dbe5ef));
color: color-mix(in srgb, var(--hd-feedback-accent, #2563eb) 76%, #0f172a);
font-size: 0.85rem;
font-weight: 800;
line-height: 1;
}

.hd-feedback-options--list .hd-feedback-option-marker {
margin-top: 6px;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-option-btn {
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
border-color: #d6e1ef;
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-option-btn {
border-radius: 14px;
box-shadow: none;
background: #ffffff;
border-color: #d9dee6;
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-option-btn,
.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-option-label {
border-radius: 18px;
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
border-color: rgba(191, 219, 254, 0.95);
box-shadow: 0 10px 24px rgba(37, 99, 235, 0.08);
}

.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-btn-yesno:hover,
.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-option-btn:hover,
.hd-feedback-wrapper.is-mode-digital_vote:not(.is-poll-template-issue-card) .hd-feedback-option-label:hover {
border-color: #93c5fd;
background: linear-gradient(180deg, #ffffff 0%, #eef6ff 100%);
box-shadow: 0 14px 28px rgba(37, 99, 235, 0.12);
}

.hd-feedback-wrapper.is-poll-template-issue-card .hd-feedback-schedule-strip {
margin-top: 14px;
border-color: rgba(191, 219, 254, 0.9);
background: rgba(255, 255, 255, 0.88);
backdrop-filter: blur(10px);
}

.hd-feedback-wrapper.is-poll-template-issue-card .hd-feedback-schedule-strip__heading {
color: #1d4ed8;
}

.hd-feedback-option-label--with-image,
.hd-feedback-btn-yesno--with-image {
align-items: stretch;
}

.hd-feedback-option-label--with-image input {
margin-top: 10px;
align-self: start;
}

.poll-option-name {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: 10px;
align-items: center;
}

.poll-option-name--with-image {
grid-template-columns: 120px minmax(0, 1fr) auto;
gap: 14px;
align-items: center;
}

.poll-option-media {
display: block;
}

.poll-option-media .hd-feedback-option-thumb {
aspect-ratio: 4 / 3;
min-height: 90px;
border-radius: 12px;
object-fit: contain;
padding: 6px;
background: #f8fafc;
}

@media (max-width: 640px) {
.hd-feedback-options--horizontal {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--horizontal.hd-feedback-option-body--image_text,
.hd-feedback-option-body--horizontal.hd-feedback-option-body--auto,
.hd-feedback-option-body--list.hd-feedback-option-body--image_text,
.hd-feedback-option-body--list.hd-feedback-option-body--auto {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--horizontal .hd-feedback-option-media,
.hd-feedback-option-body--list .hd-feedback-option-media {
width: 100%;
}

.hd-feedback-option-label--with-marker,
.hd-feedback-btn-yesno--with-marker {
gap: 10px;
}
}

.poll-option-copy {
display: grid;
gap: 4px;
min-width: 0;
}

.poll-option-title {
display: inline-flex;
align-items: center;
gap: 8px;
font-weight: 700;
line-height: 1.45;
}

.hd-issue-poll-analytics--bars .hd-issue-poll-analytics__chart-card {
display: grid;
}

.hd-issue-poll-analytics__bars {
display: grid;
gap: 10px;
}

.hd-issue-poll-analytics__bar-item {
display: grid;
gap: 6px;
}

.hd-issue-poll-analytics__bar-copy {
display: flex;
justify-content: space-between;
gap: 12px;
align-items: baseline;
flex-wrap: wrap;
}

.hd-issue-poll-analytics__bar-title {
font-weight: 700;
color: #0f172a;
}

.hd-issue-poll-analytics__bar-meta {
font-size: 0.88rem;
color: #64748b;
}

.hd-issue-poll-analytics__bar-track {
display: block;
height: 12px;
border-radius: 999px;
background: rgba(148, 163, 184, 0.18);
overflow: hidden;
}

.hd-issue-poll-analytics__bar-fill {
display: block;
height: 100%;
border-radius: inherit;
}

.hd-issue-poll-analytics--style-editorial {
border: 1px solid rgba(37, 99, 235, 0.14);
background: linear-gradient(180deg, rgba(248, 250, 255, 0.96), rgba(255, 255, 255, 0.98));
}

.hd-issue-poll-analytics--style-editorial .hd-issue-poll-analytics__metric {
background: rgba(255, 255, 255, 0.9);
}

.hd-issue-poll-analytics--style-minimal {
padding: 16px;
border-radius: 16px;
box-shadow: none;
background: #fff;
}

.hd-issue-poll-analytics--style-minimal .hd-issue-poll-analytics__metric,
.hd-issue-poll-analytics--style-minimal .hd-issue-poll-analytics__legend-item {
background: transparent;
border-color: rgba(148, 163, 184, 0.2);
}

@media (max-width: 640px) {
.hd-feedback-schedule-strip__items {
flex-direction: column;
}

.hd-feedback-schedule-strip__item {
justify-content: space-between;
}

.hd-feedback-options--buttons,
.hd-feedback-options--horizontal {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--horizontal.hd-feedback-option-body--image_text,
.hd-feedback-option-body--horizontal.hd-feedback-option-body--auto,
.poll-option-name--with-image {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-option-body--horizontal .hd-feedback-option-media {
width: 100%;
}

.hd-feedback-options--horizontal .hd-feedback-btn-yesno,
.hd-feedback-options--horizontal .hd-feedback-option-btn,
.hd-feedback-options--horizontal .hd-feedback-option-label {
flex-basis: 100%;
}
}

/* Feedback System poll presentation upgrades */
.hd-feedback-wrapper.is-mode-feedback {
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
border-color: #dbe5ef;
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.hd-feedback-wrapper.is-mode-simple_feedback {
padding: 18px 20px;
border-radius: 16px;
background: #ffffff;
border-color: #e5e7eb;
box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.hd-feedback-wrapper.is-mode-digital_vote {
--hd-poll-surface: #ffffff;
--hd-poll-border: #d7dee7;
--hd-poll-shadow: 0 14px 34px rgba(15, 23, 42, 0.08);
--hd-poll-accent: #2563eb;
--hd-poll-text: #0f172a;
--hd-poll-muted: #475569;
--hd-poll-panel: #f8fbff;
--hd-poll-chip: #eff6ff;
background: var(--hd-poll-surface);
border-color: var(--hd-poll-border);
box-shadow: var(--hd-poll-shadow);
color: var(--hd-poll-text);
}

.hd-feedback-wrapper.is-mode-digital_vote .question-text,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-option-text,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell__title {
color: var(--hd-poll-text);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-question-description,
.hd-feedback-wrapper.is-mode-digital_vote .hd-issue-poll-card__question-description,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell__period,
.hd-feedback-wrapper.is-mode-digital_vote .hd-issue-poll-card__period,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-fixed-content--issue-card {
color: var(--hd-poll-muted);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-schedule-strip,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-fixed-content--issue-card,
.hd-feedback-wrapper.is-mode-digital_vote .hd-poll-results-summary,
.hd-feedback-wrapper.is-mode-digital_vote .hd-issue-poll-analytics {
background: var(--hd-poll-panel);
border-radius: 16px;
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell {
margin-bottom: 18px;
padding: 16px 18px;
border: 1px solid color-mix(in srgb, var(--hd-poll-accent) 12%, transparent);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell__meta {
display: flex;
flex-wrap: wrap;
gap: 10px 12px;
align-items: center;
margin-bottom: 10px;
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell__badge,
.hd-feedback-wrapper.is-mode-digital_vote .hd-issue-poll-card__badge {
background: color-mix(in srgb, var(--hd-poll-accent) 12%, #ffffff);
border-color: color-mix(in srgb, var(--hd-poll-accent) 45%, #ffffff);
color: var(--hd-poll-accent);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-poll-shell__title {
margin: 0;
font-size: clamp(1.35rem, 2.6vw, 2.2rem);
line-height: 1.2;
font-weight: 800;
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-schedule-strip {
margin-bottom: 18px;
border-color: color-mix(in srgb, var(--hd-poll-accent) 14%, #dbe5ef);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-fixed-content--issue-card {
padding: 18px 20px;
border: 1px solid color-mix(in srgb, var(--hd-poll-accent) 10%, #d7dee7);
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-question {
padding: 18px 0 0;
border-bottom: 0;
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-option-btn,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-option-label {
border-color: color-mix(in srgb, var(--hd-poll-accent) 18%, #cbd5e1);
background: #ffffff;
}

.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-btn-yesno:hover,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-option-btn:hover,
.hd-feedback-wrapper.is-mode-digital_vote .hd-feedback-option-label:hover {
border-color: color-mix(in srgb, var(--hd-poll-accent) 42%, #cbd5e1);
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.07);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) {
display: grid;
grid-template-columns: minmax(220px, 0.85fr) minmax(0, 1.15fr);
gap: 18px 24px;
align-items: start;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-poll-shell,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-schedule-strip {
grid-column: 1 / -1;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-fixed-content {
grid-column: 1;
margin-bottom: 0;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-status,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-question,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-submit-btn,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-notice,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-progress,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-thanks {
grid-column: 2;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card {
display: grid;
grid-template-columns: minmax(0, 1.08fr) minmax(280px, 0.92fr);
gap: 20px 24px;
align-items: start;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card__status-row,
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-feedback-schedule-strip,
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-feedback-fixed-content--issue-card {
grid-column: 1 / -1;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-feedback-question--issue-card {
grid-column: 1;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card__cover {
grid-column: 2;
grid-row: 2 / span 3;
margin-bottom: 0;
height: 100%;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card__cover img {
height: 100%;
min-height: 100%;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-editorial {
--hd-poll-accent: #2563eb;
--hd-poll-panel: #f8fbff;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-spotlight {
--hd-poll-accent: #7c3aed;
--hd-poll-panel: #faf5ff;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-compact {
--hd-poll-accent: #0f766e;
--hd-poll-panel: #f0fdfa;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-accent_bar {
--hd-poll-accent: #ef4444;
padding-left: 24px;
border-left: 6px solid var(--hd-poll-accent);
background: linear-gradient(180deg, #ffffff 0%, #fff7f7 100%);
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-layout-accent_bar {
padding-left: 0;
border-left-width: 8px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-split_panel {
--hd-poll-accent: #1d4ed8;
--hd-poll-panel: #eef4ff;
background:
linear-gradient(90deg, rgba(29, 78, 216, 0.06) 0, rgba(29, 78, 216, 0.06) 33%, #ffffff 33%, #ffffff 100%);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-glass {
--hd-poll-accent: #4f46e5;
--hd-poll-panel: rgba(255, 255, 255, 0.64);
background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(240, 249, 255, 0.72));
backdrop-filter: blur(14px);
border-color: rgba(148, 163, 184, 0.32);
box-shadow: 0 18px 36px rgba(15, 23, 42, 0.09);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal {
--hd-poll-accent: #111827;
--hd-poll-panel: transparent;
box-shadow: none;
border-radius: 12px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal .hd-feedback-poll-shell,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal .hd-feedback-schedule-strip,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal .hd-feedback-fixed-content--issue-card,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal .hd-poll-results-summary,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-minimal .hd-issue-poll-analytics {
border-radius: 12px;
box-shadow: none;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-soft_card {
--hd-poll-accent: #ec4899;
--hd-poll-panel: #fff4fb;
background: linear-gradient(180deg, #ffffff 0%, #fff7fb 100%);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast {
--hd-poll-surface: linear-gradient(180deg, #0f172a 0%, #111827 100%);
--hd-poll-border: #1e293b;
--hd-poll-shadow: 0 18px 42px rgba(2, 6, 23, 0.35);
--hd-poll-accent: #38bdf8;
--hd-poll-text: #f8fafc;
--hd-poll-muted: #cbd5e1;
--hd-poll-panel: rgba(15, 23, 42, 0.78);
--hd-poll-chip: rgba(56, 189, 248, 0.16);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-feedback-option-btn,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-feedback-option-label,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-issue-poll-analytics__metric,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-issue-poll-analytics__legend-item {
background: rgba(15, 23, 42, 0.78);
color: #f8fafc;
border-color: rgba(148, 163, 184, 0.28);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-issue-poll-analytics__metric-label,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-issue-poll-analytics__legend-meta,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-feedback-schedule-strip__item-label {
color: #cbd5e1;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-issue-poll-analytics__metric strong,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-issue-poll-analytics__legend-title,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-dark_contrast .hd-feedback-schedule-strip__item-value {
color: #f8fafc;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-metric_board {
--hd-poll-accent: #0f766e;
--hd-poll-panel: #f0fdfa;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-metric_board .hd-poll-results-summary,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-metric_board .hd-issue-poll-analytics__metrics {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
gap: 12px;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-metric_board .hd-poll-results-summary__item,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-layout-metric_board .hd-issue-poll-analytics__metric {
padding: 14px 16px;
border-radius: 14px;
border: 1px solid color-mix(in srgb, var(--hd-poll-accent) 16%, #d7dee7);
background: #ffffff;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-palette-cobalt {
--hd-poll-accent: #2563eb;
--hd-poll-panel: #eef4ff;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-palette-violet {
--hd-poll-accent: #7c3aed;
--hd-poll-panel: #f7f0ff;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-palette-jade {
--hd-poll-accent: #0f766e;
--hd-poll-panel: #eefbf7;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-palette-coral {
--hd-poll-accent: #e11d48;
--hd-poll-panel: #fff1f4;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-palette-amber {
--hd-poll-accent: #d97706;
--hd-poll-panel: #fffbeb;
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-palette-mono {
--hd-poll-accent: #374151;
--hd-poll-panel: #f3f4f6;
}

.hd-feedback-wrapper.is-mode-story_submission {
--hd-story-accent: #7c3aed;
--hd-story-surface: #fcfaff;
--hd-feedback-accent: #7c3aed;
--hd-feedback-panel: #fcfaff;
--hd-feedback-border: #e7dcff;
--hd-feedback-chip: #f6f0ff;
--hd-feedback-muted: #5b6472;
background: linear-gradient(180deg, #ffffff 0%, color-mix(in srgb, var(--hd-story-surface) 88%, #ffffff) 100%);
border-color: color-mix(in srgb, var(--hd-story-accent) 18%, #d8dce6);
}

.hd-feedback-story-shell,
.hd-feedback-identity-panel {
margin-bottom: 18px;
padding: 16px 18px;
border-radius: 16px;
border: 1px solid color-mix(in srgb, var(--hd-story-accent, #7c3aed) 16%, #e3e8ef);
background: var(--hd-story-surface, #faf5ff);
}

.hd-feedback-story-shell__meta {
display: flex;
flex-wrap: wrap;
gap: 10px;
align-items: center;
margin-bottom: 10px;
}

.hd-feedback-story-shell__badge {
display: inline-flex;
align-items: center;
padding: 6px 12px;
border-radius: 999px;
background: color-mix(in srgb, var(--hd-story-accent, #7c3aed) 12%, #ffffff);
color: var(--hd-story-accent-strong, #6d28d9);
font-weight: 700;
font-size: 13px;
}

.hd-feedback-story-shell__privacy,
.hd-feedback-story-shell__description {
color: #5b6472;
font-size: 14px;
line-height: 1.7;
}

.hd-feedback-story-shell__title {
margin: 0 0 8px;
font-size: 24px;
line-height: 1.35;
}

.hd-feedback-identity-panel__grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 14px;
}

.hd-feedback-identity-field {
display: flex;
flex-direction: column;
gap: 8px;
font-size: 14px;
color: #374151;
}

.hd-feedback-identity-field--wide {
grid-column: 1 / -1;
}

.hd-feedback-identity-input {
width: 100%;
padding: 12px 14px;
border-radius: 12px;
border: 1px solid #d7dee7;
background: #ffffff;
box-sizing: border-box;
font: inherit;
}

.hd-feedback-identity-input:focus {
outline: none;
border-color: color-mix(in srgb, var(--hd-story-accent, #7c3aed) 48%, #c8d0da);
box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.12);
}

@media (max-width: 900px) {
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card),
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-status,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-question,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-submit-btn,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-notice,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-progress,
.hd-feedback-wrapper.is-mode-digital_vote.is-poll-orientation-horizontal:not(.is-poll-template-issue-card) > .hd-feedback-thanks,
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-feedback-question--issue-card,
.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card__cover {
grid-column: 1;
grid-row: auto;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card__cover {
height: auto;
margin-bottom: 0;
}

.hd-feedback-wrapper.is-poll-template-issue-card.is-poll-orientation-horizontal .hd-issue-poll-card__cover img {
height: auto;
}

.hd-feedback-identity-panel__grid {
grid-template-columns: 1fr;
}
}

/* Batch 1486: feedback/simple shell + survey-aware front-end refinement */
.hd-feedback-wrapper.is-mode-feedback,
.hd-feedback-wrapper.is-mode-simple_feedback {
--hd-feedback-accent: #2563eb;
--hd-feedback-panel: #f8fbff;
--hd-feedback-border: #dbe5ef;
--hd-feedback-chip: #eaf2ff;
--hd-feedback-text: #0f172a;
--hd-feedback-muted: #5b6472;
color: var(--hd-feedback-text);
}

.hd-feedback-wrapper.is-mode-simple_feedback {
--hd-feedback-accent: #0f766e;
--hd-feedback-panel: #f8faf9;
--hd-feedback-border: #d8e5e2;
--hd-feedback-chip: #e6f6f3;
}

.hd-feedback-wrapper.is-feedback-palette-ocean {
--hd-feedback-accent: #2563eb;
--hd-feedback-panel: #f7fbff;
--hd-feedback-border: #d9e8ff;
--hd-feedback-chip: #eaf2ff;
--hd-feedback-muted: #4b647f;
--hd-story-accent: #2563eb;
--hd-story-accent-strong: #1d4ed8;
--hd-story-surface: #f4f8ff;
--hd-story-soft: #eff6ff;
--hd-story-border: #dbeafe;
}

.hd-feedback-wrapper.is-feedback-palette-violet {
--hd-feedback-accent: #7c3aed;
--hd-feedback-panel: #fbf7ff;
--hd-feedback-border: #eadcff;
--hd-feedback-chip: #f3e8ff;
--hd-feedback-muted: #5f5878;
--hd-story-accent: #7c3aed;
--hd-story-accent-strong: #5b21b6;
--hd-story-surface: #fbf7ff;
--hd-story-soft: #f6f0ff;
--hd-story-border: #e9ddff;
}

.hd-feedback-wrapper.is-feedback-palette-emerald {
--hd-feedback-accent: #0f766e;
--hd-feedback-panel: #f4fffb;
--hd-feedback-border: #cceee7;
--hd-feedback-chip: #dff7f1;
--hd-feedback-muted: #49645d;
--hd-story-accent: #0f766e;
--hd-story-accent-strong: #0f5d58;
--hd-story-surface: #f0fdf9;
--hd-story-soft: #eefbf8;
--hd-story-border: #d4f2ea;
}

.hd-feedback-wrapper.is-feedback-palette-sunset {
--hd-feedback-accent: #ea580c;
--hd-feedback-panel: #fff8f3;
--hd-feedback-border: #f8dcc6;
--hd-feedback-chip: #ffedd5;
--hd-feedback-muted: #74574a;
--hd-story-accent: #ea580c;
--hd-story-accent-strong: #c2410c;
--hd-story-surface: #fff6ee;
--hd-story-soft: #fff4eb;
--hd-story-border: #fed7aa;
}

.hd-feedback-wrapper.is-feedback-palette-slate {
--hd-feedback-accent: #334155;
--hd-feedback-panel: #f8fafc;
--hd-feedback-border: #dbe4ee;
--hd-feedback-chip: #e8eef5;
--hd-feedback-muted: #526072;
--hd-story-accent: #334155;
--hd-story-accent-strong: #1f2937;
--hd-story-surface: #f5f8fb;
--hd-story-soft: #f3f6fa;
--hd-story-border: #dce4ee;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-form-shell {
background: linear-gradient(180deg, #eef5ff 0%, #ffffff 100%);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-form-shell__badge {
background: linear-gradient(180deg, #eff6ff 0%, #dbeafe 100%);
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-form-shell {
gap: 8px;
padding: 14px 16px;
background: linear-gradient(180deg, #f4fbf8 0%, #ffffff 100%);
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.04);
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-form-shell__title {
font-size: clamp(1rem, 1.7vw, 1.18rem);
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-form-shell__hint {
font-size: 0.9rem;
line-height: 1.6;
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-form-shell__pill {
background: #f0f8f6;
}

.hd-feedback-form-shell {
display: grid;
gap: 10px;
margin: 0 0 18px;
padding: 16px 18px;
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 12%, var(--hd-feedback-border));
border-radius: 18px;
background: linear-gradient(180deg, color-mix(in srgb, var(--hd-feedback-chip) 50%, #ffffff) 0%, #ffffff 100%);
box-shadow: 0 10px 24px rgba(15, 23, 42, 0.05);
}

.hd-feedback-form-shell__meta {
display: flex;
flex-wrap: wrap;
gap: 8px;
align-items: center;
}

.hd-feedback-form-shell__badge,
.hd-feedback-form-shell__pill {
display: inline-flex;
align-items: center;
min-height: 28px;
padding: 0 10px;
border-radius: 999px;
font-size: 12px;
font-weight: 700;
}

.hd-feedback-form-shell__badge {
background: color-mix(in srgb, var(--hd-feedback-accent) 14%, #ffffff);
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 34%, #ffffff);
color: var(--hd-feedback-accent);
}

.hd-feedback-form-shell__pill {
background: var(--hd-feedback-chip);
color: #475569;
}

.hd-feedback-form-shell__title {
margin: 0;
font-size: clamp(1.08rem, 2vw, 1.35rem);
line-height: 1.35;
font-weight: 800;
color: var(--hd-feedback-text);
}

.hd-feedback-wrapper .hd-feedback-form-shell__title,
#si-single-content .hd-feedback-wrapper .hd-feedback-form-shell__title {
margin: 0;
padding: 0;
clear: none;
border: 0;
}

.hd-feedback-wrapper .hd-feedback-poll-shell__title,
#si-single-content .hd-feedback-wrapper .hd-feedback-poll-shell__title {
margin: 0;
padding: 0;
clear: none;
border: 0;
}

.hd-feedback-wrapper .hd-feedback-story-shell__title,
#si-single-content .hd-feedback-wrapper .hd-feedback-story-shell__title {
margin: 0 0 8px;
padding: 0;
clear: none;
border: 0;
}

.hd-feedback-form-shell__hint {
margin: 0;
font-size: 0.95rem;
line-height: 1.7;
color: var(--hd-feedback-muted);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-fixed-content {
margin-bottom: 18px;
padding: 16px 18px;
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 10%, var(--hd-feedback-border));
border-radius: 16px;
background: var(--hd-feedback-panel);
color: var(--hd-feedback-muted);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question {
padding: 18px;
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 8%, var(--hd-feedback-border));
border-radius: 18px;
background: #ffffff;
box-shadow: 0 10px 22px rgba(15, 23, 42, 0.04);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-question + .hd-feedback-question,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question + .hd-feedback-question {
margin-top: 16px;
padding-top: 18px;
border-top: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 8%, var(--hd-feedback-border));
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question {
padding: 16px;
border-radius: 16px;
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.03);
}

.hd-feedback-wrapper.is-mode-feedback.has-multiple-questions .hd-feedback-question,
.hd-feedback-wrapper.is-mode-feedback.is-survey-enabled .hd-feedback-question {
background: linear-gradient(180deg, #ffffff 0%, #fbfdff 100%);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-submit-btn,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-submit-btn {
min-height: 48px;
padding: 0 22px;
border-radius: 999px;
background: linear-gradient(180deg, color-mix(in srgb, var(--hd-feedback-accent) 92%, #ffffff) 0%, var(--hd-feedback-accent) 100%);
box-shadow: 0 12px 24px color-mix(in srgb, var(--hd-feedback-accent) 20%, transparent);
font-weight: 700;
letter-spacing: 0.01em;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-submit-btn:hover,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-submit-btn:hover {
filter: brightness(1.02);
transform: translateY(-1px);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-status,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-status,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-progress,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-progress,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-pagination,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-pagination,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-notice,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-notice {
border-color: color-mix(in srgb, var(--hd-feedback-accent) 10%, #d7e1ee);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-notice,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-notice {
padding: 14px 16px 0;
border-top-style: solid;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-notice__text,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-notice__text {
font-size: 0.9rem;
line-height: 1.7;
color: var(--hd-feedback-muted);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-question-description,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question-description {
color: var(--hd-feedback-muted);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-text-input,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-textarea-input,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-text-input,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-textarea-input {
padding: 12px 14px;
border-radius: 14px;
border-color: color-mix(in srgb, var(--hd-feedback-accent) 12%, #d7dee7);
background: #ffffff;
box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.03);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-text-input:focus,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-textarea-input:focus,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-text-input:focus,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-textarea-input:focus {
outline: none;
border-color: color-mix(in srgb, var(--hd-feedback-accent) 42%, #d7dee7);
box-shadow: 0 0 0 3px color-mix(in srgb, var(--hd-feedback-accent) 12%, transparent);
}

@media (max-width: 640px) {
.hd-feedback-form-shell {
padding: 14px 16px;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question {
padding: 16px;
}
}

/* Batch 1495: front-end mode closeout for feedback / simple / story */
.hd-feedback-form-shell__eyebrow,
.hd-feedback-story-shell__eyebrow {
display: inline-flex;
align-items: center;
min-height: 24px;
padding: 0 10px;
border-radius: 999px;
background: rgba(15, 23, 42, 0.06);
color: #475569;
font-size: 11px;
font-weight: 800;
letter-spacing: 0.04em;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-form-shell__eyebrow {
background: #dbeafe;
color: #1d4ed8;
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-form-shell__eyebrow {
background: #dff7f1;
color: #0f766e;
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-option-btn,
.hd-feedback-wrapper.is-mode-feedback .hd-feedback-option-label {
padding: 14px 16px;
border-radius: 18px;
border-color: color-mix(in srgb, var(--hd-feedback-accent) 18%, #d8e1ec);
background: linear-gradient(180deg, #ffffff 0%, #f8fbff 100%);
box-shadow: 0 10px 20px rgba(37, 99, 235, 0.06);
}

.hd-feedback-wrapper.is-mode-feedback .hd-feedback-option-description {
margin-top: 6px;
font-size: 13px;
line-height: 1.6;
color: #64748b;
}

.hd-feedback-wrapper.is-mode-feedback.is-answer-journey-survey .hd-feedback-pagination,
.hd-feedback-wrapper.is-mode-feedback.is-answer-journey-survey .hd-feedback-progress {
background: linear-gradient(180deg, #f8fbff 0%, #eef6ff 100%);
}

.hd-feedback-wrapper.is-mode-feedback.is-answer-journey-quick .hd-feedback-form-shell__pill,
.hd-feedback-wrapper.is-mode-feedback.is-answer-journey-form .hd-feedback-form-shell__pill {
background: #edf4ff;
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-btn-yesno,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-option-btn,
.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-option-label {
min-height: 46px;
padding: 12px 14px;
border-radius: 14px;
border-color: color-mix(in srgb, var(--hd-feedback-accent) 14%, #d9e5e2);
background: #ffffff;
box-shadow: 0 8px 18px rgba(15, 118, 110, 0.05);
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-option-body {
gap: 8px;
}

.hd-feedback-wrapper.is-mode-simple_feedback .hd-feedback-question-description {
font-size: 0.9rem;
}

.hd-feedback-wrapper.is-mode-simple_feedback.is-answer-journey-quick .hd-feedback-form-shell {
gap: 6px;
}

.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-story_submission {
background: #ffffff;
border-color: #d7dee8;
box-shadow: 0 18px 34px rgba(15, 23, 42, 0.06);
}

.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-editorial.is-mode-story_submission .hd-feedback-question {
background: #ffffff;
border-color: rgba(148, 163, 184, 0.28);
box-shadow: 0 14px 28px rgba(15, 23, 42, 0.05);
}

.hd-feedback-wrapper.is-feedback-style-soft.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-story_submission {
background: linear-gradient(180deg, #fbfdff 0%, #f8fafc 100%);
}

.hd-feedback-wrapper.is-feedback-style-soft.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-soft.is-mode-story_submission .hd-feedback-question {
background: linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(248, 250, 252, 0.96) 100%);
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission {
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-fixed-content {
border-radius: 14px;
box-shadow: none;
}

.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-story_submission {
background: linear-gradient(135deg, color-mix(in srgb, var(--hd-feedback-accent) 10%, #ffffff) 0%, #ffffff 58%, color-mix(in srgb, var(--hd-feedback-accent) 5%, #f8fafc) 100%);
border-color: color-mix(in srgb, var(--hd-feedback-accent) 18%, var(--hd-feedback-border));
box-shadow: 0 22px 42px color-mix(in srgb, var(--hd-feedback-accent) 12%, transparent);
}

.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-story_submission .hd-feedback-question {
border-color: color-mix(in srgb, var(--hd-feedback-accent) 14%, var(--hd-feedback-border));
box-shadow: 0 16px 30px color-mix(in srgb, var(--hd-feedback-accent) 8%, transparent);
}

.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-spotlight.is-mode-story_submission .hd-feedback-story-shell {
background: linear-gradient(180deg, color-mix(in srgb, var(--hd-feedback-chip) 62%, #ffffff) 0%, #ffffff 100%);
}

.hd-feedback-wrapper.is-feedback-style-outline.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-story_submission {
background: transparent;
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 22%, var(--hd-feedback-border));
box-shadow: none;
}

.hd-feedback-wrapper.is-feedback-style-outline.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-story_submission .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-simple_feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-outline.is-mode-story_submission .hd-feedback-fixed-content {
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 18%, var(--hd-feedback-border));
box-shadow: none;
background: #ffffff;
}

.hd-feedback-wrapper.is-feedback-style-glass.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-story_submission {
background: linear-gradient(135deg, color-mix(in srgb, var(--hd-feedback-accent) 8%, #ffffff) 0%, rgba(255, 255, 255, 0.72) 100%);
border-color: color-mix(in srgb, var(--hd-feedback-accent) 16%, rgba(148, 163, 184, 0.4));
box-shadow: 0 22px 40px rgba(15, 23, 42, 0.08);
backdrop-filter: blur(16px);
}

.hd-feedback-wrapper.is-feedback-style-glass.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-story_submission .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-simple_feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-glass.is-mode-story_submission .hd-feedback-fixed-content {
background: rgba(255, 255, 255, 0.74);
border-color: color-mix(in srgb, var(--hd-feedback-accent) 14%, rgba(255, 255, 255, 0.85));
box-shadow: 0 14px 26px rgba(15, 23, 42, 0.05);
backdrop-filter: blur(14px);
}

.hd-feedback-wrapper.is-mode-story_submission {
padding: 22px;
border-radius: 24px;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.98) 0%, color-mix(in srgb, var(--hd-story-soft, #f6f0ff) 72%, rgba(255, 255, 255, 0.98)) 100%);
box-shadow: 0 20px 40px color-mix(in srgb, var(--hd-story-accent, #7c3aed) 12%, transparent);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-fixed-content {
margin-bottom: 18px;
padding: 16px 18px;
border-radius: 18px;
border: 1px solid color-mix(in srgb, var(--hd-story-accent) 16%, var(--hd-story-border));
background: linear-gradient(180deg, #ffffff 0%, color-mix(in srgb, var(--hd-story-soft, #f6f0ff) 54%, #ffffff) 100%);
color: #5b6472;
}

.hd-feedback-story-shell {
box-shadow: 0 16px 34px color-mix(in srgb, var(--hd-story-accent, #7c3aed) 10%, transparent);
}

.hd-feedback-story-shell__eyebrow {
background: rgba(91, 33, 182, 0.12);
color: var(--hd-story-accent-strong);
}

.hd-feedback-story-shell__meta {
justify-content: flex-start;
}

.hd-feedback-story-shell__privacy {
display: inline-flex;
align-items: center;
min-height: 30px;
padding: 0 12px;
border-radius: 999px;
background: rgba(255, 255, 255, 0.75);
border: 1px solid color-mix(in srgb, var(--hd-story-accent, #7c3aed) 12%, #ffffff);
}

.hd-feedback-story-shell__pills {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: 14px;
}

.hd-feedback-story-shell__pill {
display: inline-flex;
align-items: center;
min-height: 30px;
padding: 0 12px;
border-radius: 999px;
background: color-mix(in srgb, var(--hd-story-accent, #7c3aed) 8%, #ffffff);
color: var(--hd-story-accent-strong, #6d28d9);
font-size: 12px;
font-weight: 700;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-question {
display: flex;
flex-direction: column;
gap: 0;
padding: 22px;
border: 1px solid color-mix(in srgb, var(--hd-story-accent) 14%, #ece3ff);
border-radius: 22px;
background: linear-gradient(180deg, #ffffff 0%, color-mix(in srgb, var(--hd-story-soft, #f6f0ff) 38%, #ffffff) 100%);
box-shadow: 0 14px 30px color-mix(in srgb, var(--hd-story-accent, #7c3aed) 8%, transparent);
}

.hd-feedback-wrapper.is-mode-story_submission .question-text {
margin-bottom: 10px;
font-size: clamp(1.08rem, 2vw, 1.32rem);
line-height: 1.45;
font-weight: 800;
color: #1f2937;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-options {
display: block;
width: 100%;
margin: 0;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-question-description {
order: 3;
margin: 14px 0 0;
padding: 12px 14px;
border-radius: 16px;
background: rgba(124, 58, 237, 0.06);
border: 1px solid rgba(124, 58, 237, 0.1);
font-size: 0.95rem;
line-height: 1.75;
color: #5b6472;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-text-input,
.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-textarea-input {
width: 100%;
display: block;
margin: 0;
padding: 16px 18px;
border-radius: 18px;
border: 1px solid color-mix(in srgb, var(--hd-story-accent) 14%, #d8deea);
background: linear-gradient(180deg, #ffffff 0%, #fcfbff 100%);
box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.03);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-text-input {
min-height: 50px;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-textarea-input {
min-height: 220px;
line-height: 1.85;
resize: vertical;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-text-input:focus,
.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-textarea-input:focus {
outline: none;
border-color: color-mix(in srgb, var(--hd-story-accent) 38%, #cdd5e1);
box-shadow: 0 0 0 4px rgba(124, 58, 237, 0.12);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-input-meta {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
gap: 10px 14px;
margin-top: 12px;
padding: 10px 12px;
border-radius: 14px;
background: rgba(124, 58, 237, 0.06);
color: #5b6472;
font-size: 13px;
line-height: 1.6;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-input-count strong {
color: var(--hd-story-accent-strong);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-identity-panel {
background: linear-gradient(180deg, #ffffff 0%, #fbf8ff 100%);
box-shadow: 0 12px 28px rgba(124, 58, 237, 0.05);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-identity-panel__grid--contact {
grid-template-columns: minmax(0, 1fr);
}

.hd-feedback-wrapper.is-mode-story_submission.is-story-identity-named_submission .hd-feedback-identity-panel {
border-color: rgba(91, 33, 182, 0.22);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-identity-field span {
font-weight: 700;
color: #1f2937;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-submit-btn {
width: 100%;
min-height: 52px;
margin-top: 20px;
border-radius: 18px;
background: linear-gradient(180deg, #8b5cf6 0%, #6d28d9 100%);
box-shadow: 0 16px 28px rgba(109, 40, 217, 0.22);
font-weight: 800;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-submit-btn:hover {
transform: translateY(-1px);
filter: brightness(1.03);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-status,
.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-progress,
.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-pagination,
.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-notice {
border-color: rgba(124, 58, 237, 0.14);
background: linear-gradient(180deg, #ffffff 0%, #faf5ff 100%);
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-notice__text {
color: #6b7280;
line-height: 1.75;
}

@media (max-width: 640px) {
.hd-feedback-wrapper.is-mode-story_submission {
padding: 18px;
border-radius: 20px;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-question {
padding: 18px;
border-radius: 18px;
}

.hd-feedback-wrapper.is-mode-story_submission .hd-feedback-textarea-input {
min-height: 180px;
}
}

/* Batch 1530: feedback layout cleanup for minimal and no-rail variants */
.hd-feedback-wrapper.is-feedback-style-minimal::before,
.hd-feedback-wrapper.is-feedback-style-clean::before {
display: none;
}

.hd-feedback-wrapper.is-feedback-style-clean.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-story_submission {
background: #ffffff;
border: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 14%, var(--hd-feedback-border));
box-shadow: 0 14px 30px rgba(15, 23, 42, 0.05);
}

.hd-feedback-wrapper.is-feedback-style-clean.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-story_submission .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-simple_feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-clean.is-mode-story_submission .hd-feedback-fixed-content {
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.03);
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission {
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
overflow: visible;
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-form-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-fixed-content,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-fixed-content {
margin: 0 0 16px;
padding: 0 0 14px;
border: 0;
border-bottom: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 14%, var(--hd-feedback-border));
border-radius: 0;
background: transparent;
box-shadow: none;
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-story-shell,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-identity-panel,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-fixed-content {
border-bottom-color: color-mix(in srgb, var(--hd-story-accent) 16%, var(--hd-story-border));
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-question {
padding: 16px 0;
border: 0;
border-radius: 0;
background: transparent;
box-shadow: none;
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-question + .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-question + .hd-feedback-question,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-question + .hd-feedback-question {
margin-top: 0;
padding-top: 16px;
border-top: 1px solid color-mix(in srgb, var(--hd-feedback-accent) 14%, var(--hd-feedback-border));
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-question + .hd-feedback-question {
border-top-color: color-mix(in srgb, var(--hd-story-accent) 16%, var(--hd-story-border));
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-question-description {
padding: 0;
border: 0;
border-radius: 0;
background: transparent;
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-status,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-status,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-status,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-progress,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-progress,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-progress,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-pagination,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-pagination,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-pagination,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-notice,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-notice,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-notice {
box-shadow: none;
}

.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback .hd-feedback-form-shell__meta,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback .hd-feedback-form-shell__meta,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission .hd-feedback-story-shell__meta {
gap: 8px 10px;
}

@media (max-width: 640px) {
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-feedback,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-simple_feedback,
.hd-feedback-wrapper.is-feedback-style-minimal.is-mode-story_submission {
padding: 0;
}
}


/* === isb-frontend.css === */
/* Inline Share Button - Frontend Styles */

/* Container Styles */
.isb-container {
    display: flex;
    align-items: center;
    gap: var(--isb-gap, 8px);
    margin: var(--isb-margin, 10px 0);
}

.isb-container.isb-align-left {
    justify-content: flex-start;
}

.isb-container.isb-align-center {
    justify-content: center;
}

.isb-container.isb-align-right {
    justify-content: flex-end;
}

/* Floating share rail */
.isb-share-container.isb-float-left,
.isb-share-container.isb-float-right {
    position: fixed;
    top: var(--isb-float-offset, 120px);
    z-index: 101;
    margin: 0;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: var(--isb-gap, 8px);
    padding: var(--isb-float-padding-top, 10px) 8px var(--isb-float-padding-bottom, 10px);
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid #eaeaea;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08); /* Distinct but subtle shadow */
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.22s ease, visibility 0.22s linear;
    will-change: top, opacity;
}

.isb-share-container.isb-float-left,
.isb-share-container.isb-float-right,
.isb-js-lock-visible,
.isb-structural-rail > .isb-share-container {
    gap: var(--isb-gap, 8px) !important;
    row-gap: var(--isb-gap, 8px) !important;
}

.isb-share-container.isb-float-left,
.isb-share-container.isb-float-right,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible {
    gap: 0 !important;
    row-gap: 0 !important;
}

.isb-share-container.isb-float-left > .isb-btn + .isb-btn,
.isb-share-container.isb-float-right > .isb-btn + .isb-btn,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible > .isb-btn + .isb-btn {
    margin-top: var(--isb-gap, 8px) !important;
}

.isb-share-container.isb-float-left.isb-auto-compact > .isb-btn + .isb-btn,
.isb-share-container.isb-float-right.isb-auto-compact > .isb-btn + .isb-btn,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible.isb-auto-compact > .isb-btn + .isb-btn {
    margin-top: var(--isb-gap, 6px) !important;
}

.isb-share-container.isb-float-left > .isb-total,
.isb-share-container.isb-float-right > .isb-total,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible > .isb-total {
    align-self: center;
    flex: 0 0 auto;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    width: var(--isb-share-actual-size, 32px) !important;
    min-width: var(--isb-share-actual-size, 32px) !important;
    height: calc(var(--isb-share-actual-size, 32px) * 0.82) !important;
    min-height: calc(var(--isb-share-actual-size, 32px) * 0.82) !important;
    line-height: 1 !important;
    text-align: center;
}

.isb-share-container.isb-float-left > .isb-total-right,
.isb-share-container.isb-float-right > .isb-total-right,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible > .isb-total-right {
    margin-top: var(--isb-gap, 8px) !important;
}

.isb-share-container.isb-float-left > .isb-total-left,
.isb-share-container.isb-float-right > .isb-total-left,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible > .isb-total-left {
    margin-bottom: var(--isb-gap, 8px) !important;
}

.isb-share-container.isb-float-left > .isb-total .isb-total-text,
.isb-share-container.isb-float-right > .isb-total .isb-total-text,
.isb-structural-rail > .isb-share-container.isb-js-lock-visible > .isb-total .isb-total-text {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100%;
    height: 100%;
    line-height: 1 !important;
    text-align: center;
}

.isb-share-container.isb-auto-compact {
    --isb-share-actual-size: 30px;
    --isb-gap: 6px;
    padding: 6px 6px 8px !important;
    border-radius: 10px;
}

.isb-share-container.isb-auto-compact .isb-total {
    display: none !important;
}

.isb-share-container.isb-auto-compact.isb-auto-compact-icon-only {
    --isb-share-actual-size: 28px;
    --isb-gap: 5px;
    padding: 6px !important;
    border-radius: 999px;
}

.isb-share-container.isb-auto-compact.isb-auto-compact-icon-only .isb-btn {
    box-shadow: none !important;
}

/* Keep hidden until JS computes final fixed position to avoid first-paint jump/FOUC. */

@media (max-width: 767px) {
    .isb-share-container[data-float-show-mobile="0"] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .isb-share-container[data-float-show-tablet="0"] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

@media (min-width: 992px) {
    .isb-share-container[data-float-show-desktop="0"] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

.isb-share-container.isb-float-left {
    left: 14px;
}

.isb-share-container.isb-float-right {
    right: 14px;
}

/* Button Base Styles */
.isb-btn {
    color: inherit;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    border: 1px solid transparent;
    text-decoration: none !important;
    transition: background-color 0.2s, opacity 0.2s, color 0.2s, border-color 0.2s, border-radius 0.2s;
    box-sizing: border-box;
    vertical-align: middle;
    flex-shrink: 0;
}

.isb-btn:hover {
    opacity: 0.85;
}

.isb-btn i {
    line-height: 1;
}

.isb-btn.isb-has-icon-fallback > i[class*="fa-"] {
    display: none;
}

.isb-fa-ready .isb-btn.isb-has-icon-fallback > i[class*="fa-"] {
    display: inline-block;
}

.isb-btn.isb-has-icon-fallback .isb-icon-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1em;
    min-height: 1em;
    font-family: Arial, Helvetica, sans-serif !important;
    font-style: normal;
    font-weight: 800;
    letter-spacing: -0.04em;
    line-height: 1;
    text-rendering: geometricPrecision;
}

.isb-icon-fallback-svg {
    display: block;
    width: 1em;
    height: 1em;
    fill: currentColor;
    color: currentColor;
    overflow: visible;
}

.isb-icon-fallback-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.isb-fa-ready .isb-btn.isb-has-icon-fallback .isb-icon-fallback {
    display: none;
}

.isb-fa-missing .isb-btn.isb-has-icon-fallback > i[class*="fa-"] {
    display: none;
}

.isb-btn.isb-brand-line .isb-icon-fallback-text { font-size: 0.44em; letter-spacing: -0.02em; }
.isb-btn.isb-brand-copy .isb-icon-fallback-text { font-size: 0.38em; letter-spacing: -0.02em; }
.isb-btn.isb-brand-linkedin .isb-icon-fallback-text { font-size: 0.72em; letter-spacing: -0.08em; }
.isb-btn.isb-brand-vk .isb-icon-fallback-text { font-size: 0.62em; letter-spacing: -0.08em; }
.isb-btn.isb-brand-whatsapp .isb-icon-fallback-text,
.isb-btn.isb-brand-telegram .isb-icon-fallback-text { font-size: 0.54em; letter-spacing: -0.08em; }

.isb-btn.isb-shape-square {
    border-radius: 4px;
}

/* Share Button Specific Styles */
.isb-btn.isb-share {
    width: var(--isb-share-actual-size, 32px) !important;
    height: var(--isb-share-actual-size, 32px) !important;
    min-width: var(--isb-share-actual-size, 32px) !important;
    min-height: var(--isb-share-actual-size, 32px) !important;
    font-size: calc(var(--isb-share-actual-size, 32px) * 0.5);
}

.isb-btn-label {
    display: none;
}

.isb-share-has-labels {
    flex-wrap: wrap;
    row-gap: 10px;
}

.isb-share-has-labels .isb-btn.isb-share {
    width: auto !important;
    min-width: var(--isb-share-actual-size, 32px) !important;
    padding-inline: calc(var(--isb-share-actual-size, 32px) * 0.3);
    gap: calc(var(--isb-share-actual-size, 32px) * 0.16);
    max-width: 100%;
}

.isb-share-has-labels .isb-btn-label {
    display: inline-block;
    font-size: clamp(12px, calc(var(--isb-share-actual-size, 32px) * 0.28), 14px);
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
}

.isb-btn.isb-share.isb-shape-rounded {
    border-radius: calc(var(--isb-share-actual-size, 32px) * 0.25);
}

.isb-btn.isb-share.isb-shape-pill {
    border-radius: calc(var(--isb-share-actual-size, 32px) * 0.5);
}

@media (max-width: 767px) {
    .isb-share-has-labels {
        gap: 8px;
    }

    .isb-share-has-labels .isb-btn.isb-share {
        padding-inline: calc(var(--isb-share-actual-size, 32px) * 0.22);
    }

    .isb-share-has-labels .isb-btn-label {
        font-size: 12px;
    }
}

.isb-btn.isb-share .isb-copy-feedback {
    font-size: calc(var(--isb-share-actual-size, 32px) * 0.35);
    font-weight: 800;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: inherit;
    color: #fff !important;
    animation: isb-bounce-in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.isb-btn.isb-copy-active,
.isb-btn.isb-copy-active.isb-copy-active {
    background-color: #28a745 !important;
    border-color: #28a745 !important;
    transform: scale(1.05);
}

@keyframes isb-bounce-in {
    0% { transform: scale(0.5); opacity: 0; }
    100% { transform: scale(1); opacity: 1; }
}

/* Profile Button Specific Styles */
.isb-btn.isb-profile {
    width: var(--isb-profile-actual-size, 32px) !important;
    height: var(--isb-profile-actual-size, 32px) !important;
    min-width: var(--isb-profile-actual-size, 32px) !important;
    min-height: var(--isb-profile-actual-size, 32px) !important;
    font-size: calc(var(--isb-profile-actual-size, 32px) * 0.5);
    text-decoration: none !important;
}

.isb-btn.isb-profile.isb-shape-rounded {
    border-radius: calc(var(--isb-profile-actual-size, 32px) * 0.25);
}

.isb-btn.isb-profile.isb-shape-pill {
    border-radius: calc(var(--isb-profile-actual-size, 32px) * 0.5);
}

/* Color Schemes */
.isb-btn.isb-scheme-default {
    background-color: #f0f0f0 !important;
    border-color: #ddd !important;
}

.isb-btn.isb-scheme-default i {
    color: #333 !important;
}

.isb-btn.isb-scheme-default .isb-icon-fallback {
    color: #333 !important;
}

.isb-btn.isb-scheme-default:hover {
    background-color: #e2e2e2 !important;
    border-color: #ccc !important;
}

.isb-btn.isb-scheme-monochrome_dark {
    background-color: #343a40 !important;
    border-color: #343a40 !important;
}

.isb-btn.isb-scheme-monochrome_dark i {
    color: #fff !important;
}

.isb-btn.isb-scheme-monochrome_dark .isb-icon-fallback {
    color: #fff !important;
}

.isb-btn.isb-scheme-monochrome_dark:hover {
    background-color: #23272b !important;
    border-color: #23272b !important;
}

.isb-btn.isb-scheme-monochrome_light {
    background-color: #f8f9fa !important;
    border: 1px solid #dee2e6 !important;
}

.isb-btn.isb-scheme-monochrome_light i {
    color: #343a40 !important;
}

.isb-btn.isb-scheme-monochrome_light .isb-icon-fallback {
    color: #343a40 !important;
}

.isb-btn.isb-scheme-monochrome_light:hover {
    background-color: #e9ecef !important;
    border-color: #ced4da !important;
}

/* Count Badge Styles */
.isb-badge {
    position: absolute;
    top: -5px;
    right: -5px;
    background-color: #e33;
    color: #fff;
    font-size: calc(var(--isb-share-actual-size, 32px) * 0.3);
    padding: calc(var(--isb-share-actual-size, 32px) * 0.05) calc(var(--isb-share-actual-size, 32px) * 0.15);
    border-radius: calc(var(--isb-share-actual-size, 32px) * 0.3);
    line-height: 1.2;
    min-width: calc(var(--isb-share-actual-size, 32px) * 0.2);
    text-align: center;
    font-weight: 700;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);
}

/* Total Count Styles */
.isb-total {
    pointer-events: none;
    font-weight: 700;
    color: #555;
    margin: 0 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    text-align: center;
    width: calc(var(--isb-share-actual-size, 32px) * 0.8);
    height: calc(var(--isb-share-actual-size, 32px) * 0.8);
    font-size: calc(var(--isb-share-actual-size, 32px) * 0.35);
    line-height: 1;
    padding: 2px;
    box-shadow: 0 1px 6px rgba(0, 0, 0, 0.15);
    z-index: 10;
}

.isb-total::before,
.isb-total::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
}

.isb-total-left {
    order: -1;
}

.isb-total-left::before {
    right: -7px;
    border-left: 6px solid #ccc;
}

.isb-total-left::after {
    right: -5px;
    border-left: 5px solid #fff;
    border-top-width: 5px;
    border-bottom-width: 5px;
}

.isb-total-right {
    order: 100;
}

.isb-total-right::before {
    left: -7px;
    border-right: 6px solid #ccc;
}

.isb-total-right::after {
    left: -5px;
    border-right: 5px solid #fff;
    border-top-width: 5px;
    border-bottom-width: 5px;
}

.isb-total-right .isb-total-icon {
    margin-bottom: calc(var(--isb-share-actual-size, 32px) * 0.05);
    display: block;
}

.isb-total-right .isb-total-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 100%;
    line-height: 1;
}

/* Floating vertical rail: combined_right total should point upward to buttons above */
@media (min-width: 783px) {
    .isb-share-container.isb-float-left .isb-total::before,
    .isb-share-container.isb-float-left .isb-total::after,
    .isb-share-container.isb-float-right .isb-total::before,
    .isb-share-container.isb-float-right .isb-total::after {
        right: auto;
        bottom: auto;
    }

    .isb-share-container.isb-float-left .isb-total-right::before,
    .isb-share-container.isb-float-right .isb-total-right::before {
        top: -7px;
        left: 50%;
        transform: translateX(-50%);
        border-top: 0;
        border-bottom: 6px solid #ccc;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
    }

    .isb-share-container.isb-float-left .isb-total-right::after,
    .isb-share-container.isb-float-right .isb-total-right::after {
        top: -5px;
        left: 50%;
        transform: translateX(-50%);
        border-top: 0;
        border-bottom: 5px solid #fff;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }

    .isb-share-container.isb-float-left .isb-total-left::before,
    .isb-share-container.isb-float-right .isb-total-left::before {
        top: auto;
        bottom: -7px;
        left: 50%;
        transform: translateX(-50%);
        border-top: 6px solid #ccc;
        border-bottom: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
    }

    .isb-share-container.isb-float-left .isb-total-left::after,
    .isb-share-container.isb-float-right .isb-total-left::after {
        top: auto;
        bottom: -5px;
        left: 50%;
        transform: translateX(-50%);
        border-top: 5px solid #fff;
        border-bottom: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }
}

@media (max-width: 782px) {
    .isb-share-container.isb-float-left,
    .isb-share-container.isb-float-right {
        left: 50%;
        right: auto;
        top: auto;
        bottom: 14px;
        transform: translateX(-50%);
        flex-direction: row;
        background: rgba(255, 255, 255, 0.94);
        border: 1px solid #dcdcde;
        border-radius: 999px;
        padding: 8px 10px;
        box-shadow: 0 6px 22px rgba(0, 0, 0, 0.16);
    }
}

/* Brand Specific Styles */
.isb-btn.isb-scheme-brand_solid.isb-brand-copy { background-color: #777777 !important; border-color: #777777 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-copy i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-copy { background-color: transparent !important; border: 1px solid #777777 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-copy i { color: #777777 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-copy:hover { background-color: #777777 !important; border-color: #777777 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-copy:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-x { background-color: #000000 !important; border-color: #000000 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-x i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-x { background-color: transparent !important; border: 1px solid #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-x i { color: #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-x:hover { background-color: #000000 !important; border-color: #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-x:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-bluesky { background-color: #0285FF !important; border-color: #0285FF !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-bluesky i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-bluesky { background-color: transparent !important; border: 1px solid #0285FF !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-bluesky i { color: #0285FF !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-bluesky:hover { background-color: #0285FF !important; border-color: #0285FF !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-bluesky:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-native { background-color: #2563EB !important; border-color: #2563EB !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-native i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-native { background-color: transparent !important; border: 1px solid #2563EB !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-native i { color: #2563EB !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-native:hover { background-color: #2563EB !important; border-color: #2563EB !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-native:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-qrcode { background-color: #334155 !important; border-color: #334155 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-qrcode i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-qrcode { background-color: transparent !important; border: 1px solid #334155 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-qrcode i { color: #334155 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-qrcode:hover { background-color: #334155 !important; border-color: #334155 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-qrcode:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-fb { background-color: #1877F2 !important; border-color: #1877F2 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-fb i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-fb { background-color: transparent !important; border: 1px solid #1877F2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-fb i { color: #1877F2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-fb:hover { background-color: #1877F2 !important; border-color: #1877F2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-fb:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-threads { background-color: #000000 !important; border-color: #000000 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-threads i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-threads { background-color: transparent !important; border: 1px solid #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-threads i { color: #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-threads:hover { background-color: #000000 !important; border-color: #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-threads:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-ig { background-color: #E1306C !important; border-color: #E1306C !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-ig i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-ig { background-color: transparent !important; border: 1px solid #E1306C !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-ig i { color: #E1306C !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-ig:hover { background-color: #E1306C !important; border-color: #E1306C !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-ig:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-line { background-color: #00C300 !important; border-color: #00C300 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-line i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-line { background-color: transparent !important; border: 1px solid #00C300 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-line i { color: #00C300 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-line:hover { background-color: #00C300 !important; border-color: #00C300 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-line:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-linkedin { background-color: #0077B5 !important; border-color: #0077B5 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-linkedin i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-linkedin { background-color: transparent !important; border: 1px solid #0077B5 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-linkedin i { color: #0077B5 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-linkedin:hover { background-color: #0077B5 !important; border-color: #0077B5 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-linkedin:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-pinterest { background-color: #E60023 !important; border-color: #E60023 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-pinterest i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-pinterest { background-color: transparent !important; border: 1px solid #E60023 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-pinterest i { color: #E60023 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-pinterest:hover { background-color: #E60023 !important; border-color: #E60023 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-pinterest:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-reddit { background-color: #FF4500 !important; border-color: #FF4500 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-reddit i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-reddit { background-color: transparent !important; border: 1px solid #FF4500 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-reddit i { color: #FF4500 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-reddit:hover { background-color: #FF4500 !important; border-color: #FF4500 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-reddit:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-tumblr { background-color: #36465D !important; border-color: #36465D !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-tumblr i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-tumblr { background-color: transparent !important; border: 1px solid #36465D !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-tumblr i { color: #36465D !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-tumblr:hover { background-color: #36465D !important; border-color: #36465D !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-tumblr:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-vk { background-color: #4680C2 !important; border-color: #4680C2 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-vk i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-vk { background-color: transparent !important; border: 1px solid #4680C2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-vk i { color: #4680C2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-vk:hover { background-color: #4680C2 !important; border-color: #4680C2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-vk:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-whatsapp { background-color: #25D366 !important; border-color: #25D366 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-whatsapp i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-whatsapp { background-color: transparent !important; border: 1px solid #25D366 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-whatsapp i { color: #25D366 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-whatsapp:hover { background-color: #25D366 !important; border-color: #25D366 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-whatsapp:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-telegram { background-color: #0088CC !important; border-color: #0088CC !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-telegram i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-telegram { background-color: transparent !important; border: 1px solid #0088CC !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-telegram i { color: #0088CC !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-telegram:hover { background-color: #0088CC !important; border-color: #0088CC !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-telegram:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-email { background-color: #555555 !important; border-color: #555555 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-email i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-email { background-color: transparent !important; border: 1px solid #555555 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-email i { color: #555555 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-email:hover { background-color: #555555 !important; border-color: #555555 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-email:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid.isb-brand-youtube { background-color: #FF0000 !important; border-color: #FF0000 !important; }
.isb-btn.isb-scheme-brand_solid.isb-brand-youtube i { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-youtube { background-color: transparent !important; border: 1px solid #FF0000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-youtube i { color: #FF0000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-youtube:hover { background-color: #FF0000 !important; border-color: #FF0000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-youtube:hover i { color: #fff !important; }

.isb-btn.isb-scheme-brand_solid .isb-icon-fallback { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline:hover .isb-icon-fallback { color: #fff !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-copy .isb-icon-fallback { color: #777777 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-x .isb-icon-fallback { color: #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-bluesky .isb-icon-fallback { color: #0285FF !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-native .isb-icon-fallback { color: #2563EB !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-qrcode .isb-icon-fallback { color: #334155 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-fb .isb-icon-fallback { color: #1877F2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-threads .isb-icon-fallback { color: #000000 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-ig .isb-icon-fallback { color: #E1306C !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-line .isb-icon-fallback { color: #00C300 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-linkedin .isb-icon-fallback { color: #0077B5 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-pinterest .isb-icon-fallback { color: #E60023 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-reddit .isb-icon-fallback { color: #FF4500 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-tumblr .isb-icon-fallback { color: #36465D !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-vk .isb-icon-fallback { color: #4680C2 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-whatsapp .isb-icon-fallback { color: #25D366 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-telegram .isb-icon-fallback { color: #0088CC !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-email .isb-icon-fallback { color: #555555 !important; }
.isb-btn.isb-scheme-brand_outline.isb-brand-youtube .isb-icon-fallback { color: #FF0000 !important; }
.isb-btn.isb-scheme-brand_outline:hover .isb-icon-fallback { color: #fff !important; }

body.isb-qrcode-modal-open {
    overflow: hidden;
}

.isb-qrcode-modal {
    position: fixed;
    inset: 0;
    z-index: 99999;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, visibility 0.18s ease;
}

.isb-qrcode-modal.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.isb-qrcode-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, 0.66);
    backdrop-filter: blur(4px);
}

.isb-qrcode-modal__dialog {
    position: relative;
    z-index: 1;
    width: min(92vw, 420px);
    margin: min(10vh, 72px) auto 0;
    padding: 24px 24px 22px;
    border-radius: 20px;
    background: #ffffff;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28);
    color: #0f172a;
    text-align: center;
}

.isb-qrcode-modal__close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 999px;
    background: #e2e8f0;
    color: #334155;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
}

.isb-qrcode-modal__close:hover {
    background: #cbd5e1;
}

.isb-qrcode-modal__title {
    margin: 0;
    font-size: 1.15rem;
    line-height: 1.35;
}

.isb-qrcode-modal__body {
    display: grid;
    gap: 12px;
    margin-top: 14px;
}

.isb-qrcode-modal__image {
    width: min(220px, 62vw);
    height: auto;
    margin: 0 auto;
    border-radius: 14px;
    background: #ffffff;
    border: 1px solid #e2e8f0;
    padding: 14px;
    box-sizing: border-box;
}

.isb-qrcode-modal__caption {
    margin: 0;
    font-size: 0.94rem;
    font-weight: 600;
    line-height: 1.5;
}

.isb-qrcode-modal__url {
    color: #2563eb;
    font-size: 0.88rem;
    line-height: 1.5;
    word-break: break-all;
    text-decoration: none;
}

.isb-qrcode-modal__url:hover {
    text-decoration: underline;
}

.isb-qrcode-modal__note {
    margin: 0;
    color: #475569;
    font-size: 0.8rem;
    line-height: 1.6;
}

/* Single Visual Template - Hero Layout */
.si-visual-hero {
    position: relative;
    width: 100%;
    min-height: 400px;
    margin-bottom: 30px;
    background-color: #000;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.si-visual-hero.has-hero-image {
    color: #fff;
    min-height: 550px; /* Fixed height to prevent stretching */
    max-height: 700px;
}

.si-visual-hero.no-hero-image {
    background: #f8f9fa;
    color: #1a1a1a;
    justify-content: center;
    padding: 100px 20px;
    border-bottom: 2px solid #eee;
    min-height: 300px;
}

.si-visual-hero .hero-image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

/* Enhanced Gradient for better readability */
.si-visual-hero.has-hero-image .hero-image-overlay::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, 
        rgba(0,0,0,0.2) 0%, 
        transparent 30%, 
        transparent 60%, 
        rgba(0,0,0,0.6) 80%, 
        rgba(0,0,0,0.9) 100%);
    pointer-events: none;
}

.si-visual-hero .hero-bg-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 1.5s ease-out; /* Smooth entrance/hover zoom */
}

.si-visual-hero:hover .hero-bg-img {
    transform: none;
}

.si-visual-hero .hero-text-content {
    position: relative;
    z-index: 2;
    padding: 0 30px 45px; /* Reduced bottom padding */
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    box-sizing: border-box;
}

.si-visual-hero.no-hero-image .hero-text-content {
    padding: 0;
    max-width: 800px;
    text-align: center;
}

/* Fluid Typography for Hero Title - More Compact */
.si-visual-hero .si-title-wrap h1.entry-title {
    font-size: clamp(1.4rem, 4vw, 2.5rem);
    line-height: 1.25;
    margin: 15px 0;
    font-weight: 800;
    letter-spacing: -0.02em;
    text-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

.si-visual-hero.no-hero-image .si-title-wrap h1.entry-title {
    color: #1a1a1a;
    text-shadow: none;
}

.si-visual-hero .si-meta-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    font-size: 15px;
    font-weight: 500;
}

.si-visual-hero .byline {
    display: flex;
    align-items: center;
    gap: 8px;
    text-shadow: 0 1px 4px rgba(0,0,0,0.5);
}

.si-visual-hero.no-hero-image .byline {
    text-shadow: none;
    color: #666;
}

.si-visual-hero .byline a {
    color: inherit;
    text-decoration: none;
    transition: opacity 0.2s;
}

.si-visual-hero .byline a:hover {
    opacity: 0.7;
    text-decoration: underline;
}

.si-visual-hero .hero-caption-box {
    position: absolute;
    bottom: 20px;
    right: 30px;
    z-index: 3;
    font-size: 11px;
    opacity: 0.6;
    font-style: italic;
    color: #fff;
}

.si-visual-hero .hero-caption-box.si-featured-caption--below {
    left: 30px;
    right: 30px;
    bottom: 20px;
    padding: 8px 10px;
    background: rgba(255, 255, 255, 0.9);
    color: #333;
    opacity: 1;
    font-style: normal;
}

.si-visual-hero .hero-caption-box.si-featured-caption--minimal {
    background: transparent;
    color: rgba(255, 255, 255, 0.82);
    opacity: 1;
    font-style: normal;
}

/* Single 2-3 - apply a subset of visual hero styling */
.si-23-visual-inspired #arcs-single-filter.si-23-visual-media figure {
    position: relative;
    overflow: hidden;
    /*border-radius: 16px;*/
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media figure.si-featured-media-figure--has-caption.si-featured-media-figure--caption-overlay::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.02) 35%, rgba(0, 0, 0, 0.45) 100%);
    pointer-events: none;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media img {
    transition: transform 1.2s ease;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media:hover img {
    transform: none;
}

.si-23-visual-inspired #arcs-single-filter.si-23-visual-media figcaption {
    z-index: 2;
}

@media (max-width: 991px) {
    .si-visual-hero .hero-text-content {
        padding: 0 25px 35px;
    }
}

@media (max-width: 767px) {
    .si-visual-hero {
        max-width: 100vw; /* Ensure no horizontal stretching */
        box-sizing: border-box;
    }
    .si-visual-hero.has-hero-image {
        min-height: 400px;
        max-height: 500px;
    }
    .si-visual-hero .hero-text-content {
        padding: 0 20px 30px;
    }
    .si-visual-hero .si-meta-wrap {
        gap: 15px;
        font-size: 13px;
    }
}

/* Article Rail Layout Mode (專業分欄模式 - Stable Version) */
@media (min-width: 992px) {
    /*
     * CLS guard:
     * article_rail is moved into the content column by JS. Reserve the same
     * rail gutter before JS runs so `.isb-rail-active` does not push content
     * after first paint. Keep this CSS-only and scoped to the owner markup.
     */
    @supports selector(:has(*)) {
        #si-single-content.entry-content:has(.isb-share-container[data-float-start="article_rail"][data-float-show-desktop="1"]),
        .entry-content:has(.isb-share-container[data-float-start="article_rail"][data-float-show-desktop="1"]) {
            display: block !important;
            position: relative !important;
            padding-left: calc(var(--isb-rail-width, 100px) + var(--isb-rail-content-gap, 10px)) !important;
            box-sizing: border-box !important;
            min-height: 200px;
            max-width: calc(min(var(--hd-content-max-width-active, 1000px), 100%) + var(--isb-rail-width, 100px) + var(--isb-rail-content-gap, 10px)) !important;
            margin-left: auto !important;
            margin-right: auto !important;
            width: 100% !important;
            overflow: visible !important;
        }

        #si-single-content.entry-content:has(.isb-share-container.isb-float-right[data-float-start="article_rail"][data-float-show-desktop="1"]),
        .entry-content:has(.isb-share-container.isb-float-right[data-float-start="article_rail"][data-float-show-desktop="1"]) {
            padding-left: 0 !important;
            padding-right: calc(var(--isb-rail-width, 100px) + var(--isb-rail-content-gap, 10px)) !important;
        }
    }

    .isb-rail-active {
        display: block !important;
        position: relative !important;
        /* Padding matches the rail width */
        padding-left: calc(var(--isb-rail-width, 100px) + var(--isb-rail-content-gap, 10px)) !important;
        box-sizing: border-box !important;
        min-height: 200px;
        /* Ensure it doesn't stretch past content width on extreme screens */
        max-width: calc(min(var(--hd-content-max-width-active, 1000px), 100%) + var(--isb-rail-width, 100px) + var(--isb-rail-content-gap, 10px)) !important;
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
        /* CRITICAL: Sticky won't work if any parent has overflow: hidden */
        /* CRITICAL: Sticky won't work if any parent has overflow: hidden */
        overflow: visible !important;
    }

    .isb-rail-active[data-float-side="right"] {
        padding-left: 0 !important;
        padding-right: calc(var(--isb-rail-width, 100px) + var(--isb-rail-content-gap, 10px)) !important;
    }

    .isb-rail-active.isb-rail-compact-active {
        padding-left: calc(var(--isb-rail-width, 100px) - 12px) !important;
        max-width: calc(min(var(--hd-content-max-width-active, 1000px), 100%) + var(--isb-rail-width, 100px) - 12px) !important;
    }

    .isb-rail-active.isb-rail-compact-active[data-float-side="right"] {
        padding-left: 0 !important;
        padding-right: calc(var(--isb-rail-width, 100px) - 12px) !important;
    }

    .isb-rail-active.isb-rail-icon-only-active {
        padding-left: calc(var(--isb-rail-width, 100px) - 24px) !important;
        max-width: calc(min(var(--hd-content-max-width-active, 1000px), 100%) + var(--isb-rail-width, 100px) - 24px) !important;
    }

    .isb-rail-active.isb-rail-icon-only-active[data-float-side="right"] {
        padding-left: 0 !important;
        padding-right: calc(var(--isb-rail-width, 100px) - 24px) !important;
    }

    /* All standard content elements remain in their natural flow. */
    .isb-rail-active > *:not(.isb-structural-rail):not(.alignleft):not(.alignright) {
        width: 100% !important;
        max-width: none !important;
        box-sizing: border-box !important;
    }

    .isb-structural-rail {
        position: absolute !important;
        top: var(--isb-rail-gap-top, 20px) !important;
        bottom: var(--isb-rail-gap-bottom, 20px) !important;
        left: 0 !important;
        width: calc(var(--isb-rail-width, 100px) - 20px) !important;
        /* height auto-fills between top and bottom; no explicit 100% needed */
        height: auto !important;
        min-height: 0 !important;
        z-index: 110 !important;
        pointer-events: none !important;
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        flex-direction: column !important;
        text-align: center;
    }


    .isb-rail-active[data-float-side="right"] .isb-structural-rail {
        left: auto !important;
        right: 0 !important;
    }


    /* The actual container inside the rail - handled by JS for stable movement */
    .isb-structural-rail > .isb-share-container {
        position: relative !important; /* Managed by JS transform */
        top: 0 !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        text-align: center;
        transform: translateY(0);
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        margin: 0 !important;
        width: 100% !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        z-index: 111 !important;
        will-change: transform;
        transform: translate3d(0, 0, 0); /* GPU Acceleration */
        transition: transform 0.4s cubic-bezier(0.23, 1, 0.32, 1); /* Premium inertia smoothness */
    }
}

/* [ARTICLE RAIL] JS Lockdown - Force visibility no matter what JS does */
.isb-js-lock-visible {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    display: inline-flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: var(--isb-gap, 8px) !important;
    row-gap: var(--isb-gap, 8px) !important;
}

body.unified-v8-slideout-open .isb-rail-active .isb-structural-rail,
body.unified-v8-slideout-open .isb-rail-active .isb-structural-rail > .isb-share-container,
body.unified-v8-search-overlay-open .isb-rail-active .isb-structural-rail,
body.unified-v8-search-overlay-open .isb-rail-active .isb-structural-rail > .isb-share-container {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

@media (max-width: 767px) {
    .isb-qrcode-modal__dialog {
        width: min(94vw, 380px);
        margin-top: 8vh;
        padding: 20px 18px 18px;
        border-radius: 18px;
    }

    .isb-qrcode-modal__image {
        width: min(208px, 70vw);
        padding: 12px;
    }
}


/* === frontend-related-posts.css === */
/*
 * ========================================================================
 * [智慧延伸閱讀] 樣式庫 v11.0 (Optimized & Refactored)
 * - [OPTIMIZED] 合併了智慧模式 (Smart Mode) 和日式時間軸 (P-Timeline) 之間重複的 CSS 規則。
 * - [REFACTORED] 現在 ptimeline 直接繼承通用的 .item-content-wrapper 佈局樣式，只保留其獨有的外觀定義。
 * - [MAINTAINED] 所有樣式的外觀和功能保持不變。
 * ========================================================================
 */

/* ========================================================================
 * PART A: 通用基礎樣式 (Foundation & Globals)
 * ======================================================================== */
.hd-related-posts-container {
--hd-related-radius-sm: 6px;
--hd-related-radius-md: 10px;
--hd-related-spacing-sm: 0.75rem;
--hd-related-spacing-md: 1.25rem;
--hd-related-shadow-light: 0 2px 4px rgba(0, 0, 0, 0.05);
--hd-related-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
--hd-related-border-color: #e5e7eb;
--hd-related-text-primary-default: #1f2937;
--hd-related-text-secondary-default: #6b7280;
--hd-related-accent-color-default: #4f46e5;
--hd-related-noona-hover-default: #22a2eb;
--timeline-card-bg: var(--hd-related-card-bg, #ffffff);
--timeline-card-border: var(--hd-related-card-border, #eeeeee);
--timeline-card-padding: 1rem;
--hd-related-title-color: var(--hd-related-text-primary, var(--hd-related-text-primary-default));
--hd-related-link-color: var(--hd-related-text-primary, var(--hd-related-text-primary-default));
--hd-related-hover-color: var(--hd-related-accent-color, var(--hd-related-accent-color-default));
--hd-related-meta-color: var(--hd-related-text-secondary, var(--hd-related-text-secondary-default));
--hd-related-accent-final-color: var(--hd-related-accent-color, var(--hd-related-accent-color-default));
clear: both;
width: 100%;
margin: 30px auto;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
box-sizing: border-box;
background-color: var(--hd-related-bg, transparent);
}
.hd-related-posts-container *, .hd-related-posts-container *::before, .hd-related-posts-container *::after {
box-sizing: border-box;
}
.hd-related-posts-container a {
text-decoration: none;
transition: all 0.2s ease-in-out;
color: var(--hd-related-link-color);
}
.hd-related-posts-container a:hover {
color: var(--hd-related-hover-color);
}
.hd-related-posts-header {
color: var(--hd-related-title-color);
font-weight: 700;
font-size: 1.25rem;
margin-bottom: 1rem;
padding-bottom: 0.5rem;
border-bottom: 2px solid var(--hd-related-border-color);
}
.related-post-meta {
color: var(--hd-related-meta-color);
font-size: 0.85em;
margin-top: 4px;
}
/* Stop Zoom on Hover */
.hd-related--disable-zoom .related-card-thumbnail img,
.hd-related--disable-zoom .item-image img {
    transform: none !important;
}
.related-card-placeholder {
width: 100%;
height: 100%;
background-color: #e5e7eb;
display: inline-block;
}
.hd-related-posts-container .related-item,
.hd-related-posts-container .ptimeline-item {
    margin: 0 !important; /* 阻斷 #si-single-content li 的 margin: 10px auto 影響 */
    margin-bottom: 0.5em !important;
    text-align: left;
}
.hd-related-posts-container .related-item:last-child {
    margin-bottom: 0 !important;
}


/* ========================================================================
 * PART B: 列表符號控制 (List Style Control) - v2.0 FIXED
 * ======================================================================== */

/* 只重置用於佈局的「第一層」列表 */
.hd-related-posts-container .hd-related-posts-body > ul,
.hd-related-posts-container .hd-related-posts-body > ol {
list-style: none;
padding-left: 0;
margin-left: 0;
margin-top: 0;
margin-bottom: 0;
}

/* 為內容中「巢狀」的列表恢復瀏覽器預設樣式 */
.hd-related-posts-container .related-item ul,
.hd-related-posts-container .timeline-item-inner-container ul,
.hd-related-posts-container .ptimeline-item ul {
list-style: disc; /* 恢復實心圓點 */
padding-left: 40px; /* 恢復預設縮排 */
margin: 1em 0; /* 恢復段落間距 */
}
.hd-related-posts-container .related-item ol,
.hd-related-posts-container .timeline-item-inner-container ol,
.hd-related-posts-container .ptimeline-item ol {
list-style: decimal; /* 恢復數字編號 */
padding-left: 40px; /* 恢復預設縮排 */
margin: 1em 0; /* 恢復段落間距 */
}

/* 確保巢狀列表的項目間距正常 */
.hd-related-posts-container .related-item ul li,
.hd-related-posts-container .related-item ol li,
.hd-related-posts-container .timeline-item-inner-container ul li,
.hd-related-posts-container .timeline-item-inner-container ol li,
.hd-related-posts-container .ptimeline-item ul li,
.hd-related-posts-container .ptimeline-item ol li {
margin-bottom: 0.5em;
display: list-item; /* 確保 li 元素表現為列表項目 */
padding-left: 0;
}

.hd-related-posts-container.has-list-style-disc .hd-related-posts-body > ul,
.hd-related-posts-container.has-list-style-circle .hd-related-posts-body > ul,
.hd-related-posts-container.has-list-style-square .hd-related-posts-body > ul {
padding-left: 1.8em !important;
}
.hd-related-posts-container.has-list-style-disc .related-item,
.hd-related-posts-container.has-list-style-circle .related-item,
.hd-related-posts-container.has-list-style-square .related-item {
list-style-position: inside;
display: list-item;
}
.hd-related-posts-container.has-list-style-disc .related-item { list-style-type: disc !important; }
.hd-related-posts-container.has-list-style-circle .related-item { list-style-type: circle !important; }
.hd-related-posts-container.has-list-style-square .related-item { list-style-type: square !important; }
.hd-related-posts-container.has-list-style-ordered .related-item,
.hd-related-posts-container.has-list-style-roman .related-item,
.hd-related-posts-container.has-list-style-alpha .related-item,
.hd-related-posts-container.has-list-style-circled-decimal .related-item {
display: flex;
align-items: baseline;
gap: 0.8em;
margin-bottom: 0.75em;
counter-increment: hd-list-counter;
}
.hd-related-posts-container.has-list-style-ordered .related-item a,
.hd-related-posts-container.has-list-style-roman .related-item a,
.hd-related-posts-container.has-list-style-alpha .related-item a,
.hd-related-posts-container.has-list-style-circled-decimal .related-item a {
flex-grow: 1;
min-width: 0;
}
.hd-related-posts-container.has-list-style-ordered .related-item::before,
.hd-related-posts-container.has-list-style-roman .related-item::before,
.hd-related-posts-container.has-list-style-alpha .related-item::before,
.hd-related-posts-container.has-list-style-circled-decimal .related-item::before {
content: counter(hd-list-counter) ".";
flex-shrink: 0;
font-weight: 600;
color: var(--hd-related-accent-final-color);
}
.hd-related-posts-container.has-list-style-roman .related-item::before { content: counter(hd-list-counter, upper-roman) "."; }
.hd-related-posts-container.has-list-style-alpha .related-item::before { content: counter(hd-list-counter, upper-alpha) "."; }
.hd-related-posts-container.has-list-style-circled-decimal .related-item::before {
content: counter(hd-list-counter);
display: inline-flex;
align-items: center;
justify-content: center;
width: 1.55em;
height: 1.55em;
border: 1px solid currentColor;
border-radius: 999px;
font-size: 0.82em;
line-height: 1;
}
.style-smart-timeline .related-item, .style-cards .related-item, .style-slider .related-item, .style-image-left .related-item, .style-compact .related-item, .hd-related-posts-container.has-list-style-none .related-item {
display: block !important;
list-style-type: none !important;
}


/* ========================================================================
 * PART C: 傳統列表樣式 (Traditional List Styles)
 * ======================================================================== */

/* --- 1. 經典樣式 (Noona) - Modernized for Visual Excellence --- */
.hd-related-posts-container.style-noona {
    display: block;
    clear: both;
    width: 100%;
    max-width: 853px;
    margin: 40px auto;
    padding: 30px 0;
    border: none;
    border-radius: var(--hd-related-radius-md);
    background: linear-gradient(to bottom right, #f9fafb, #f3f4f6);
    box-shadow: var(--hd-related-shadow-light);
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}

/* Subtle accent line at the top for a premium feel */
.hd-related-posts-container.style-noona::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 4px;
    height: 100%;
    background-color: var(--hd-related-accent-final-color);
    opacity: 0.8;
}

.style-noona .hd-related-posts-header {
    margin: 0 40px 20px 40px;
    padding: 0 0 10px 0;
    color: var(--hd-related-title-color, #111827);
    font-weight: 800;
    font-size: 1.35rem;
    letter-spacing: -0.025em;
    border-bottom: 2px solid rgba(0, 0, 0, 0.05);
}

.style-noona .hd-related-posts-body {
    font-size: 1.05rem;
    margin: 0 25px;
    padding: 0 15px;
}

.style-noona .hd-related-posts-body ol,
.style-noona .hd-related-posts-body ul {
    margin: 0 !important;
    padding-left: 1.5rem !important;
}

.style-noona .related-item {
    font-size: 1.05rem;
    margin: 12px 0 !important; /* 確保不被全域 li 樣式覆蓋 */
    color: var(--hd-related-text-secondary-default);
    line-height: 1.6;
}

.style-noona .related-item a {
    color: var(--hd-related-link-color, #374151);
    /*font-weight: 500;*/
    position: relative;
    transition: color 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/*.style-noona .related-item a::after {
    content: "";
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 0;
    height: 1.5px;
    background-color: var(--hd-related-hover-color);
    transition: width 0.3s ease;
}

.style-noona .related-item a:hover {
    color: var(--hd-related-hover-color);
    text-decoration: none;
}

.style-noona .related-item a:hover::after {
    width: 100%;
}*/

/* --- 2. 現代化卡片框 (Modern) --- */
.hd-related-posts-container.style-modern {
    background-color: var(--hd-related-card-bg, #ffffff);
    border: 1px solid var(--hd-related-card-border, #f3f4f6);
    border-radius: var(--hd-related-radius-md);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05), 0 10px 15px -5px rgba(0, 0, 0, 0.05);
    padding: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.hd-related-posts-container.style-modern:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.08), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    transform: translateY(-4px);
    border-color: var(--hd-related-accent-final-color);
}

.style-modern .hd-related-posts-header {
    margin: 0;
    padding: 20px 25px;
    font-size: 1.25rem;
    font-weight: 700;
    background: linear-gradient(to right, rgba(0,0,0,0.02), transparent);
    border-bottom: 2px solid #f3f4f6;
}

.style-modern .hd-related-posts-body {
    padding: 20px 25px;
}

.style-modern .related-item {
    padding: 8px 0;
    border-bottom: 1px solid #f9fafb;
}

.style-modern .related-item:last-child {
    border-bottom: none;
}

.style-modern .related-item a {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 8px 0;
}

.style-modern .related-card-thumbnail {
    flex-shrink: 0;
    width: 70px;
    height: 50px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.style-modern .related-item::marker {
    color: var(--hd-related-accent-final-color);
    font-weight: 800;
}

/* --- 2.5 Premium Glass (磨砂玻璃) --- */
.hd-related-posts-container.style-glass {
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(12px) saturate(180%);
    -webkit-backdrop-filter: blur(12px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: var(--hd-related-radius-md);
    padding: 0;
    box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.07);
    overflow: hidden;
}

.style-glass .hd-related-posts-header {
    margin: 0;
    padding: 20px 25px;
    font-size: 1.25rem;
    font-weight: 700;
    background: rgba(255, 255, 255, 0.2);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.style-glass .hd-related-posts-body {
    padding: 20px 25px;
}

.style-glass .related-item {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: var(--hd-related-radius-sm);
    margin-bottom: 15px !important;
    transition: all 0.3s ease;
}

.style-glass .related-item:hover {
    background: rgba(255, 255, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.5);
    transform: translateY(-2px);
}

.style-glass .related-item a {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 12px 15px;
}

.style-glass .related-card-thumbnail {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: var(--hd-related-radius-sm);
    box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

/* --- 3. 簡易方框 (Boxed) --- */
/* 一個簡單、乾淨的邊框容器 */
.style-boxed {
border: 1px solid var(--hd-related-card-border, var(--hd-related-border-color));
background-color: var(--hd-related-card-bg, transparent);
padding: var(--hd-related-spacing-md);
border-radius: var(--hd-related-radius-sm);
}
.style-boxed .hd-related-posts-header {
border-bottom: 1px solid var(--hd-related-card-border, var(--hd-related-border-color)); 
padding-bottom: 0.75rem;
margin-bottom: 1rem;
}

/* --- 4. 粗體分隔線 (Bold Separator) --- */
/* 移除容器邊框，改用粗分隔線來區分項目 */
.style-bold-separator .hd-related-posts-header {
border: none; /* 標題無邊框 */
}
.style-bold-separator .related-item {
border-bottom: 2px solid var(--hd-related-border-color);
padding-bottom: 0.75rem;
margin-bottom: 0.75rem;
}
.style-bold-separator .related-item:last-child {
border-bottom: none; /* 最後一項不需要分隔線 */
margin-bottom: 0;
}

/* --- 5. 簡潔列表 (Minimal) --- */
/* 極簡風格，僅保留標題和列表文字 */
.style-minimal .hd-related-posts-header {
border: none;
padding-bottom: 0;
}

/* --- 6. 空白 (僅列表) (Plain) --- */
/* 完全隱藏標題，只顯示列表內容 */
.style-plain .hd-related-posts-header {
display: none;
}

/* --- 7. 緊湊型 (行內連結) (Compact) --- */
/* 將連結轉為行內元素，像標籤雲一樣排列 */
.style-compact .hd-related-posts-header {
font-size: 1rem;
margin-bottom: 0.5rem;
border: none;
}
.style-compact .hd-related-posts-body ul {
display: flex; /* 啟用 Flexbox 佈局 */
flex-wrap: wrap; /* 允許項目自動換行 */
align-items: center; /* 垂直置中對齊 */
gap: 0.25em 0.5em; /* 設定項目間的垂直與水平間距 */
}
/* 為每個項目後面加上逗號分隔符 */
.style-compact .related-item::after {
content: ", ";
margin-right: 0.25em; /* 逗號後的間距 */
color: var(--hd-related-meta-color);
}
/* 最後一個項目不需要逗號 */
.style-compact .related-item:last-child::after {
content: "";
}

/* ========================================================================
 * PART D: 圖片樣式 (Image-Based Styles)
 * ======================================================================== */
.related-card-thumbnail { width: 100%; aspect-ratio: 16 / 10; background-color: #f3f4f6; overflow: hidden; }
.related-card-thumbnail img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s ease; }
.related-item a:hover .related-card-thumbnail img { transform: scale(1.05); }
.related-item-content { padding: var(--hd-related-spacing-sm); flex-grow: 1; display: flex; flex-direction: column; }
.related-item-title {line-height: 1.4; flex-grow: 1; }
.style-cards .hd-related-posts-header { 
    text-align: center; 
    border: none; 
    margin-bottom: 2rem;
    font-size: 1.5rem;
    font-weight: 800;
}
.style-cards .hd-related-posts-body ul { 
    display: grid; 
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); 
    gap: 2rem; 
}
.style-cards .related-item { 
    border-radius: var(--hd-related-radius-md); 
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); 
    background-color: var(--hd-related-card-bg, #fff); 
    border: 1px solid rgba(0, 0, 0, 0.03); 
    overflow: hidden; 
    transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); 
}
.style-cards .related-item:hover { 
    transform: translateY(-8px) scale(1.02); 
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); 
    border-color: rgba(0, 0, 0, 0.1);
}
.style-cards .related-item a { display: flex; flex-direction: column; height: 100%; text-decoration: none; }
.style-slider .hd-related-posts-header { text-align: center; border: none; padding-bottom: 1.5rem; font-weight: 800; font-size: 1.4rem; }
.hd-related-slider-wrapper { position: relative; padding: 0 10px; }
.hd-related-slider-wrapper ul { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; gap: 1.5rem; padding: 1rem 5px; }
.hd-related-slider-wrapper ul::-webkit-scrollbar { display: none; }
.hd-related-slider-wrapper .related-item { flex: 0 0 75%; max-width: 280px; scroll-snap-align: start; background-color: var(--hd-related-card-bg, #fff); border: 1px solid rgba(0,0,0,0.04); box-shadow: 0 4px 12px rgba(0,0,0,0.05); border-radius: var(--hd-related-radius-md); overflow: hidden; transition: all 0.3s ease; }
.hd-related-slider-wrapper .related-item:hover { transform: scale(1.02); box-shadow: 0 10px 20px rgba(0,0,0,0.1); }
.slider-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 10; background-color: #fff; border: none; border-radius: 50%; width: 48px; height: 48px; cursor: pointer; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; color: #111; box-shadow: 0 4px 12px rgba(0,0,0,0.15); opacity: 0; pointer-events: none; transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275); }
.hd-related-slider-wrapper:hover .slider-nav { opacity: 1; pointer-events: auto; }
.slider-nav:hover { background-color: var(--hd-related-accent-final-color); color: #fff; transform: translateY(-50%) scale(1.1); }
.slider-nav.prev { left: -15px; }
.slider-nav.next { right: -15px; }
.style-image-left { border: 1px solid #f3f4f6; background-color: var(--hd-related-card-bg, #fff); border-radius: var(--hd-related-radius-md); box-shadow: var(--hd-related-shadow-light); overflow: hidden; }
.style-image-left .hd-related-posts-header { padding: 20px 25px; border-bottom: 1px solid #f3f4f6; font-weight: 700; font-size: 1.25rem; }
.style-image-left .related-item { margin: 0; border-bottom: 1px solid #f9fafb; transition: background-color 0.2s ease; }
.style-image-left .related-item:hover { background-color: #f9fafb; }
.style-image-left .related-item:last-child { border-bottom: none; }
.style-image-left .related-item a { display: flex; align-items: center; gap: 1.5rem; padding: 15px 25px; }
.style-image-left .related-card-thumbnail { flex-shrink: 0; width: 120px; height: 80px; border-radius: var(--hd-related-radius-sm); box-shadow: 0 2px 4px rgba(0,0,0,0.05); }

/* --- Single Card (單則延伸閱讀) --- */
.hd-related-posts-container.style-single-card {
max-width: 760px;
padding: 0;
border-radius: 18px;
background: linear-gradient(135deg, var(--hd-related-card-bg, #ffffff) 0%, #fbfdff 100%);
border: 1px solid var(--hd-related-card-border, #e2e8f0);
box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
overflow: hidden;
color: #111111;
}

.style-single-card .hd-related-posts-header {
display: flex;
align-items: center;
gap: 10px;
margin: 0;
padding: 18px 22px 0;
border-bottom: 0;
font-size: 0.95rem;
letter-spacing: 0.04em;
color: #111111;
}

.style-single-card .hd-related-posts-header::before {
content: none;
display: none;
}

.style-single-card .hd-related-posts-body {
padding: 10px 22px 20px;
}

.style-single-card .hd-related-posts-body ul,
.style-single-card .hd-related-posts-body ol {
margin: 0 !important;
padding-left: 1.75em !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
list-style-position: outside;
}

.style-single-card.has-list-style-disc .hd-related-posts-body > ul,
.style-single-card.has-list-style-circle .hd-related-posts-body > ul,
.style-single-card.has-list-style-square .hd-related-posts-body > ul,
.style-single-card.has-list-style-ordered .hd-related-posts-body > ol,
.style-single-card.has-list-style-roman .hd-related-posts-body > ol,
.style-single-card.has-list-style-alpha .hd-related-posts-body > ol {
padding-left: 1.6em !important;
}

.style-single-card.has-list-style-disc .hd-related-posts-body > ul { list-style: disc !important; }
.style-single-card.has-list-style-circle .hd-related-posts-body > ul { list-style: circle !important; }
.style-single-card.has-list-style-square .hd-related-posts-body > ul { list-style: square !important; }
.style-single-card.has-list-style-ordered .hd-related-posts-body > ol { list-style: decimal !important; }
.style-single-card.has-list-style-roman .hd-related-posts-body > ol { list-style: upper-roman !important; }
.style-single-card.has-list-style-alpha .hd-related-posts-body > ol { list-style: upper-alpha !important; }

.style-single-card.has-list-style-circled-decimal .hd-related-posts-body > ol {
padding-left: 0 !important;
list-style: none !important;
counter-reset: hd-list-counter;
}

.style-single-card.has-list-style-none .hd-related-posts-body > ul,
.style-single-card.has-list-style-none .hd-related-posts-body > ol {
padding-left: 0 !important;
list-style: none !important;
}

.style-single-card .related-item {
margin-top: 0 !important;
margin-bottom: 0 !important;
border-radius: 12px;
background: transparent;
border: 0;
overflow: visible;
transition: background-color 0.2s ease, color 0.2s ease;
}

.style-single-card .related-item + .related-item {
margin-top: 0.35rem !important;
}

.style-single-card.has-list-style-disc .related-item,
.style-single-card.has-list-style-circle .related-item,
.style-single-card.has-list-style-square .related-item,
.style-single-card.has-list-style-ordered .related-item,
.style-single-card.has-list-style-roman .related-item,
.style-single-card.has-list-style-alpha .related-item {
display: list-item !important;
list-style-position: outside;
counter-increment: none;
color: #111111;
}

.style-single-card.has-list-style-disc .related-item::marker,
.style-single-card.has-list-style-circle .related-item::marker,
.style-single-card.has-list-style-square .related-item::marker,
.style-single-card.has-list-style-ordered .related-item::marker,
.style-single-card.has-list-style-roman .related-item::marker,
.style-single-card.has-list-style-alpha .related-item::marker {
color: color-mix(in srgb, var(--hd-related-accent-final-color) 82%, #5b4636);
font-weight: 700;
}

.style-single-card.has-list-style-circled-decimal .related-item {
display: flex !important;
align-items: flex-start;
gap: 0.9em;
list-style: none !important;
counter-increment: hd-list-counter;
color: #111111;
}

.style-single-card.has-list-style-none .related-item {
display: block !important;
list-style: none !important;
counter-increment: none;
}

.style-single-card .related-item::before {
content: none !important;
display: none !important;
}

.style-single-card.has-list-style-circled-decimal .related-item::before {
content: counter(hd-list-counter);
display: inline-flex !important;
align-items: center;
justify-content: center;
width: 1.55em;
height: 1.55em;
margin-top: 0.1em;
border: 1px solid currentColor;
border-radius: 999px;
font-size: 0.82em;
font-weight: 700;
line-height: 1;
color: #111111;
}

.style-single-card .related-item a {
display: block;
min-height: 0;
padding: 12px 14px 13px;
border-radius: 10px;
color: #111111;
outline-offset: 2px;
}

.style-single-card .related-item a:hover,
.style-single-card .related-item a:focus-visible {
background: color-mix(in srgb, var(--hd-related-accent-final-color) 6%, transparent);
color: #111111;
}

.style-single-card .related-card-thumbnail {
display: none;
}

.style-single-card .related-item-content {
justify-content: flex-start;
gap: 8px;
padding: 1px 0 0;
min-width: 0;
}

.style-single-card .related-item-title {
font-size: 1rem;
font-weight: 700;
line-height: 1.72;
letter-spacing: -0.01em;
color: #111111;
}

.style-single-card .related-post-meta {
font-size: 0.86rem;
}

.style-single-card .hd-related-posts-footer:empty {
display: none;
}

.hd-related-density-compact .hd-related-posts-body > ul,
.hd-related-density-compact .hd-related-posts-body > ol {
gap: 0.45rem;
}

.hd-related-density-compact .related-item a {
padding: 9px 11px !important;
}

.hd-related-density-compact .related-item-title {
font-size: 0.94rem;
line-height: 1.55;
}

.hd-related-density-spacious .hd-related-posts-body > ul,
.hd-related-density-spacious .hd-related-posts-body > ol {
gap: 0.9rem;
}

.hd-related-density-spacious .related-item a {
padding: 16px 18px !important;
}

.hd-related-density-spacious .related-item-title {
font-size: 1.06rem;
line-height: 1.78;
}

/* ========================================================================
 * PART E: 智慧模式通用樣式 (Unified Smart Mode Styles)
 * ======================================================================== */
/* --- 1. 通用容器與變數 --- */
.style-smart-timeline, .style-ptimeline {
--hd-related-accent-color: var(--hd-timeline-theme-color, var(--hd-related-accent-color-default));
}

/* --- 2. 【關鍵修正】通用核心圖文區塊 (.item-content-wrapper) --- */
.item-content-wrapper {
display: flex !important; /* 強制 flex 佈局，這是讓 order 生效的基礎！ */
gap: 1rem;
width: 100%;
align-items: center; /* 預設垂直置中 */
}
.style-ptimeline .item-content-wrapper {
align-items: flex-start; /* ptimeline 頂部對齊 */
padding: 0.5em;
}

/* --- 3. 通用內容佈局 (使用 CSS Order 屬性並強制優先權) --- */

/* 確保子元素有預設 order 值 */
.item-image,
.item-text-content {
order: 0;
}
.item-image {
flex-shrink: 0;
}
.item-text-content {
display: flex; /* 文字區塊內部也使用 flex 來佈局 */
flex-direction: column;
flex-grow: 1;
min-width: 0;
}
.item-title {
    font-weight: 700;
    line-height: 1.5;
    color: var(--hd-related-title-color);
    letter-spacing: -0.01em;
}
.item-image img {
    display: block;
    max-width: 100%;
    height: auto;
    border-radius: var(--hd-related-radius-sm);
    transition: transform 0.4s ease;
}
.item-content-wrapper:hover .item-image img {
    transform: scale(1.03);
}

/* 佈局 A: 垂直堆疊 */
.item-content-wrapper.content-layout-image-top,
.item-content-wrapper.content-layout-image-bottom {
flex-direction: column !important;
align-items: flex-start !important;
}
.item-content-wrapper.content-layout-image-bottom .item-text-content {
order: 1 !important;
}
.item-content-wrapper.content-layout-image-bottom .item-image {
order: 2 !important;
margin-top: 1rem;
}

/* 佈局 B: 水平排列 (統一圖片寬度) */
.item-content-wrapper.content-layout-image-left .item-image,
.item-content-wrapper.content-layout-image-right .item-image {
width: 100px;
}
.style-ptimeline .item-content-wrapper.content-layout-image-left .item-image,
.style-ptimeline .item-content-wrapper.content-layout-image-right .item-image {
width: 30%;
max-width: 150px;
}

/* 強制「左文右圖」的視覺順序 */
.item-content-wrapper.content-layout-image-right .item-text-content {
order: 1 !important;
}
.item-content-wrapper.content-layout-image-right .item-image {
order: 2 !important;
}


/* --- 4. 智慧時間軸 (timeline, sp-timeline) 專屬樣式 --- */


/* ======================================================
 * [核心修正] 恢復遺失的時間軸垂直線
 * ====================================================== */


/*
 * ========================================================================
 *  [ULTIMATE FINAL VERSION v4] 智慧延伸閱讀：高亮與標籤統一樣式
 * ========================================================================
 */

/* --- PART 1: 全局高亮項目 (.is-now) 的主體樣式 (保持不變) --- */
.hd-related-posts-container.has-highlight .related-item:not(.is-now) { opacity: 0.6; transition: opacity 0.25s ease-in-out; }
.hd-related-posts-container.has-highlight .related-item:not(.is-now):hover { opacity: 1; }

/* Pulsing Glow Animation */
@keyframes hdPulseGlow {
    0% { box-shadow: 0 0 0 0 rgba(var(--hd-pulse-rgb, 79, 70, 229), 0.4); transform: scale(1); }
    50% { box-shadow: 0 0 15px 5px rgba(var(--hd-pulse-rgb, 79, 70, 229), 0.2); transform: scale(1.01); }
    100% { box-shadow: 0 0 0 0 rgba(var(--hd-pulse-rgb, 79, 70, 229), 0); transform: scale(1); }
}

.related-item.is-now {
    --hd-pulse-rgb: 79, 70, 229; /* Default to Indigo */
    position: relative;
    z-index: 2;
}

.style-noona .related-item.is-now, .style-bold-separator .related-item.is-now, .style-minimal .related-item.is-now { border-left: 3px solid var(--hd-related-accent-final-color); padding-left: 12px; background-color: color-mix(in srgb, var(--hd-related-accent-final-color) 8%, transparent); }
.style-boxed .related-item.is-now, .style-modern .related-item.is-now, .style-glass .related-item.is-now { border: 1px solid var(--hd-related-accent-final-color); background-color: color-mix(in srgb, var(--hd-related-accent-final-color) 5%, transparent); animation: hdPulseGlow 3s infinite ease-in-out; }

/* --- PART 2: 標籤 (.hd-highlight-label & .step-label) 的最終樣式 --- */

/* --- A. 標籤的統一樣式基礎 --- */
/* 【核心修正】直接選中容器內所有的標籤，不再關心它們的父容器是誰 */
.hd-related-posts-container .hd-highlight-label {
display: inline-block;
width: fit-content;
max-width: 100%;
padding: 2px 8px;
font-size: 12px;
font-weight: 700;
line-height: 1.5;
color: #fff !important;
border-radius: 4px;
text-align: center;
box-sizing: border-box;
}

/* --- B. 標籤顏色 --- */

.hd-related-posts-container .hd-highlight-label {
background-color: var(--hd-highlight-label-bg, #d54e21);
}

/* --- C. 佈局與間距 --- */

/* 1. 智慧模式下的佈局 */
.timeline-item-labels { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; }

/* 【核心修正】處理跑到外面的 STEP 標籤 */


/* 2. 經典列表模式下的佈局 */
.related-item-content { display: flex; flex-direction: column; align-items: flex-start; }
.related-item-content > .hd-highlight-label { margin-bottom: 8px; }


/* --- 智慧延伸閱讀：行動裝置體驗優化 --- */
/* 
 * 當螢幕寬度小於 992px (典型的平板與手機) 時，
 * 取消「高亮模式」下非高亮項目的變暗效果，讓所有項目都清晰可見。
*/
@media (max-width: 991px) {
.hd-related-posts-container.has-highlight .related-item:not(.is-now),
.hd-related-posts-container.has-highlight .timeline-item:not(.is-now) {
opacity: 1!important; /* 取消變暗效果 */
filter: none!important; /* 如果未來有使用 filter，也一併取消 */
}
}




/* ========================================================================
 * PART G: RWD 響應式設計與版面修正 - 【v5 終極強化版】
 * ======================================================================== */

/* 當螢幕寬度小於 768px 時觸發 */
@media (max-width: 767px) {
/* 隱藏 Slider 的導航按鈕 */
.slider-nav { display: none; }
.hd-related-slider-wrapper { padding: 0; }

/* [RWD ENHANCEMENT] 卡片樣式在手機上變為單欄 */
.style-cards .hd-related-posts-body ul {
grid-template-columns: 1fr;
}

/* [RWD ENHANCEMENT] 左右圖文樣式，在手機上改為垂直堆疊 */
.style-image-left .related-item a {
flex-direction: column;
align-items: flex-start;
}
.style-image-left .related-card-thumbnail {
width: 100%; /* 圖片寬度變為100% */
height: auto;
aspect-ratio: 16 / 9; /* 保持圖片比例 */
}

.style-single-card .related-item a {
grid-template-columns: 1fr;
}

.style-single-card .related-card-thumbnail {
height: auto;
min-height: 0;
aspect-ratio: 16 / 9;
}

/* 1. 為手機版的容器也增加安全內邊距 */


/* 2. 同樣將線和點定位在新的內容區左側 */

/* 3. 內容區的佈局重置 */

/* ▲▲▲ 全新的手機版單欄佈局邏輯結束 ▲▲▲ */
}
.hd-related-posts-footer { text-align: center; margin-top: var(--hd-related-spacing-md); }
.hd-more-button { display: inline-block; padding: 0.6rem 1.75rem; background-color: var(--hd-related-accent-final-color); color: #fff !important; border-radius: var(--hd-related-radius-sm); font-weight: 500; transition: background-color 0.2s ease, transform 0.2s ease; }
.hd-more-button:hover { background-color: color-mix(in srgb, var(--hd-related-accent-final-color) 85%, black); transform: translateY(-2px); }



/* ========================================================================
 * PART H: 互動性與展開功能 (Interactivity & Expandable Feature) - 【v4 Ptimeline Fix】
 * ======================================================================== */

/* 1. 【核心修正】將 .ptimeline-item 也納入隱藏規則中 */
.hd-related-posts-container .related-item.is-hidden-expandable,
.hd-related-posts-container .ptimeline-item.is-hidden-expandable {
display: none !important;
}

/* 2. 【核心修正】將 .ptimeline-item 也納入揭示動畫規則中 */
.hd-related-posts-container .related-item.is-revealing,
.hd-related-posts-container .ptimeline-item.is-revealing {
opacity: 0;
}

/* 3. 【核心修正】為 .ptimeline-item 加上過渡動畫 */
.hd-related-posts-container .related-item,
.hd-related-posts-container .ptimeline-item {
transition: opacity 0.5s ease;
}

/* 4. 高亮規則的權重 (保持不變，但確認 .ptimeline-item 也適用) */
.hd-related-posts-container.has-highlight .related-item:not(.is-now),
.hd-related-posts-container.has-highlight .ptimeline-item:not(.is-now) {
opacity: 0.5;
}
.hd-related-posts-container.has-highlight .related-item.is-now,
.hd-related-posts-container.has-highlight .ptimeline-item.is-now {
opacity: 1 !important;
}
.hd-related-posts-container.has-highlight .related-item:hover,
.hd-related-posts-container.has-highlight .ptimeline-item:hover {
opacity: 1;
}

/* --- 底部按鈕樣式 (保持不變) --- */
.hd-related-posts-footer {
text-align: center;
margin-top: var(--hd-related-spacing-md);
}
.hd-expand-button {
display: inline-block;
padding: 0.6rem 1.75rem;
background-color: #f1f1f1;
color: #333 !important;
border: 1px solid #ccc;
border-radius: var(--hd-related-radius-sm);
font-weight: 500;
cursor: pointer;
transition: background-color 0.2s ease, transform 0.2s ease;
}
.hd-expand-button:hover {
background-color: #e0e0e0;
transform: translateY(-2px);
}
.hd-more-button {
display: inline-block;
padding: 0.6rem 1.75rem;
background-color: var(--hd-related-accent-final-color);
color: #fff !important;
border-radius: var(--hd-related-radius-sm);
font-weight: 500;
transition: background-color 0.2s ease, transform 0.2s ease;
}
.hd-more-button:hover {
background-color: color-mix(in srgb, var(--hd-related-accent-final-color) 85%, black);
transform: translateY(-2px);
}

/* ======================================================
 * [新增] 支援羅馬與英文字母列表符號
 * ====================================================== */
.hd-related-posts-container.has-list-style-roman ol {
padding-left: 1.8em !important;
}
.hd-related-posts-container.has-list-style-roman ol > .related-item {
list-style-type: upper-roman !important;
}

.hd-related-posts-container.has-list-style-alpha ol {
padding-left: 1.8em !important;
}
.hd-related-posts-container.has-list-style-alpha ol > .related-item {
list-style-type: upper-alpha !important;
}






/* ==========================================================================
   # 日式手動時間軸 (P-Timeline) - 獨有樣式
   ========================================================================== */

/* --- 1. 基礎結構與全局重置 --- */
.hd-related-posts-container.style-ptimeline .ptimeline { 
padding: 0 !important; 
list-style: none !important; 
margin: 0; 
position: relative; 
}
.hd-related-posts-container.style-ptimeline .ptimeline-item {
list-style-type: none !important;
margin: 0 !important;
border: none !important;
padding: 0 0 1.5em 2.5em !important;
position: relative;
}

/* --- 2. 垂直時間線與標記點 --- */
.hd-related-posts-container.style-ptimeline .ptimeline-item:before { 
content: ""; width: 2px; background: #eee; position: absolute; top: 15px; bottom: 0; left: 10px; z-index: 0;
}
.hd-related-posts-container.style-ptimeline .ptimeline-item:last-child:before { 
display: none; 
}
.hd-related-posts-container.style-ptimeline .ptimeline-marker { 
    box-sizing: border-box; 
    position: absolute; 
    top: 6px; 
    left: 4px; 
    width: 16px; 
    height: 16px; 
    border-radius: 50%; 
    background: #fff; 
    border: solid 4px var(--hd-related-accent-color, #00bfff); 
    box-shadow: 0 0 0 2px rgba(255,255,255,1), 0 0 0 4px var(--hd-related-accent-color, #00bfff);
    z-index: 1; 
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* --- 3. Marker 的所有樣式變化 --- */
.hd-related-posts-container.style-ptimeline .ptimeline.marker-square .ptimeline-marker { border-radius: 4px; }
.hd-related-posts-container.style-ptimeline .ptimeline.marker-icon .ptimeline-marker { border: none !important; background: none !important; width: auto; height: auto; box-shadow: none; }
.hd-related-posts-container.style-ptimeline .ptimeline.marker-icon .ptimeline-marker:before { font-family: "Font Awesome 5 Free", "Font Awesome 6 Free"; font-weight: 900; content: var(--ptimeline-icon-code, "\f005"); position: absolute; top: 1px; left: -2px; font-size: 20px; color: var(--hd-related-accent-color, #00bfff); text-shadow: 0 2px 4px rgba(0,0,0,0.1); }
.hd-related-posts-container.style-ptimeline .ptimeline-item.is-now { --ptimeline-highlight-color: var(--hd-highlight-label-bg, #d32f2f); }
.hd-related-posts-container.style-ptimeline .ptimeline-item.is-now .ptimeline-marker { border-color: var(--ptimeline-highlight-color) !important; background: var(--ptimeline-highlight-color) !important; transform: scale(1.2); box-shadow: 0 0 10px var(--ptimeline-highlight-color); }
.hd-related-posts-container.style-ptimeline .ptimeline.marker-icon .ptimeline-item.is-now .ptimeline-marker:before { color: var(--ptimeline-highlight-color) !important; }

/* --- 4. 連結包裹器樣式 --- */
.ptimeline-item .ptimeline-link-wrapper { display: block; text-decoration: none; color: inherit; border-radius: var(--hd-related-radius-sm, 6px); transition: box-shadow 0.2s ease-in-out, transform 0.2s ease-in-out; }
/* 當滑鼠懸停在連結包裹器上時 */
.ptimeline-item .ptimeline-link-wrapper:hover {
/* 讓整個區塊輕微向上浮動 */
transform: translateY(-2px);
}

/* 同時，改變內部 .item-content-wrapper 的背景和陰影 */
.ptimeline-item .ptimeline-link-wrapper:hover .item-content-wrapper {
background-color: #f8f9fa;
box-shadow: var(--hd-related-shadow-md); /* 使用更深的陰影 */
}
.ptimeline-item .ptimeline-link-wrapper:hover .item-title { color: var(--hd-related-hover-color, #005a9e) !important; }
.ptimeline-item .ptimeline-link-wrapper .item-text-content, .ptimeline-item .ptimeline-link-wrapper .related-post-meta { color: var(--hd-related-meta-color, #6b7280); }
.ptimeline-item .ptimeline-link-wrapper .item-title { color: var(--hd-related-accent-color, #00bfff); }

/* --- 5. 其他文字與 Meta 元素樣式 --- */
.hd-related-posts-container.style-ptimeline .ptimeline-label { padding-top: 2px; color: #888; font-size: 13px; }
.hd-related-posts-container.style-ptimeline .item-title { font-size: 1.1em; font-weight: bold; }

/* ==========================================================================
   # 智慧時間軸 - 進階內容結構樣式 (共享)
   ========================================================================== */

/* --- 1. 主要說明區塊 --- */
.timeline-primary-description { font-size: 0.95em; line-height: 1.7; color: #495057; margin-top: 0.5em; }
.timeline-primary-description p:first-child { margin-top: 0; }
.timeline-primary-description p:last-child { margin-bottom: 0; }

/* --- 2. 內容分隔線 --- */
hr.timeline-content-separator { border: none; border-top: 1px dashed #ced4da; margin: 1.2em 0; width: 100%; }

/* --- 3. 可點擊的核心圖文區塊 --- */
.timeline-item-inner-container > a.item-content-wrapper { display: flex; text-decoration: none; background-color: transparent; padding: 0.5em; margin: 0px; border-radius: var(--hd-related-radius-sm, 6px); transition: background-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out; }
.timeline-item-inner-container > a.item-content-wrapper:hover { background-color: #f8f9fa; box-shadow: var(--hd-related-shadow-light); }

/* --- 4. 附加圖片區塊 --- */
.timeline-additional-image { text-align: left; }
.timeline-additional-image img { display: inline-block; max-width: 100%; height: auto; border-radius: var(--hd-related-radius-md, 10px); box-shadow: var(--hd-related-shadow-light); }


/* === post-navigation.css === */
/**
 * 文章導航 - 完整樣式表(修正版)
 * Version: 5.2.6
 * 修正: 文章導航標籤樣式 parity 與資產版本統一
 */

* {
    box-sizing: border-box;
}

/* ========================================
   CSS 變數定義
======================================== */
:root {
/* 圖片尺寸(由 PHP 動態設定) */
--post-nav-side-img-width: 200px;
--post-nav-side-img-height: 150px;
--post-nav-top-img-ratio: 16 / 9;
--post-nav-img-fit: cover;
--post-nav-title-lines: 3;
--nav-border-radius: 12px;
--nav-shadow: 0 4px 12px rgba(0,0,0,0.1);
--nav-hover-effect: zoom;

/* 顏色系統 - 亮色模式(預設) */
--nav-primary: #2563eb;
--nav-primary-hover: #1d4ed8;
--nav-text: #111827;
--nav-text-secondary: #4b5563;
--nav-text-light: #6b7280;
--nav-bg: #ffffff;
--nav-bg-hover: #f9fafb;
--nav-border: #e5e7eb;
--nav-overlay: rgba(0, 0, 0, 0.75);

/* 間距 */
--nav-spacing-xs: 4px;
--nav-spacing-sm: 8px;
--nav-spacing-md: 16px;
--nav-spacing-lg: 24px;
--nav-spacing-xl: 32px;

/* 動畫 */
--nav-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
--nav-transition-fast: all 0.2s ease;
}

/* 深色模式變數 */
body.dark-mode {
--nav-text: #f9fafb;
--nav-text-secondary: #d1d5db;
--nav-text-light: #9ca3af;
--nav-bg: #1f2937;
--nav-bg-hover: #111827;
--nav-border: #374151;
--nav-overlay: rgba(0, 0, 0, 0.85);

/* --- ▼▼▼ 以下為新增的通用深色模式樣式 ▼▼▼ --- */

/* 設定頁面背景和文字顏色 */
background-color: #181a1b; /* 深色背景 */
color: #e8e6e3; /* 淺色文字 */

/* 確保您的文章內容區域也應用這些顏色 */
/* 注意：您可能需要根據您的佈景主題修改下面的選擇器，例如 .entry-content 或 #main */
.site-content, 
.entry-content,
.post-content {
 background-color: transparent; /* 繼承 body 的背景色 */
 color: inherit; /* 繼承 body 的文字顏色 */
}

/* 通用連結顏色 */
a {
color: #8ab4f8;
}

a:hover {
color: #a3c5fb;
}

/* 標題顏色 */
h1, h2, h3, h4, h5, h6 {
color: #f1f1f1;
}

/* --- ▲▲▲ 以上為新增的通用深色模式樣式 ▲▲▲ --- */
}
/* ========================================
   深色模式切換按鈕
======================================== */
.dark-mode-toggle {
position: fixed;
bottom: calc(24px + var(--hd-bottom-fixed-safe-offset, 0px));
right: 24px;
width: 56px;
height: 56px;
background: var(--nav-primary);
border: none;
border-radius: 50%;
cursor: pointer;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
z-index: 1000;
display: flex;
align-items: center;
justify-content: center;
transition: var(--nav-transition);
}

.dark-mode-toggle:hover {
transform: scale(1.1);
box-shadow: 0 6px 20px rgba(0,0,0,0.25);
}

.dark-mode-toggle:active {
transform: scale(0.95);
}

.dark-mode-toggle svg {
width: 24px;
height: 24px;
color: white;
transition: var(--nav-transition);
}

.dark-mode-toggle .icon-sun {
display: none;
}

.dark-mode-toggle .icon-moon {
display: block;
}

body.dark-mode .dark-mode-toggle .icon-sun {
display: block;
}

body.dark-mode .dark-mode-toggle .icon-moon {
display: none;
}

@media (max-width: 768px) {
.dark-mode-toggle {
width: 48px;
height: 48px;
bottom: calc(16px + var(--hd-bottom-fixed-safe-offset, 0px));
right: 16px;
}

.dark-mode-toggle svg {
width: 20px;
height: 20px;
}
}

/* ========================================
   基礎佈局
======================================== */
/**
 * 修正：無論單篇或雙篇，都使用 Flexbox 佈局以確保對齊正確
 */
.post-navigation {
display: flex;
justify-content: space-between; /* 保持 space-between，這對單個元素對齊很關鍵 */
flex-wrap: wrap; /* 增加 wrap 以處理手機端堆疊的情況 */
gap: var(--nav-spacing-lg); /* 將 gap 移到這裡統一管理 */
}

/* 上下篇導覽分隔線：預設隱藏，由後台條件與 RWD 狀態啟用 */
.post-nav-divider {
display: none;
flex: 0 0 100%;
height: 1px;
margin: 0 0 var(--post-nav-divider-spacing, 18px);
background: var(--nav-border);
opacity: .72;
}

.post-navigation.divider-style-solid .post-nav-divider {
opacity: 1;
}

.post-navigation.divider-style-dashed .post-nav-divider {
height: 0;
border-top: 1px dashed var(--nav-border);
background: transparent;
opacity: .9;
}

.post-navigation.divider-style-accent .post-nav-divider {
height: 2px;
max-width: 180px;
margin-right: auto;
margin-left: auto;
background: var(--nav-primary);
border-radius: 999px;
opacity: 1;
}

.post-navigation.divider-position-before-next.has-both-posts .post-nav-divider {
display: block;
}

.post-navigation.divider-position-before-next.has-both-posts .nav-next,
.post-navigation.divider-position-before-next.has-both-posts .nav-simple-next,
.post-navigation.divider-position-before-next.has-both-posts .nav-arrow-next {
order: 4;
}

.post-navigation.divider-position-before-next.has-both-posts .post-nav-divider {
order: 3;
}

/* ========== 新增箭頭導航模式 ========== */
.nav-mode-arrow {
display: flex;
align-items: center;
justify-content: center;
gap: var(--nav-spacing-lg);
padding: var(--nav-spacing-lg) 0;
}

.nav-arrow {
display: flex;
align-items: center;
gap: var(--nav-spacing-sm);
padding: 12px 24px;
background: var(--nav-bg);
border: 2px solid var(--nav-border);
border-radius: 50px;
color: var(--nav-text);
text-decoration: none;
font-weight: 600;
font-size: 14px;
transition: var(--nav-transition);
cursor: pointer;
}

.nav-arrow:hover {
background: var(--nav-primary);
border-color: var(--nav-primary);
color: white;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}

.nav-arrow svg {
width: 20px;
height: 20px;
transition: var(--nav-transition);
}

.nav-arrow:hover svg {
color: white;
}

.nav-arrow-prev:hover svg {
transform: translateX(-3px);
}

.nav-arrow-next:hover svg {
transform: translateX(3px);
}

.nav-arrow-disabled {
width: 48px;
height: 48px;
opacity: 0;
pointer-events: none;
}

/* 中間導航按鈕 */
.nav-center-button {
display: flex;
align-items: center;
justify-content: center;
gap: var(--nav-spacing-sm);
padding: 12px 24px;
background: var(--nav-primary);
border: 2px solid var(--nav-primary);
border-radius: 50px;
color: white;
text-decoration: none;
font-weight: 600;
font-size: 14px;
transition: var(--nav-transition);
cursor: pointer;
}

/* 中間導航按鈕 - 只顯示圖示模式 */
.nav-center-button.icon-only {
padding: 12px;
border-radius: 50%;
width: 48px;
height: 48px;
}

.nav-center-button.icon-only svg {
margin: 0;
}

/* 箭頭模式 - 只顯示圖示 */
.nav-mode-arrow .nav-center-button.icon-only {
width: 48px;
height: 48px;
}

/* 完整模式 - 只顯示圖示 */
.nav-center-full.icon-only {
padding: 12px;
width: 48px;
height: 48px;
border-radius: 50%;
}

.nav-center-full.icon-only svg {
margin: 0;
}

/* 手機版調整 */
@media (max-width: 768px) {
/* 有文字模式在手機版隱藏文字 - 已移除，改為顯示 */
/* .nav-center-button.has-text .nav-center-text,
.nav-center-full.has-text span {
display: none;
} */

/* 有文字模式在手機版變成圓形 */
.nav-center-button.has-text {
padding: 10px;
width: 44px;
height: 44px;
border-radius: 50%;
}

.nav-center-full.has-text {
padding: 10px;
width: 44px;
height: 44px;
border-radius: 50%;
}

/* 只顯示圖示模式 */
.nav-center-button.icon-only {
width: 44px;
height: 44px;
padding: 10px;
}

.nav-center-full.icon-only {
width: 44px;
height: 44px;
padding: 10px;
}
}

@media (max-width: 480px) {
.nav-center-button.icon-only,
.nav-center-full.icon-only,
.nav-center-button.has-text,
.nav-center-full.has-text {
width: 40px;
height: 40px;
padding: 8px;
}
}

.nav-center-button:hover {
background: var(--nav-primary-hover);
border-color: var(--nav-primary-hover);
transform: translateY(-2px) scale(1.05);
box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.nav-center-button svg {
width: 20px;
height: 20px;
color: white;
}

.nav-center-text {
color: white;
}


/* 中間導航按鈕 - 完整模式專用 */
.nav-mode-default.has-center-button {
position: relative;
padding-bottom: 60px; /* 增加底部間距以容納按鈕 */
}

.nav-center-full {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
gap: var(--nav-spacing-sm);
padding: 10px 20px;
background: var(--nav-primary);
border: 3px solid var(--nav-bg);
border-radius: 50px;
color: white;
text-decoration: none;
font-weight: 600;
font-size: 13px;
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
transition: var(--nav-transition);
z-index: 10;
}

.nav-center-full:hover {
background: var(--nav-primary-hover);
transform: translateX(-50%) translateY(-4px) scale(1.05);
box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.nav-center-full svg {
width: 18px;
height: 18px;
color: white;
}

.nav-center-full span {
color: white;
}

/* 手機版 */
@media (max-width: 768px) {
.nav-center-full {
padding: 8px 16px;
font-size: 12px;
/* 確保在手機版也能正確定位 */
bottom: 10px; 
width: auto;
white-space: nowrap;
}

.nav-center-full svg {
width: 16px;
height: 16px;
}

.nav-center-full span {
display: inline-block; /* 手機版顯示文字 */
margin-left: 4px;
}

/* Mobile Stack Mode Center Button Alignment */
.post-navigation.mobile-stack .nav-center-full {
position: static;
transform: none;
margin: 10px auto !important; /* Force centering */
align-self: center;
order: 2;
display: inline-flex;
width: fit-content; /* Ensure width fits content */
left: auto;
right: auto;
}

.post-navigation.mobile-stack.has-center-button {
padding-bottom: 0;
display: flex;
flex-direction: column;
}

.post-navigation.mobile-stack .nav-previous {
order: 1;
}

.post-navigation.mobile-stack .nav-next {
order: 3;
}
}

/* ========================================
   簡單導航模式 (Simple Mode)
======================================== */
.nav-mode-simple {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--nav-spacing-md);
padding: var(--nav-spacing-lg) 0;
border-top: 1px solid var(--nav-border);
border-bottom: 1px solid var(--nav-border);
}

.nav-mode-simple .nav-simple-prev,
.nav-mode-simple .nav-simple-next {
flex: 1;
display: flex;
}

.nav-mode-simple .nav-simple-prev {
justify-content: flex-start;
}

.nav-mode-simple .nav-simple-next {
justify-content: flex-end;
}

.nav-mode-simple .nav-simple-link {
display: flex;
align-items: center;
gap: var(--nav-spacing-sm);
padding: 10px 20px;
background: var(--nav-bg);
border: 1px solid var(--nav-border);
border-radius: 50px;
color: var(--nav-text);
text-decoration: none;
font-weight: 500;
font-size: 14px;
transition: var(--nav-transition);
white-space: nowrap;
}

.nav-mode-simple .nav-simple-link:hover {
background: var(--nav-primary);
border-color: var(--nav-primary);
color: white;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
}

.nav-mode-simple .nav-simple-link svg {
width: 18px;
height: 18px;
flex-shrink: 0;
transition: var(--nav-transition);
}

.nav-mode-simple .nav-simple-link:hover svg {
color: white;
}

.nav-mode-simple .nav-simple-prev .nav-simple-link:hover svg {
transform: translateX(-3px);
}

.nav-mode-simple .nav-simple-next .nav-simple-link:hover svg {
transform: translateX(3px);
}

.nav-mode-simple .nav-simple-text {
color: inherit;
}

.nav-mode-simple .nav-simple-placeholder {
width: 48px;
height: 48px;
opacity: 0;
}

/* 中間按鈕 - 簡單模式 */
.nav-mode-simple .nav-simple-center {
display: flex;
align-items: center;
justify-content: center;
padding: 12px;
background: var(--nav-primary);
border: 2px solid var(--nav-primary);
border-radius: 50%;
color: white;
text-decoration: none;
transition: var(--nav-transition);
flex-shrink: 0;
margin: 0px auto;
}

.nav-mode-simple .nav-simple-center:hover {
background: var(--nav-primary-hover);
border-color: var(--nav-primary-hover);
transform: translateY(-2px) scale(1.1);
box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.nav-mode-simple .nav-simple-center svg {
width: 20px;
height: 20px;
color: white;
}

/* 形狀變體 */
.nav-mode-simple .nav-simple-center.shape-circle {
border-radius: 50%;
width: 48px;
height: 48px;
padding: 0;
}

.nav-mode-simple .nav-simple-center.shape-oval {
border-radius: 50px;
width: auto;
height: auto;
padding: 10px 24px;
aspect-ratio: auto;
}

.nav-mode-simple .nav-simple-center.shape-square {
border-radius: 4px;
width: 48px;
height: 48px;
padding: 0;
}

.nav-mode-simple .nav-simple-center.shape-rounded {
border-radius: 12px;
width: 48px;
height: 48px;
padding: 0;
}

/* 風格變體 */
.nav-mode-simple .nav-simple-center.style-solid {
background: var(--nav-primary);
border-color: var(--nav-primary);
color: white;
}

.nav-mode-simple .nav-simple-center.style-outline {
background: transparent;
border-color: var(--nav-border);
color: var(--nav-text);
}

.nav-mode-simple .nav-simple-center.style-outline:hover {
border-color: var(--nav-primary);
color: var(--nav-primary);
background: transparent;
}

.nav-mode-simple .nav-simple-center.style-outline svg {
color: inherit;
}

.nav-mode-simple .nav-simple-center.style-flat {
background: transparent;
border-color: transparent;
color: var(--nav-text);
box-shadow: none;
}

.nav-mode-simple .nav-simple-center.style-flat:hover {
background: var(--nav-bg-hover);
color: var(--nav-primary);
transform: translateY(-2px);
box-shadow: none;
}

.nav-mode-simple .nav-simple-center.style-flat svg {
color: inherit;
}

/* 簡單模式 - 極簡風格 (Minimal) */
.simple-style-minimal .nav-simple-link {
background: transparent;
border-color: transparent;
padding: 10px 0; /* 減少左右 padding */
}

.simple-style-minimal .nav-simple-link:hover {
background: transparent;
border-color: transparent;
color: var(--nav-primary);
transform: none; /* 移除位移 */
box-shadow: none;
}

.simple-style-minimal .nav-simple-link:hover svg {
color: var(--nav-primary);
}

/* 簡單模式 - 響應式 */
@media (max-width: 768px) {
.nav-mode-simple {
gap: var(--nav-spacing-sm);
padding: var(--nav-spacing-md) 0;
/* 確保手機版堆疊模式生效 */
flex-wrap: wrap; 
}

/* 手機版堆疊模式 - 簡單模式 */
.post-navigation.mobile-stack.nav-mode-simple {
flex-direction: column;
align-items: stretch;
}

.post-navigation.mobile-stack.nav-mode-simple .nav-simple-prev,
.post-navigation.mobile-stack.nav-mode-simple .nav-simple-next {
justify-content: center; /* 堆疊時置中 */
width: 100%;
}

.post-navigation.mobile-stack.nav-mode-simple .nav-simple-link {
width: 100%;
justify-content: center;
}

/* 手機版並排模式 (雙欄) - 簡單模式 */
.post-navigation.mobile-columns.nav-mode-simple {
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
}

.post-navigation.mobile-columns.nav-mode-simple .nav-simple-prev,
.post-navigation.mobile-columns.nav-mode-simple .nav-simple-next {
flex: 1;
width: auto;
min-width: 0; /* 防止內容撐開 */
}

/* 確保連結內容在小螢幕不換行或適當縮放 */
.post-navigation.mobile-columns.nav-mode-simple .nav-simple-link {
width: 100%;
justify-content: center;
padding: 8px 4px; /* 減少內距以容納更多內容 */
}

/* 調整文字大小以適應並排 */
.post-navigation.mobile-columns.nav-mode-simple .nav-simple-text {
font-size: 12px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 80px; /* 限制文字寬度 */
display: inline-block;
}

.nav-mode-simple .nav-simple-link {
padding: 8px 16px;
font-size: 13px;
}

.nav-mode-simple .nav-simple-link svg {
width: 16px;
height: 16px;
}

.nav-mode-simple .nav-simple-center {
padding: 10px;
}

.nav-mode-simple .nav-simple-center svg {
width: 18px;
height: 18px;
}

/* Mobile Columns Text Visibility */
.post-navigation.mobile-columns.mobile-columns-text-hidden .nav-label-text,
.post-navigation.mobile-columns.mobile-columns-text-hidden .nav-title,
.post-navigation.mobile-columns.mobile-columns-text-hidden .nav-simple-text,
.post-navigation.mobile-columns.mobile-columns-text-hidden .nav-compact-label,
.post-navigation.mobile-columns.mobile-columns-text-hidden .nav-compact-title {
display: none !important;
}

/* Adjust spacing when text is hidden */
.post-navigation.mobile-columns.mobile-columns-text-hidden .nav-simple-link {
justify-content: center;
padding: 12px;
}
}

/* Desktop Text Visibility */
@media (min-width: 1025px) {
.post-navigation.desktop-text-hidden .nav-label-text,
.post-navigation.desktop-text-hidden .nav-title,
.post-navigation.desktop-text-hidden .nav-simple-text,
.post-navigation.desktop-text-hidden .nav-compact-label,
.post-navigation.desktop-text-hidden .nav-compact-title {
display: none !important;
}

/* Adjust spacing/layout when text is hidden */
.post-navigation.desktop-text-hidden .nav-simple-link {
justify-content: center;
}
}

/* Tablet Text Visibility */
@media (min-width: 769px) and (max-width: 1024px) {
.post-navigation.tablet-text-hidden .nav-label-text,
.post-navigation.tablet-text-hidden .nav-title,
.post-navigation.tablet-text-hidden .nav-simple-text,
.post-navigation.tablet-text-hidden .nav-compact-label,
.post-navigation.tablet-text-hidden .nav-compact-title {
display: none !important;
}

/* Adjust spacing/layout when text is hidden */
.post-navigation.tablet-text-hidden .nav-simple-link {
justify-content: center;
}
}

@media (max-width: 480px) {
.nav-mode-simple {
gap: var(--nav-spacing-xs);
}

.nav-mode-simple .nav-simple-link {
padding: 6px 12px;
font-size: 12px;
}

/* .nav-mode-simple .nav-simple-text {
display: none; 
} */

.nav-mode-simple .nav-simple-link svg {
width: 20px;
height: 20px;
}

.nav-mode-simple .nav-simple-center {
padding: 8px;
}

.nav-mode-simple .nav-simple-center svg {
width: 16px;
height: 16px;
}
}

/* ===================================== */


.post-navigation.loaded {
opacity: 1;
transform: translateY(0);
}


/* ========================================
   精簡導航模式 (Compact Mode)
======================================== */
.nav-mode-compact {
display: flex;
align-items: center;
justify-content: space-between;
gap: var(--nav-spacing-md);
position: relative;
}

.nav-compact {
flex: 1;
max-width: calc(50% - var(--nav-spacing-md));
}

.nav-compact a {
display: block;
padding: var(--nav-spacing-md);
background: var(--nav-bg);
border: 1px solid var(--nav-border);
border-radius: var(--nav-border-radius);
text-decoration: none;
transition: var(--nav-transition);
}

.nav-compact a:hover {
background: var(--nav-bg-hover);
border-color: var(--nav-primary);
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.nav-compact-label {
display: flex;
align-items: center;
gap: var(--nav-spacing-xs);
font-size: 12px;
color: var(--nav-primary);
font-weight: 600;
text-transform: uppercase;
margin-bottom: var(--nav-spacing-xs);
}

.nav-compact-label svg {
width: 14px;
height: 14px;
}

.nav-compact-title {
font-size: 16px;
font-weight: 600;
color: var(--nav-text);
margin: 0;
line-height: 1.4;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}

.nav-compact a:hover .nav-compact-title {
color: var(--nav-primary);
}

/* 精簡模式 - 中間按鈕 */
.nav-center-compact {
position: absolute;
left: 50%;
transform: translateX(-50%);
padding: 12px;
border-radius: 50%;
background: var(--nav-primary);
border: 3px solid var(--nav-bg);
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
z-index: 10;
display: flex;
align-items: center;
justify-content: center;
gap: var(--nav-spacing-sm);
text-decoration: none;
transition: var(--nav-transition);
}

.nav-center-compact:hover {
transform: translateX(-50%) scale(1.1);
box-shadow: 0 6px 20px rgba(37, 99, 235, 0.4);
}

.nav-center-compact svg {
width: 20px;
height: 20px;
color: white;
display: block;
}

.nav-center-compact.has-text {
border-radius: 50px;
padding: 10px 20px;
}

.nav-center-compact .nav-center-text {
color: white;
font-weight: 600;
font-size: 13px;
}

/* 精簡模式 - 響應式 */
@media (max-width: 768px) {
.nav-mode-compact {
flex-direction: column;
gap: var(--nav-spacing-lg);
}

.nav-compact {
max-width: 100%;
width: 100%;
}

.nav-center-compact {
position: static;
transform: none;
margin: calc(var(--nav-spacing-md) * -1) auto;
}

.nav-center-compact:hover {
transform: scale(1.1);
}

/* 手機版隱藏文字 - 已移除 */
/* .nav-center-compact.has-text .nav-center-text {
display: none;
} */

.nav-center-compact.has-text {
border-radius: 50%;
padding: 10px;
width: 44px;
height: 44px;
}

.nav-center-compact.icon-only {
width: 44px;
height: 44px;
padding: 10px;
}
}

/**
 * 強制修正文章導航雙欄寬度不均的問題
 */
.post-navigation.has-both-posts {
/* 移除 grid 佈局，改用更穩定的 flexbox 來處理 */
display: flex;
justify-content: space-between;
grid-template-columns: none; /* 關閉 grid 的欄位設定 */
gap: var(--nav-spacing-lg); /* 恢復間距 */
margin: 40px auto;
}

.post-navigation .nav-item {
/* 
 * 使用 flex 屬性進行彈性佈局
 * flex-grow: 1 -> 允許項目擴展
 * flex-shrink: 1 -> 允許項目收縮
 * flex-basis: calc(...) -> 理想的基礎寬度
 */
flex: 1 1 calc( (100% - var(--nav-spacing-lg)) / 2 );

/* 【關鍵備用】確保單個項目不會無限擴展 */
max-width: calc( (100% - var(--nav-spacing-lg)) / 2 );
}

/* 針對只有一個項目的特殊情況 */
.post-navigation .nav-item:only-child {
/* 當只有一個子元素時，取消其 flex-grow 屬性，防止它填滿整個寬度 */
flex-grow: 0;

/* 並且為了讓它能正確靠左或靠右，我們需要重置 justify-content */
}

/* 讓只有單個的「下一篇」按鈕能自動靠右 */
.post-navigation .nav-next:only-child {
margin-left: auto;
}



/* ========================================
   卡片基本樣式
======================================== */
.nav-item {
position: relative;
background: var(--nav-bg);
border-radius: var(--nav-border-radius);
overflow: hidden;
transition: var(--nav-transition);
box-shadow: var(--nav-shadow);
display: flex;
flex-direction: column;
}

.nav-item a {
display: flex;
flex-direction: column;
text-decoration: none;
color: var(--nav-text);
flex: 1;
position: relative;
}

/* ========================================
   風格變化
======================================== */
.post-navigation-default .nav-item {
border: 1px solid var(--nav-border);
}

.post-navigation-default .nav-item:hover {
transform: translateY(-4px);
box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

body.dark-mode .post-navigation-default .nav-item:hover {
box-shadow: 0 8px 20px rgba(0,0,0,0.4);
}

.post-navigation-card .nav-item {
box-shadow: 0 6px 16px rgba(0,0,0,0.08);
border: none;
}

.post-navigation-card .nav-item:hover {
box-shadow: 0 12px 28px rgba(0,0,0,0.15);
transform: translateY(-6px) scale(1.02);
}

body.dark-mode .post-navigation-card .nav-item:hover {
box-shadow: 0 12px 28px rgba(0,0,0,0.5);
}

.post-navigation-minimal .nav-item {
box-shadow: none;
border: 1px solid var(--nav-border);
background: transparent;
}

.post-navigation-minimal .nav-item:hover {
background: var(--nav-bg-hover);
border-color: var(--nav-primary);
}

.post-navigation-minimal .nav-title {
font-weight: 500;
}

.post-navigation-modern .nav-item {
border: 2px solid transparent;
background: linear-gradient(135deg, #f9fafb 0%, #ffffff 100%);
}

body.dark-mode .post-navigation-modern .nav-item {
background: linear-gradient(135deg, #1f2937 0%, #111827 100%);
}

.post-navigation-modern .nav-item:hover {
border-color: var(--nav-primary);
background: var(--nav-bg);
transform: translateY(-4px);
}

.post-navigation-modern .nav-title {
background: linear-gradient(135deg, var(--nav-primary) 0%, #7c3aed 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
}

.post-navigation-glass .nav-item {
background: rgba(255, 255, 255, 0.7);
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.3);
box-shadow: 0 8px 32px rgba(0,0,0,0.1);
}

body.dark-mode .post-navigation-glass .nav-item {
background: rgba(31, 41, 55, 0.7);
border: 1px solid rgba(255, 255, 255, 0.1);
}

.post-navigation-glass .nav-item:hover {
background: rgba(255, 255, 255, 0.85);
transform: translateY(-4px);
}

body.dark-mode .post-navigation-glass .nav-item:hover {
background: rgba(31, 41, 55, 0.85);
}

.post-navigation-gradient .nav-item {
position: relative;
background: var(--nav-bg);
}

.post-navigation-gradient .nav-item::before {
content: '';
position: absolute;
inset: -2px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);
border-radius: calc(var(--nav-border-radius) + 2px);
opacity: 0;
transition: opacity 0.3s ease;
z-index: -1;
}

.post-navigation-gradient .nav-item:hover::before {
opacity: 1;
}

/* ========================================
   導航標籤樣式
======================================== */
.label-style-header .nav-label {
display: flex;
align-items: center;
gap: var(--nav-spacing-sm);
padding: var(--nav-spacing-md);
padding-bottom: var(--nav-spacing-sm);
font-size: 14px;
font-weight: 600;
color: var(--nav-primary);
text-transform: uppercase;
letter-spacing: 0.05em;
}

.label-style-header .nav-previous .nav-label {
justify-content: flex-start;
}

.label-style-header .nav-next .nav-label {
justify-content: flex-end;
}

.label-style-header .nav-label-icon {
width: 16px;
height: 16px;
flex-shrink: 0;
color: var(--nav-primary);
}

.label-style-header .nav-label-text {
color: var(--nav-primary);
}

.label-style-overlay .nav-label {
position: absolute;
z-index: 10;
background: rgba(0, 0, 0, 0.8);
color: white;
padding: var(--nav-spacing-sm) var(--nav-spacing-md);
border-radius: 6px;
font-size: 13px;
font-weight: 600;
backdrop-filter: blur(8px);
display: flex;
align-items: center;
gap: var(--nav-spacing-xs);
}

.label-style-overlay .nav-label * {
color: white;
}

.label-style-overlay .nav-previous .nav-label {
top: var(--nav-spacing-md);
left: var(--nav-spacing-md);
}

.label-style-overlay .nav-next .nav-label {
top: var(--nav-spacing-md);
right: var(--nav-spacing-md);
}

.label-style-arrow .nav-label {
display: none;
}

.label-style-arrow .nav-arrow-indicator {
display: flex !important;
align-items: center;
justify-content: center;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 48px;
height: 48px;
background: var(--nav-primary);
color: white;
border-radius: 50%;
opacity: 0;
transition: var(--nav-transition);
z-index: 10;
pointer-events: none;
}

.label-style-arrow .nav-arrow-indicator svg {
color: white;
stroke: white;
}

.label-style-arrow .nav-previous .nav-arrow-indicator {
left: var(--nav-spacing-md);
}

.label-style-arrow .nav-next .nav-arrow-indicator {
right: var(--nav-spacing-md);
}

.label-style-arrow .nav-item:hover .nav-arrow-indicator {
opacity: 1;
}

.nav-arrow-indicator {
display: none;
}

/* ========================================
   響應式佈局系統 - 關鍵修正
======================================== */

/* 主容器 */
.nav-main {
display: flex;
flex: 1;
width: 100%; 
}

/* 桌機版 - 圖片在上方(滿版) */
.layout-desktop-top .nav-main {
flex-direction: column;
}

.layout-desktop-top .nav-thumb {
width: 100%;
position: relative;
flex-shrink: 0;
}

/* 使用 padding-bottom 維持長寬比 */
.layout-desktop-top .nav-thumb::after {
content: '';
display: block;
padding-bottom: calc(100% / (var(--post-nav-top-img-ratio)));
}

.layout-desktop-top .nav-thumb img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: cover;
}

/* 桌機版 - 圖片在側邊 */
.layout-desktop-side .nav-main {
flex-direction: row;
gap: var(--nav-spacing-md);
}

.layout-desktop-side .nav-thumb {
flex-shrink: 0;
width: var(--post-nav-side-img-width);
height: var(--post-nav-side-img-height);
position: relative;
}

.layout-desktop-side .nav-thumb img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.layout-desktop-side .desktop-image-left .nav-main {
flex-direction: row;
}

.layout-desktop-side .desktop-image-right .nav-main {
flex-direction: row-reverse;
}

/* 垂直對齊 */
.valign-center.layout-desktop-side .nav-main {
align-items: center;
}

.valign-top.layout-desktop-side .nav-main {
align-items: flex-start;
}

/* ========================================
   圖片樣式
======================================== */
.nav-thumb {
overflow: hidden;
background: #f3f4f6;
}

body.dark-mode .nav-thumb {
background: #374151;
}

.nav-thumb img {
width: 100%;
height: 100%;
object-fit: var(--post-nav-img-fit);
transition: var(--nav-transition);
display: block;
}

/* Hover 效果 */
.nav-item:hover .nav-thumb img {
transform: scale(1.1);
}

[style*="--nav-hover-effect: none"] .nav-item:hover .nav-thumb img {
transform: none;
}

[style*="--nav-hover-effect: brightness"] .nav-item:hover .nav-thumb img {
transform: none;
filter: brightness(1.1);
}

/* 圖片載入骨架 */
.nav-thumb::before {
content: '';
position: absolute;
inset: 0;
background: linear-gradient(90deg, #f3f4f6 25%, #e5e7eb 50%, #f3f4f6 75%);
background-size: 200% 100%;
animation: skeleton-loading 1.5s infinite;
z-index: 1;
pointer-events: none;
opacity: 1;
transition: opacity 0.3s ease;
}

body.dark-mode .nav-thumb::before {
background: linear-gradient(90deg, #374151 25%, #4b5563 50%, #374151 75%);
}

/* 圖片載入完成後立即停止動畫並隱藏骨架 */
.nav-thumb.image-loaded::before {
animation: none !important;
opacity: 0;
display: none;
}

/* 圖片本身也在 z-index 之上 */
.nav-thumb img {
position: relative;
z-index: 2;
}

@keyframes skeleton-loading {
0% { background-position: 200% 0; }
100% { background-position: -200% 0; }
}

/* ========================================
   內容區樣式
======================================== */
.nav-content {
flex: 1;
display: flex;
flex-direction: column;
gap: var(--nav-spacing-sm);
padding: var(--nav-spacing-md);
min-width: 0;
justify-content: space-between; /* <-- 新增這一行 */
}
/* ========================================
   標題樣式
======================================== */
.nav-title {
font-size: 18px;
font-weight: 700;
line-height: 1.4; /* 關鍵：行高為 1.4 */
color: var(--nav-text);
margin: 0;
display: -webkit-box;
-webkit-line-clamp: var(--post-nav-title-lines);
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
transition: color 0.2s ease;
min-height: calc(1.4em * var(--post-nav-title-lines));
}

.nav-item:hover .nav-title {
color: var(--nav-primary);
}

.post-navigation-modern .nav-title {
position: relative;
padding-bottom: 4px;
}

.post-navigation-modern .nav-title::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 0;
height: 2px;
background: var(--nav-primary);
transition: width 0.3s ease;
}

.post-navigation-modern .nav-item:hover .nav-title::after {
width: 100%;
}

.post-navigation-card .nav-item:hover .nav-title {
font-weight: 800;
}

/* ========================================
   Meta 資訊樣式
======================================== */
.nav-meta {
display: flex;
flex-wrap: wrap;
gap: var(--nav-spacing-md);
font-size: 13px;
color: var(--nav-text-secondary);
margin-top: var(--nav-spacing-xs);
}

.nav-meta > * {
display: flex;
align-items: center;
gap: 6px;
color: var(--nav-text-secondary);
}

.nav-meta svg {
width: 14px;
height: 14px;
flex-shrink: 0;
opacity: 0.7;
}

.nav-category {
background: #dbeafe;
color: #1e40af;
padding: 4px 10px;
border-radius: 4px;
font-weight: 500;
}

body.dark-mode .nav-category {
background: rgba(37, 99, 235, 0.2);
color: #93c5fd;
}

.nav-date,
.nav-read-time,
.nav-author {
opacity: 0.8;
}

.nav-item:hover .nav-meta > * {
opacity: 1;
}

/* ========================================
   摘要樣式
======================================== */
.nav-excerpt {
font-size: 14px;
line-height: 1.6;
color: var(--nav-text-secondary);
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
margin-top: auto;
}

.nav-item:hover .nav-excerpt {
color: var(--nav-text);
}

/* ========================================
   載入動畫
======================================== */
.animation-none {
opacity: 1;
transform: none;
}

.animation-fade-up.loaded {
animation: fadeUp 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes fadeUp {
from {
opacity: 0;
transform: translateY(30px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

.animation-fade-in.loaded {
animation: fadeIn 0.6s ease forwards;
}

@keyframes fadeIn {
from { opacity: 0; }
to { opacity: 1; }
}

.animation-slide-in .nav-previous {
transform: translateX(-30px);
}

.animation-slide-in .nav-next {
transform: translateX(30px);
}

.animation-slide-in.loaded .nav-item {
animation: slideIn 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes slideIn {
to {
opacity: 1;
transform: translateX(0);
}
}

/* ========================================
   響應式斷點 - 平板
======================================== */
@media (max-width: 1024px) and (min-width: 769px) {
.layout-tablet-top .nav-main {
flex-direction: column !important;
}

.layout-tablet-top .nav-thumb {
width: 100% !important;
height: auto !important;
}

.layout-tablet-side .tablet-image-left .nav-main {
flex-direction: row !important;
}

.layout-tablet-side .tablet-image-right .nav-main {
flex-direction: row-reverse !important;
}
}

/* ========================================
   響應式斷點 - 手機(根據後台設定)
======================================== */
@media (max-width: 768px) {
.nav-title {
font-size: 16px;
}

.nav-content {
padding: var(--nav-spacing-md);
}

.nav-meta {
font-size: 12px;
gap: var(--nav-spacing-sm);
}

.nav-excerpt {
font-size: 13px;
}

/* 手機版堆疊模式(由後台設定控制) - 修正 */
.post-navigation.mobile-stack.has-both-posts {
flex-direction: column; /* 1. 將主軸方向改為垂直 */
gap: var(--nav-spacing-md); /* 2. 設定堆疊間距 */
}

.post-navigation.mobile-stack.divider-enabled.has-both-posts.divider-position-auto .post-nav-divider {
display: block;
order: 3;
}

.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-previous,
.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-simple-prev,
.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-arrow-prev {
order: 1;
}

.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-center-full,
.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-simple-center,
.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-center-button {
order: 2;
}

.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-next,
.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-simple-next,
.post-navigation.mobile-stack.divider-enabled.has-both-posts .nav-arrow-next {
order: 4;
}

.post-navigation.mobile-stack.has-both-posts .nav-item {
width: 100%; /* 3. 將導航項目寬度重設為 100% */
}

/* 當只有單一導航項目時，也確保其為單欄 */
.post-navigation.mobile-stack:not(.has-both-posts) {
grid-template-columns: 1fr;
}

/* 手機版並排模式(保持雙欄) */
.post-navigation.mobile-columns.has-both-posts {
grid-template-columns: repeat(2, 1fr) !important;
gap: var(--nav-spacing-sm);
}

/* 手機版並排時縮小字體 */
.post-navigation.mobile-columns .nav-title {
font-size: 14px;
-webkit-line-clamp: 2;
}

.post-navigation.mobile-columns .nav-content {
padding: var(--nav-spacing-sm);
}

.post-navigation.mobile-columns .nav-excerpt {
font-size: 12px;
-webkit-line-clamp: 1;
}

/* 手機版強制上方佈局 */
.layout-mobile-top .nav-main {
flex-direction: column !important;
}

.layout-mobile-top .nav-thumb {
width: 100% !important;
height: auto !important;
}

/* 手機版側邊佈局 */
.layout-mobile-side .mobile-image-left .nav-main {
flex-direction: row !important;
}

.layout-mobile-side .mobile-image-right .nav-main {
flex-direction: row-reverse !important;
}

.layout-mobile-side .nav-thumb {
width: 100px !important;
height: 100px !important;
}

.label-style-arrow .nav-arrow-indicator {
width: 36px;
height: 36px;
}

/* 手機版堆疊模式(由後台設定控制) - 修正 */
.post-navigation.mobile-stack { /* .has-both-posts 已被移除，更通用 */
flex-direction: column; /* 1. 將主軸方向改為垂直 */
gap: var(--nav-spacing-md); /* 2. 設定堆疊間距 */
}

.post-navigation.mobile-stack .nav-item,
.post-navigation.mobile-stack .nav-item:only-child {
width: 100%; /* 3. 將導航項目寬度重設為 100% */
max-width: 100%; /* 4. 同時也要重設 max-width */
margin-left: 0; /* 5. 重置 margin */
}


/* ========== 新增箭頭模式手機版 ========== */
.nav-mode-arrow {
gap: var(--nav-spacing-md);
}

.nav-arrow {
padding: 10px 16px;
font-size: 13px;
}

/* .nav-arrow-text {
display: none; 
} */

.nav-arrow svg {
width: 18px;
height: 18px;
}

.nav-center-button {
padding: 10px 16px;
}

/* .nav-center-text {
display: none; 
} */

.nav-center-button svg {
width: 18px;
height: 18px;
}


}
/* ========== 新增極小螢幕最佳化 ========== */
@media (max-width: 480px) {
.nav-mode-arrow {
gap: var(--nav-spacing-sm);
}

.nav-arrow {
padding: 8px 12px;
}

.nav-center-button {
padding: 8px 12px;
}
}
/* ===================================== */

/* ========================================
   無障礙增強
======================================== */
.nav-item a:focus-visible {
outline: 3px solid var(--nav-primary);
outline-offset: 4px;
}


/* ========================================
   列印樣式
======================================== */
@media print {
.post-navigation {
break-inside: avoid;
box-shadow: none !important;
}

.nav-item {
border: 1px solid #ddd !important;
page-break-inside: avoid;
}

.nav-arrow-indicator,
.keyboard-hint,
.dark-mode-toggle {
display: none !important;
}
}

/* ========================================
   效能最佳化
======================================== */
.post-navigation * {
will-change: auto;
}

.nav-item:hover {
will-change: transform, box-shadow;
}

.nav-thumb img {
content-visibility: auto;
}

/* ========================================
   針對小螢幕裝置的字體最佳化
======================================== */
@media (max-width: 480px) {
.post-navigation .nav-title {
/* 在螢幕寬度小於 480px 時，將標題字體縮小到 15px */
font-size: 15px; 
}

/* 如果您希望在小螢幕上並排顯示時，摘要也少顯示一點 */
.post-navigation.mobile-columns .nav-excerpt {
-webkit-line-clamp: 1; /* 摘要只顯示 1 行 */
}
}

/*
 * 現代化的 Clearfix 技巧
 * 應用於主內容與側邊欄的外層容器
 */
/* #postshow-all::after {
content: ""; 
display: table;  
clear: both; 
}*/

/* 
 * 同時，建議為您的主容器 .container 也加上，確保萬無一失
 */
/*.container::after {
content: "";
display: table;
clear: both;
}*/

/* ========================================
   Header Label Refinement
======================================== */
.post-navigation .nav-label,
.post-navigation .nav-label-text {
min-width: 0;
}

.post-navigation .nav-label-text {
overflow-wrap: anywhere;
word-break: break-word;
}

.label-style-header .nav-label {
display: flex;
align-items: center;
gap: var(--nav-spacing-sm);
width: 100%;
padding: var(--nav-spacing-md);
padding-bottom: var(--nav-spacing-sm);
font-size: 14px;
font-weight: 600;
color: var(--nav-primary);
letter-spacing: 0.05em;
line-height: 1.35;
text-transform: uppercase;
}

.label-style-header.label-text-full .nav-label {
font-size: 13px;
letter-spacing: 0.03em;
}

.label-style-header.label-text-full .nav-label-text {
white-space: normal;
}

.label-style-header.has-label-bottom-line .nav-label {
border-bottom: 1px solid var(--nav-border);
}

.label-style-header.no-label-bottom-line .nav-label {
border-bottom: 0;
padding-bottom: var(--nav-spacing-md);
}

.label-style-header .nav-main {
padding-top: 0;
}

.label-style-header .nav-label-icon {
flex: 0 0 auto;
}

@media (max-width: 768px) {
.label-style-header .nav-label {
padding-right: 12px;
padding-left: 12px;
font-size: 13px;
}
}

@media (max-width: 480px) {
.label-style-header .nav-label {
padding-top: 12px;
padding-bottom: 10px;
letter-spacing: 0.02em;
}
}


/* === author-box.css === */
/* === 作者資訊區塊 === */
.author-box-container {
margin: 40px 0;
padding: 30px;
background: #fafafa;
border-radius: 8px;
border: 1px solid #eee;
}
.ab-header {
display: flex;
justify-content: space-between;
align-items: flex-end; /* Align tabs to bottom */
border-bottom: 2px solid #e5e5e5;
margin-bottom: 25px;
/* padding-bottom: 10px; Removed to align tabs with border */
flex-wrap: wrap;
gap: 15px;
}
.ab-tabs { 
display: flex; 
gap: 20px; 
margin-bottom: -2px; /* Overlap active line with border */
}
.ab-tab-btn {
background: none; 
border: none; 
font-size: 1rem; 
font-weight: 600;
color: #333; 
cursor: pointer; position: relative; padding: 0 0 15px 0;
}
.ab-tab-btn.active { color: #e91e63; }
.ab-tab-btn .post-count {
background: #e91e63;
color: #fff;
font-size: 12px;
padding: 2px 8px;
border-radius: 12px;
margin-left: 5px;
vertical-align: middle;
transition: all 0.3s ease;
font-weight: normal;
}
.ab-tab-btn.active::after {
content: ''; position: absolute; bottom: 0px; left: 0; width: 100%;
height: 3px; background: #e91e63; z-index: 1;
}
.ab-actions { 
display: flex; 
align-items: center; 
gap: 15px; 
padding-bottom: 15px; /* Align with tab text baseline */
}

/* 視圖切換按鈕 */
.ab-view-toggle {
display: none; /* 預設隱藏，切換到最近文章頁籤時由 JS 顯示 */
gap: 4px; 
background: #fff; 
padding: 3px; 
border: 1px solid #ddd; 
border-radius: 4px; 
transition: opacity 0.3s ease;
}
.ab-view-btn {
background: none; border: none; padding: 4px 6px; cursor: pointer; color: #999; display: flex;
}
.ab-view-btn.active { background: #e91e63; color: #fff; border-radius: 3px; }

/* 文章一覽表連結 - 按鈕風格 */
.ab-view-all { 
display: inline-flex;
align-items: center;
gap: 6px;
padding: 6px 12px;
font-size: 14px;
font-weight: 500;
color: #666;
text-decoration: none;
background: #f5f5f5;
border: 1px solid #e0e0e0;
border-radius: 4px;
transition: all 0.2s ease;
}
.ab-view-all svg {
width: 16px;
height: 16px;
transition: transform 0.2s ease;
}
.ab-view-all:hover { 
color: #e91e63;
background: #fff;
border-color: #e91e63;
}
.ab-view-all:hover svg {
transform: translateX(2px);
}

/* Tab 內容 */
.ab-content { display: none; animation: fadeIn 0.5s; }
.ab-content.active { display: block; }
@keyframes fadeIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }

/* 作者內容 - 採用 author.php 風格 */
.ab-author-wrap { 
display: grid;
grid-template-columns: 96px minmax(0, 1fr);
grid-template-rows: auto;
gap: 0 20px; /* 增加欄位間距 */
grid-template-areas: 
"avatar content"
"avatar social";
background: #fff;
padding: 22px 24px;
border: 1px solid #e6edf3;
border-radius: 18px;
}
.ab-avatar { 
grid-area: avatar;
padding: 0;
display: flex;
align-items: flex-start; /* 圖片靠上 */
justify-content: flex-start;
}
.ab-avatar a {
pointer-events: none; /* 禁用頭像連結 */
cursor: default;
}
.ab-avatar picture,
.ab-avatar a,
.ab-avatar img {
display: block;
line-height: 0;
}
.ab-avatar picture,
.ab-avatar a {
width: 96px;
max-width: 96px;
}
.ab-avatar img { 
width: 96px;
height: 96px;
max-width: 96px;
aspect-ratio: 1;
object-fit: cover;
border: none;
}
.author-avatar-shape-circle .ab-avatar img,
.ab-avatar--circle img {
border-radius: 50%;
}
.author-avatar-shape-square .ab-avatar img,
.ab-avatar--square img {
border-radius: 0;
}
.ab-info {
grid-area: content;
min-width: 0;
padding: 0;
background: transparent;
word-break: normal;
overflow-wrap: anywhere;
}
.ab-name { 
margin: 0 0 10px;
font-size: 1.25rem;
font-weight: 900;
letter-spacing: 0;
line-height: 1.4;
text-align: left;
display: block;
}
.author-post-count {
background: #e91e63;
color: #fff;
font-size: 12px;
padding: 2px 8px;
border-radius: 12px;
font-weight: normal;
margin-left: 10px;
display: inline-block;
}
.ab-bio { 
margin: 0;
color: #666; 
line-height: 1.8;
text-align: left;
}

.ab-bio p { 
font-size: 1rem;
margin: 0;
}

/* 作者社群按鈕區域 */
.ab-social-area {
grid-area: social;
display: grid;
gap: 10px;
padding: 14px 0 0;
opacity: 1;
align-content: start;
justify-items: start;
text-align: left;
}

.ab-social-text-links {
display: flex;
flex-wrap: wrap;
gap: 10px;
margin: 0;
}

.ab-social-area--align-left {
justify-items: start;
text-align: left;
}

.ab-social-area--align-center {
justify-items: center;
text-align: center;
}

.ab-social-area--align-right {
justify-items: end;
text-align: right;
}

.ab-social-area--align-left .ab-social-text-links,
.ab-social-area--align-left .ab-social-links,
.ab-social-area--align-left .ab-social-icons {
justify-content: flex-start;
}

.ab-social-area--align-center .ab-social-text-links,
.ab-social-area--align-center .ab-social-links,
.ab-social-area--align-center .ab-social-icons {
justify-content: center;
}

.ab-social-area--align-right .ab-social-text-links,
.ab-social-area--align-right .ab-social-links,
.ab-social-area--align-right .ab-social-icons {
justify-content: flex-end;
}

.ab-social-text-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    font-size: 13px;
    font-weight: 500;
    color: #666;
    text-decoration: none;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    transition: all 0.2s ease;
    min-height: auto;
}

.ab-social-text-link:hover {
    color: #e91e63;
    background: #fff;
    border-color: #e91e63;
    text-decoration: none;
}

.ab-social-text-icon {
    font-size: 12px;
}

/* 作者社群按鈕 */
.ab-social-links {
display: flex;
gap: 8px;
margin: 0;
flex-wrap: wrap;
}
.ab-social-btn {
display: inline-flex;
align-items: center;
justify-content: center;
width: 32px;
height: 32px;
border-radius: 16px; /* pill shape */
color: #fff !important;
text-decoration: none !important; /* 移除底線 */
border: 1px solid transparent;
transition: all 0.2s ease;
}
.ab-social-btn i {
font-size: 14px;
color: #fff !important;
}
.ab-social-facebook {
background-color: #1877f2;
border-color: #1877f2;
}
.ab-social-twitter {
background-color: #000;
border-color: #000;
}
.ab-social-instagram {
background-color: #e4405f;
border-color: #e4405f;
}
.ab-social-linkedin {
background-color: #0a66c2;
border-color: #0a66c2;
}
.ab-social-youtube {
background-color: #f00;
border-color: #f00;
}
.ab-social-website {
background-color: #666;
border-color: #666;
}
.ab-social-btn:hover {
transform: translateY(-2px);
opacity: 0.9;
text-decoration: none !important; /* hover 時也不要底線 */
}

/* 移除所有 author box 內連結的底線 */
.author-box-container a {
text-decoration: none;
}
.author-box-container a:hover {
text-decoration: none !important;
}

/* 文章列表 (預設清單) */
.ab-posts-list { display: flex; flex-direction: column; gap: 20px; }
.ab-posts-list.view-list .ab-post-item { flex-direction: row; align-items: flex-start; }
.ab-post-item {
display: flex;
align-items: center;
gap: 20px;
background: #fff;
padding: 15px;
border-radius: 8px;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
transition: transform 0.2s ease, box-shadow 0.2s ease;
border: 1px solid #eee;
}
.ab-post-item:hover {
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.ab-post-item[data-clickable="true"] {
cursor: pointer;
}
.ab-post-item[data-clickable="true"]:hover {
border-color: #e91e63;
}
.ab-thumb img { width: 120px; height: 80px; object-fit: cover; border-radius: 4px; }
.ab-post-info { flex: 1; }
.ab-meta { font-size: 12px; color: #999; margin-bottom: 5px; }
.ab-post-date { color: #e91e63; }
.ab-post-title { margin: 0 0 5px; font-size: 16px; }
.ab-post-title a { text-decoration: none; color: #333; }
.ab-excerpt { font-size: 13px; color: #777; margin: 0; line-height: 1.5; }

/* 文章列表 (網格模式) */
.ab-posts-list.view-grid {
display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px;
}
.ab-posts-list.view-grid .ab-post-item { flex-direction: column; gap: 10px; }
.ab-posts-list.view-grid .ab-thumb img { width: 100%; height: 140px; }

/* 查看更多按鈕 */
.ab-view-more-container {
text-align: center;
margin-top: 20px;
grid-column: 1 / -1; /* Ensure it spans full width in grid */
}
.ab-view-more-btn {
display: inline-block;
padding: 8px 25px;
background: #fff;
color: #666;
border: 1px solid #ddd;
border-radius: 20px;
text-decoration: none;
font-size: 14px;
transition: all 0.3s ease;
}
.ab-view-more-btn:hover {
background: #e91e63;
color: #fff;
border-color: #e91e63;
}

/* === 社群互動區塊 === */
.social-box-wrapper { margin: 40px 0; }
.social-box-container {
display: flex; gap: 20px; padding: 25px; background: #4a4a4a;
color: #fff; border-radius: 8px; align-items: center;
}
.sb-image img { width: 250px; border-radius: 6px; display: block; }
.sb-content { flex: 1; text-align: center; }
.sb-title { font-size: 22px; margin: 0 0 5px; color: #fff; }
.sb-subtitle { margin: 0 0 20px; opacity: 0.9; }
.sb-buttons { display: flex; flex-direction: column; gap: 12px; align-items: center; }
.sb-btn {
display: inline-flex; justify-content: center; align-items: center;
padding: 10px 25px; border-radius: 4px; text-decoration: none; color: #fff;
font-weight: bold; min-width: 200px; transition: transform 0.2s;
}
.sb-btn:hover { transform: translateY(-2px); color: #fff; }
.sb-share-btn.facebook, .sb-follow-btn.facebook { background: #1877f2; }
.sb-share-btn.line { background: #00c300; }
.sb-share-btn.twitter { background: #1da1f2; }
.sb-follow-btn.google_news_follow { background: #4285f4; }

/* GN 橫幅 */
.gn-banner {
margin-top: 20px; background: #e8f0fe; padding: 15px; border-radius: 6px;
text-align: center; border: 1px solid #d2e3fc;
}
.gn-banner a { text-decoration: none; color: #1967d2; font-weight: 600; display: flex; align-items: center; justify-content: center; gap: 10px; }
.gn-icon { width: 24px; height: 24px; }

@media (max-width: 768px) {
.author-box-container {
    padding: 15px; /* Slightly reduced padding */
    margin: 25px 0;
}

/* Header Stacking & Centering */
.ab-header {
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding-bottom: 0;
    border-bottom: none; /* Mobile header doesn't need a full border-bottom here if tabs have it */
}

.ab-tabs {
    width: 100%;
    justify-content: center; 
    border-bottom: 2px solid #e5e5e5;
    padding-bottom: 0;
    flex-wrap: wrap;
}

.ab-tab-btn {
    font-size: 0.95rem;
    padding: 0 5px 12px 5px;
}

.ab-actions {
    width: 100%;
    justify-content: center; 
    gap: 10px;
    padding-bottom: 0;
    flex-wrap: wrap;
}

.ab-view-all {
    width: auto; /* Don't force full width if not needed */
    min-width: 140px;
    justify-content: center;
    margin-top: 0;
}

/* Author Info Stacking & Centering */
.ab-author-wrap {
    grid-template-columns: 1fr;
    grid-template-areas: 
        "avatar"
        "content"
        "social";
    text-align: center;
    padding: 20px 15px;
    gap: 15px 0;
    border-radius: 12px;
}

.ab-avatar {
padding: 0;
justify-content: center; /* 圖片置中 */
}

.ab-avatar img {
width: 88px;
height: 88px;
max-width: 88px;
margin: 0 auto;
}

.ab-avatar picture,
.ab-avatar a {
width: 88px;
max-width: 88px;
}

.ab-info {
padding: 0;
}

.ab-name {
text-align: center;
margin-bottom: 12px;
}

.ab-bio {
text-align: center;
margin-bottom: 0;
}

.ab-social-area {
justify-items: center;
text-align: center;
padding-top: 8px;
}

.ab-social-text-links,
.ab-social-links {
    justify-content: center; 
    gap: 8px;
}

.ab-social-text-link {
    font-size: 0.85rem; /* Smaller text for mobile buttons */
    padding: 5px 10px;
}

.ab-social-icons {
justify-content: center;
}

.ab-social-area--align-left {
justify-items: start;
text-align: left;
}

.ab-social-area--align-center {
justify-items: center;
text-align: center;
}

.ab-social-area--align-right {
justify-items: end;
text-align: right;
}

.ab-social-area--align-left .ab-social-text-links,
.ab-social-area--align-left .ab-social-links,
.ab-social-area--align-left .ab-social-icons {
justify-content: flex-start;
}

.ab-social-area--align-center .ab-social-text-links,
.ab-social-area--align-center .ab-social-links,
.ab-social-area--align-center .ab-social-icons {
justify-content: center;
}

.ab-social-area--align-right .ab-social-text-links,
.ab-social-area--align-right .ab-social-links,
.ab-social-area--align-right .ab-social-icons {
justify-content: flex-end;
}

/* Post List - Keep horizontal but ensure it fits */
.ab-posts-list.view-list .ab-post-item {
flex-direction: row;
align-items: center;
}

.ab-post-item {
flex-direction: row;
align-items: center;
}

.ab-thumb img {
    width: 100px;
    height: 70px;
    margin-bottom: 0;
    margin-right: 15px;
    object-fit: cover; /* Added for better image display */
}

/* Mobile specific post item refinements */
@media (max-width: 480px) {
    .ab-post-item {
        flex-direction: column;
        align-items: flex-start;
    }
    .ab-thumb img {
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
        margin-right: 0;
        margin-bottom: 10px;
    }
}

/* Social Box RWD */
@media (max-width: 768px) {
    .social-box-container {
        flex-direction: column;
        text-align: center;
        padding: 20px;
    }
    .sb-image img {
        width: 100%;
        max-width: 300px;
        margin-bottom: 15px;
    }
    .sb-title {
        font-size: 1.2rem;
    }
    .sb-btn {
        width: 100%;
        min-width: 0;
    }
}

.ab-post-info {
width: auto;
flex: 1;
}

/* Social Box RWD (Legacy support) */
.social-box-container { flex-direction: column; }
.sb-image img { width: 100%; }
}


/* === social-share.css === */
/* ========================================
   社群分享區塊樣式 - 完整增強版 (模組化版本)
   ======================================== */

/* === 通用容器 === */
.social-share-wrapper {
margin: 50px 0;
padding-top: var(--social-share-padding-top, 0);
padding-bottom: var(--social-share-padding-bottom, 0);
display: grid;
gap: 20px;
}

.social-module-group:not(:first-child) {
margin-top: 25px;
}

.social-module-group--legacy {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: center;
}

/* === 標準版面 === */
.social-share-container {
display: flex;
align-items: center;
gap: 0px;
padding: 30px;
background: #4a4a4a;
border-radius: 8px;
align-items: stretch;
background: #333; /* Dark background matching mockup */
border-radius: 0; /* Mockup looks square or slightly rounded, let's go with 0 or small radius if user wants, but usually full width blocks are square. User said "like this", image shows sharp edges or small radius. Let's keep 0 for now or small. */
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
overflow: hidden;
padding: 0;
min-height: 220px; /* Reduced height */
}

.social-share-container:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.15);
}

/* === 圖片區域 === */
.social-share-image {
width: 46%; /* Reduced width slightly to give more room to content if needed, or keep 50% */
min-width: 220px;
margin: 0;
padding: 0;
display: flex;
position: relative;
background-color: #000; /* Background for letterboxing */
}

.social-share-image img {
width: 100%;
height: 100%;
object-fit: contain; /* Ensure full image is visible */
border-radius: 0;
display: block;
position: absolute;
top: 0;
left: 0;
transition: transform 0.3s ease;
}

.social-share-image:hover img {
transform: scale(1.05);
}

/* === 內容區域 === */
.social-share-content {
flex: 1;
padding: 20px; /* Reduced padding */
display: flex;
flex-direction: column;
justify-content: center;
align-items: center; /* Center align content */
background: #333; /* Dark background */
color: #fff; /* White text */
box-shadow: none;
border-radius: 0;
}
.social-share-title {
margin: 0 0 10px; /* Reduced margin */
font-size: 1.3rem; /* Slightly smaller font */
font-weight: 700;
color: #fff;
text-align: center;
line-height: 1.3;
}

.social-share-group-label {
display: inline-flex;
align-items: center;
justify-content: center;
margin: 0 0 8px;
padding: 3px 10px;
border: 1px solid rgba(255,255,255,0.28);
border-radius: 999px;
font-size: 0.78rem;
font-weight: 700;
letter-spacing: .04em;
color: rgba(255,255,255,0.86);
}



.social-share-subtitle {
margin: 0 0 15px; /* Reduced margin */
color: #eee;
font-size: 0.95rem;
line-height: 1.5;
text-align: center;
opacity: 0.9;
}

/* === 按鈕包裝器 === */
.social-button-wrapper {
display: flex;
flex-wrap: wrap;
gap: 8px; /* Reduced gap */
margin-top: 10px; /* Reduced margin */
justify-content: center; /* Center buttons */
}

/* Horizontal Layout: Allow Wrap for bookmark row */
.social-button-wrapper.layout-horizontal {
flex-wrap: wrap; /* Allow wrap for bookmark row */
overflow-x: auto; /* Allow scrolling if needed */
-webkit-overflow-scrolling: touch;
padding-bottom: 5px; /* Space for scrollbar if it appears */
justify-content: center; /* Center buttons */
}

/* ISB integration: keep Box layout while using inline-share-button renderer */
.social-button-wrapper .social-module-group--isb {
width: 100%;
display: flex;
justify-content: center;
}

.social-button-wrapper .social-module-group--isb .isb-container {
justify-content: center;
margin: 0;
}

/*
 * Embedded ISB buttons inside the Box social share wrapper must stay inline.
 * Single templates also have article-level `.isb-container` rules for share
 * rails; reset those here so the primary share module keeps its own layout.
 */
.social-button-wrapper .social-module-group--isb .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right) {
display: flex !important;
flex-wrap: wrap;
align-items: center;
justify-content: center;
gap: var(--isb-gap, 8px);
width: auto !important;
max-width: none !important;
min-width: 0 !important;
position: static !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
transform: none !important;
margin: 0 !important;
padding: 0 !important;
background: transparent !important;
border: 0 !important;
border-radius: 0 !important;
box-shadow: none !important;
opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important;
}

.social-button-wrapper .social-module-group--isb .isb-btn {
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.social-button-wrapper .social-module-group--isb .isb-btn:hover {
transform: translateY(-2px);
box-shadow: 0 5px 12px rgba(0,0,0,0.15);
opacity: 0.95;
}

/* Bookmark row - force new line */
.social-button-wrapper .bookmark-row {
flex-basis: 100%;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
gap: 8px;
margin-top: 12px;
order: 100;
}

.social-button-wrapper .bookmark-row .bookmark-item {
display: flex;
align-items: center;
}

/* Unified bookmark button styles */
.social-button-wrapper .bookmark-row .hd-bookmark-btn,
.social-button-wrapper .bookmark-row .hd-bookmark-collection-link {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 5px;
padding: 6px 12px;
border-radius: 50px;
font-weight: 500;
font-size: 0.9rem;
min-width: 100px;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
transition: all 0.3s ease;
cursor: pointer;
text-decoration: none !important;
}

.social-button-wrapper .bookmark-row .hd-bookmark-btn {
background: var(--hd-bookmark-color, #e11d48);
border: none;
color: #fff !important;
}

.social-button-wrapper .bookmark-row .hd-bookmark-collection-link {
background: transparent;
border: 2px solid var(--hd-bookmark-color, #e11d48);
color: var(--hd-bookmark-color, #e11d48) !important;
}

.social-button-wrapper .bookmark-row .hd-bookmark-btn:hover,
.social-button-wrapper .bookmark-row .hd-bookmark-collection-link:hover {
transform: translateY(-2px);
opacity: 0.9;
}

.social-button-wrapper .bookmark-row .hd-bookmark-wrapper {
margin: 0;
}

/* Vertical Layout: Stacked & Centered */
.social-button-wrapper.layout-vertical {
flex-direction: column;
align-items: center; /* Center items horizontally */
width: 100%;
margin-left: auto;
margin-right: auto;
}

.social-button-wrapper.layout-vertical .social-share-btn {
width: auto; /* Natural width */
min-width: 180px; /* Minimum width for consistency */
justify-content: center;
margin: 0;
}

.social-button-wrapper.layout-vertical .social-module-group--isb .isb-container {
flex-direction: column;
align-items: center;
}

/* === 基礎按鈕樣式 === */
.social-share-btn {
display: inline-flex;
align-items: center;
justify-content: center; /* Center content */
gap: 5px; /* Reduced gap */
padding: 6px 12px; /* Smaller padding */
border-radius: 50px;
text-decoration: none !important;
color: #fff;
font-weight: 500;
font-size: 0.9rem; /* Slightly smaller font */
transition: all 0.3s ease;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
border: none;
cursor: pointer;
min-width: 100px; /* Reduced min-width */
}
.social-share-btn:hover {
transform: translateY(-2px);
box-shadow: 0 5px 12px rgba(0,0,0,0.15);
opacity: 0.95;
}

.social-share-btn svg {
width: 20px; /* Smaller icon */
height: 20px;
flex-shrink: 0;
}

/* === 平台專屬顏色 === */
.facebook-btn {
background: #1877f2;
}

.facebook-btn:hover {
background: #145dbf;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(24, 119, 242, 0.4);
}

.google-news-btn {
background: #4285f4;
}

.google-news-btn:hover {
background: #3367d6;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(66, 133, 244, 0.4);
}

.line-btn {
background: #00b900;
}

.line-btn:hover {
background: #009900;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 185, 0, 0.4);
}

.twitter-btn {
background: #1da1f2;
}

.twitter-btn:hover {
background: #0c85d0;
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(29, 161, 242, 0.4);
}

/* === 按鈕樣式變體 === */
/* 圓角樣式 */
.button-style-rounded .social-share-btn {
border-radius: 25px;
padding: 10px 25px; /* Adjusted padding */
}

/* 極簡樣式 */
.button-style-minimal .social-share-btn {
background: transparent;
border: 2px solid #fff;
color: #fff;
}

.button-style-minimal .facebook-btn:hover {
background: #1877f2;
border-color: #1877f2;
}

.button-style-minimal .google-news-btn:hover {
background: #4285f4;
border-color: #4285f4;
}

.button-style-minimal .line-btn:hover {
background: #00b900;
border-color: #00b900;
}

.button-style-minimal .twitter-btn:hover {
background: #1da1f2;
border-color: #1da1f2;
}

/* === 嵌入內容樣式 === */
.social-button-wrapper iframe {
max-width: 100% !important;
}

.social-button-wrapper .social-module-group:not(:first-child) {
margin-top: 15px;
}

/* === Google News 橫幅 === */
.gn-banner-container {
display: flex;
flex-wrap: wrap;
max-width: 853px;
margin: 25px auto 0;
background-color: #e0eafd;
overflow: hidden;
border-radius: 8px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
transition: all 0.3s ease;
}

.gn-banner-container:hover {
box-shadow: 0 4px 16px rgba(0,0,0,0.15);
transform: translateY(-2px);
}

.gn-banner-left,
.gn-banner-right {
flex: 1 1 100%;
}

.gn-banner-content {
box-sizing: border-box;
margin: 0 auto;
align-items: center;
display: flex;
justify-content: center;
height: 100%;
padding: 15px;
}

.gn-banner-left .gn-banner-content a {
font-size: 1.3rem;
color: #333;
text-decoration: none;
font-weight: 600;
transition: color 0.3s ease;
}

.gn-banner-left .gn-banner-content a:hover {
color: #4285f4;
}

.gn-banner-content a {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
height: 100%;
width: 100%;
}

.gn-banner-content img {
width: 100%;
height: auto;
display: block;
transition: transform 0.3s ease;
}

.gn-banner-right:hover .gn-banner-content img {
transform: scale(1.05);
}

/* === 載入動畫 === */
@keyframes socialFadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

.social-share-wrapper {
animation: socialFadeIn 0.6s ease;
}

/* === 按鈕點擊效果 === */
.social-share-btn:active {
transform: translateY(0) scale(0.98);
}

/* === RWD === */
@media (max-width: 768px) {
.social-share-container {
flex-direction: column;
}

.social-share-image {
width: 100%;
height: auto; /* Allow height to adjust */
min-height: 150px; /* Minimum height */
max-height: 250px; /* Maximum height to prevent it from being too tall */
}

.social-share-content {
padding: 15px 10px; /* Even smaller padding */
}

.social-share-title {
font-size: 1.1rem; /* Smaller title */
margin-bottom: 8px;
}

.social-share-subtitle {
font-size: 0.85rem; /* Smaller subtitle */
margin-bottom: 12px;
}

.social-share-btn {
width: 100%;
max-width: 100%;
justify-content: center;
padding: 8px 20px;
font-size: 0.9rem;
margin-bottom: 0; /* Reset margin */
}

.social-button-wrapper {
gap: 10px; /* Ensure gap is applied */
}

.gn-banner-container {
margin: 20px 15px 0;
}

.gn-banner-left .gn-banner-content a {
font-size: 1.1rem;
}
}

@media (min-width: 768px) {
.gn-banner-left,
.gn-banner-right {
flex: 1 1 50%;
}
}

@media (max-width: 480px) {
.social-share-wrapper {
margin: 30px 0;
}

.social-share-container {
padding: 20px 15px;
border-radius: 6px;
}

.social-share-title {
font-size: 18px;
}

.social-share-subtitle {
font-size: 14px;
}

.social-share-btn {
font-size: 14px;
padding: 10px 20px;
min-width: auto;
}

.social-share-btn svg {
width: 20px;
height: 20px;
}

.gn-banner-left .gn-banner-content a {
font-size: 1rem;
}
}

/* === 深色模式支援 === */
@media (prefers-color-scheme: dark) {
.social-share-container {
background: #2a2a2a;
}

.gn-banner-container {
background-color: #1a2332;
}

.gn-banner-left .gn-banner-content a {
color: #e0e0e0;
}

.gn-banner-left .gn-banner-content a:hover {
color: #6ba3f7;
}
}

/* === 列印樣式 === */
@media print {
.social-share-wrapper {
display: none;
}
}

/* === 無障礙改進 === */
.social-share-btn:focus {
outline: 3px solid #fff;
outline-offset: 2px;
}

.social-share-btn:focus-visible {
outline: 3px solid #fff;
outline-offset: 2px;
}

/* === 動畫效果類別 === */
.social-animate-bounce {
animation: bounce 0.6s ease;
}

@keyframes bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-10px); }
}

/* === 特殊效果：漸層背景選項 === */
.social-share-container.gradient-bg {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}

.social-share-container.gradient-bg-warm {
background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
}

.social-share-container.gradient-bg-cool {
background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
}

/* === 新增按鈕樣式 === */

/* X (前 Twitter) - 黑色背景 */
.x-btn {
background-color: #000000;
color: #fff;
}
.x-btn:hover {
background-color: #333333;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
border-color: #000000;
}

/* Threads - 黑色背景 (與 X 類似，但圖示不同) */
.threads-btn {
background-color: #000000;
color: #fff;
}
.threads-btn:hover {
background-color: #333333;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
border-color: #000000;
}

/* Mix - 橘色背景 */
.mix-btn {
background-color: #eb4924;
color: #fff;
}
.mix-btn:hover {
background-color: #ca3e1d;
box-shadow: 0 4px 12px rgba(235, 73, 36, 0.4);
border-color: #eb4924;
}

/* RWD 調整：手機版讓按鈕緊湊排列 */
@media (max-width: 768px) {
.social-share-btn {
flex: 1; /* 讓按鈕平均分配寬度 */
min-width: auto; /* 取消最小寬度限制 */
justify-content: center;
padding: 8px 12px;
}
.social-share-btn span {
display: none; /* 手機版隱藏文字，只顯示圖示，避免太擠 */
}
.social-button-wrapper {
gap: 8px; /* 按鈕間距縮小 */
}
}

/*
 * Author action bar reuses `.social-share-btn` for Box copy/share JS hooks.
 * Keep those buttons square and keep icon spans visible even when the generic
 * mobile share module hides all button text spans.
 */
.si-article-action-bar .si-article-action-bar__action.social-share-btn {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0 !important;
width: var(--si-article-action-bar-button-size, 46px) !important;
height: var(--si-article-action-bar-button-size, 46px) !important;
min-width: var(--si-article-action-bar-button-size, 46px) !important;
min-height: var(--si-article-action-bar-button-size, 46px) !important;
max-width: var(--si-article-action-bar-button-size, 46px) !important;
max-height: var(--si-article-action-bar-button-size, 46px) !important;
flex: 0 0 var(--si-article-action-bar-button-size, 46px) !important;
padding: 0 !important;
margin: 0 !important;
border-radius: 999px !important;
box-shadow: none !important;
line-height: 1 !important;
font-family: inherit !important;
font-weight: 760 !important;
appearance: none !important;
-webkit-appearance: none !important;
vertical-align: middle !important;
overflow: hidden !important;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn.si-article-action-bar__action--show-desktop,
.si-article-action-bar .si-article-action-bar__action.social-share-btn.si-article-action-bar__action--show-tablet,
.si-article-action-bar .si-article-action-bar__action.social-share-btn.si-article-action-bar__action--show-mobile {
display: none !important;
}

@media (min-width: 901px) {
.si-article-action-bar .si-article-action-bar__action.social-share-btn.si-article-action-bar__action--show-desktop {
	display: inline-flex !important;
}
}

@media (min-width: 641px) and (max-width: 900px) {
.si-article-action-bar .si-article-action-bar__action.social-share-btn.si-article-action-bar__action--show-tablet {
	display: inline-flex !important;
}
}

@media (max-width: 640px) {
.si-article-action-bar .si-article-action-bar__action.social-share-btn.si-article-action-bar__action--show-mobile {
	display: inline-flex !important;
}
}

.si-article-action-bar.si-article-action-bar--buttons-native .si-article-action-bar__action--copy.social-share-btn {
border-color: rgba(255, 255, 255, 0.58) !important;
background: rgba(15, 23, 42, 0.42) !important;
color: #fff !important;
}

.si-article-action-bar.si-article-action-bar--buttons-native .si-article-action-bar__action--copy.social-share-btn:hover,
.si-article-action-bar.si-article-action-bar--buttons-native .si-article-action-bar__action--copy.social-share-btn:focus-visible {
border-color: rgba(255, 255, 255, 0.86) !important;
background: rgba(15, 23, 42, 0.58) !important;
}

.si-article-action-bar.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy.social-share-btn {
border-color: rgba(17, 24, 39, 0.72) !important;
background: #f8fafc !important;
color: #111827 !important;
border: 1px solid;
}

.si-article-action-bar.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy.social-share-btn:hover,
.si-article-action-bar.si-article-action-bar--light.si-article-action-bar--buttons-native .si-article-action-bar__action--copy.social-share-btn:focus-visible {
border-color: #111827 !important;
background: #fff !important;
color: #111827 !important;
border: 1px solid;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn .si-article-action-bar__icon,
.si-article-action-bar .si-article-action-bar__action.social-share-btn .si-article-action-bar__icon .isb-icon-fallback {
display: inline-flex !important;
align-items: center;
justify-content: center;
margin: 0 !important;
width: var(--si-article-action-bar-icon-size, 21px) !important;
height: var(--si-article-action-bar-icon-size, 21px) !important;
min-width: var(--si-article-action-bar-icon-size, 21px) !important;
min-height: var(--si-article-action-bar-icon-size, 21px) !important;
line-height: 1 !important;
font-size: var(--si-article-action-bar-icon-size, 21px) !important;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn .si-article-action-bar__icon > i[class*="fa-"] {
width: var(--si-article-action-bar-icon-size, 21px) !important;
height: var(--si-article-action-bar-icon-size, 21px) !important;
font-size: var(--si-article-action-bar-icon-size, 21px) !important;
line-height: 1 !important;
}

.si-article-action-bar .si-article-action-bar__action.social-share-btn .si-article-action-bar__icon .isb-icon-fallback-svg {
width: var(--si-article-action-bar-icon-size, 21px) !important;
height: var(--si-article-action-bar-icon-size, 21px) !important;
}


/* === gallery-layout.css === */
/**
 * Custom Gallery & Core Blocks CSS Enhancements
 * Version 3.9 - Caption Styling Improvement
 * Fixes: All "transform: scale()" hover effects have been removed or neutralized to disable the visual zoom feature per user request.
 *All previous fixes for layouts and responsiveness are retained.
 * Enhancement: Improved the styling of gallery captions for better readability and aesthetics, and explicitly removed text-shadow.
 * Author: Jin
 * Update: 2025-09-14
 */

/* --- 1. CORE WORDPRESS BLOCK FIXES (for AJAX Loading) --- */
.wp-block-columns.is-layout-flex,
.wp-block-columns {
display: flex !important;
flex-wrap: wrap;
align-items: flex-start;
gap: 1.5em;
}

.wp-block-columns > .wp-block-column {
flex-grow: 1;
flex-basis: 0;
min-width: 0;
}

/* --- 2. BASE STYLES FOR CUSTOM GALLERY --- */
.wp-block-gallery.custom-layout {
display: block;
margin: 0 auto 1em;
padding: 0;
overflow: hidden;
position: relative;
transition: opacity 0.3s ease-in-out;
max-width: 100%;
width: 100%;
box-sizing: border-box;
}

.wp-block-gallery.custom-layout img {
border: none;
transition: transform 0.3s ease;
}

.wp-block-gallery.custom-layout .wp-block-image {
margin: 0 !important;
padding: 0;
box-sizing: border-box;
overflow: hidden;
width: 100% !important;
height: 100%;
transition: box-shadow 0.3s ease;
position: relative;
}

.wp-block-gallery.custom-layout .wp-block-image:hover {
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.wp-block-gallery.custom-layout .wp-block-image img,
.wp-block-gallery.custom-layout .wp-block-image picture {
display: block;
width: 100%;
height: 100%;
}

.wp-block-gallery.custom-layout .wp-block-image img {
object-fit: contain; /* 預設值，JS 可能會針對特定版型覆蓋為 cover */
transform: scale(1);
transition: transform 0.3s ease;
}

/* [修正] 移除通用的滑鼠移過放大效果 */
/*
.wp-block-gallery.custom-layout .wp-block-image:hover img {
transform: scale(1.05);
}

*/
/* [新增] 強制移除圖片及其容器的邊框、輪廓和陰影
 * -------------------------------------------------------------------------- */
/* 
 * 這段程式碼使用 !important 來確保其優先級最高，
 * 可以覆蓋掉任何來自佈景主題 (Theme) 的預設邊框、底線或陰影樣式，
 * 確保圖庫的視覺純淨。
 */
.wp-block-gallery.custom-layout img,
.wp-block-gallery.custom-layout a,
.wp-block-gallery.custom-layout .wp-block-image {
border: none !important;
outline: none !important;
box-shadow: none !important;
text-decoration: none !important; /* 特別移除連結可能產生的底線 */
background: none !important; /* 移除可能的背景顏色 */
}


/* --- 3. LOADING & FALLBACK STYLES (最終防閃爍版) --- */

/* 為所有自訂圖庫設定基礎的過渡效果 */
.wp-block-gallery.custom-layout {
transition: opacity 0.3s ease-in-out;
}

/* [新增] 當 JS 開始計算佈局時，讓容器淡出的 class */
.wp-block-gallery.custom-layout.is-transitioning {
opacity: 0 !important;
}


/* ==========================================================================
   策略一：針對需要 JS 精確計算的版型 (Slider, Justified, ImageCompare)
   - 保持 Spinner 佔位容器的策略，因為它們不能「即時顯示」。
   ========================================================================== */
.wp-block-gallery.custom-layout[data-layout="slider"]:not(.layout-ready),
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"]:not(.layout-ready),
.wp-block-gallery.custom-layout[data-layout="justified"]:not(.layout-ready),
.wp-block-gallery.custom-layout[data-layout="imagecompare"]:not(.layout-ready) {
position: relative;
opacity: 1;
min-height: clamp(300px, 40vh, 600px);
background-color: rgba(0,0,0,0.03);
}
/* Spinner 的 ::before 樣式 */
.wp-block-gallery.custom-layout[data-layout="slider"]:not(.layout-ready)::before,
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"]:not(.layout-ready)::before,
.wp-block-gallery.custom-layout[data-layout="justified"]:not(.layout-ready)::before,
.wp-block-gallery.custom-layout[data-layout="imagecompare"]:not(.layout-ready)::before {
content: ''; box-sizing: border-box; position: absolute; top: 50%; left: 50%;
width: 40px; height: 40px; margin-top: -20px; margin-left: -20px;
border-radius: 50%; border: 4px solid rgba(0, 0, 0, 0.1); border-top-color: #666;
animation: gallery-spinner-rotation 0.8s ease infinite; z-index: 1;
}


/* ==========================================================================
   策略二：針對純 CSS 或簡易 JS 的網格版型
   - 保持「即時顯示」策略。
   ========================================================================== */
.wp-block-gallery.custom-layout:not([data-layout="slider"]):not([data-layout="hero-thumb-carousel"]):not([data-layout="justified"]):not([data-layout="imagecompare"]):not(.layout-ready) {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
gap: 10px;
opacity: 1; /* 初始狀態可見 */
}

/* 
 * ==========================================================================
 * [補齊] 以下是之前被省略的「即時顯示」核心樣式
 * ==========================================================================
 * 這兩條規則至關重要，它們確保了在 JS 計算最終佈局之前，
 * 初始的網格看起來是整齊劃一的方形，從而極大地減少了視覺上的跳動感。
 */
.wp-block-gallery.custom-layout:not([data-layout="default"]):not([data-layout="slider"]):not([data-layout="hero-thumb-carousel"]):not([data-layout="justified"]):not([data-layout="imagecompare"]):not(.layout-ready) .wp-block-image {
aspect-ratio: 1 / 1; /* 讓每個圖片容器預設為正方形 */
overflow: hidden;/* 隱藏超出部分的圖片內容 */
}

.wp-block-gallery.custom-layout:not([data-layout="default"]):not([data-layout="slider"]):not([data-layout="hero-thumb-carousel"]):not([data-layout="justified"]):not([data-layout="imagecompare"]):not(.layout-ready) .wp-block-image img {
width: 100%;
height: 100%;
object-fit: cover;   /* 讓圖片填滿正方形容器，裁剪掉多餘部分 */
}


/* ==========================================================================
   通用規則：所有圖庫在計算完成後，都應該是完全可見的
   ========================================================================== */
.wp-block-gallery.custom-layout.layout-ready {
opacity: 1;
background-color: transparent;
}

.wp-block-gallery.custom-layout.layout-ready::before {
display: none; /* 確保 Spinner 在計算完成後被隱藏 */
}

/* Default/core gallery keeps the same grid before and after JS marks layout-ready.
 * Without this, `.layout-ready` removes the initial fallback grid and can create
 * a visible CLS on normal WordPress galleries that only need lightbox handling.
 */
.wp-block-gallery.custom-layout[data-layout="default"] {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(min(150px, 100%), 1fr));
gap: var(--gallery-layout-gap, 10px);
align-items: stretch;
}

.wp-block-gallery.custom-layout[data-layout="default"].columns-1 { grid-template-columns: minmax(0, 1fr); }
.wp-block-gallery.custom-layout[data-layout="default"].columns-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="default"].columns-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="default"].columns-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="default"].columns-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="default"].columns-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="default"].columns-7 { grid-template-columns: repeat(7, minmax(0, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="default"]:has(> :only-child) { grid-template-columns: minmax(0, 1fr); }

.wp-block-gallery.custom-layout[data-layout="default"] > *,
.wp-block-gallery.custom-layout[data-layout="default"] .wp-block-image {
min-width: 0;
width: 100% !important;
height: auto !important;
}

.wp-block-gallery.custom-layout[data-layout="default"] > * {
display: block;
aspect-ratio: auto;
overflow: visible;
}

.wp-block-gallery.custom-layout[data-layout="default"] .wp-block-image {
aspect-ratio: auto;
overflow: visible;
}

.wp-block-gallery.custom-layout[data-layout="default"] .wp-block-image picture {
display: block;
width: 100%;
height: auto !important;
aspect-ratio: auto;
}

.wp-block-gallery.custom-layout[data-layout="default"] .wp-block-image img {
display: block;
width: 100%;
height: auto !important;
aspect-ratio: auto;
object-fit: contain !important;
}

@media (max-width: 767px) {
.wp-block-gallery.custom-layout[data-layout="default"].columns-4,
.wp-block-gallery.custom-layout[data-layout="default"].columns-5,
.wp-block-gallery.custom-layout[data-layout="default"].columns-6,
.wp-block-gallery.custom-layout[data-layout="default"].columns-7 {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
}

/* 請確保動畫定義存在 */
@keyframes gallery-spinner-rotation {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}

/* --- 4. SPECIFIC LAYOUT STYLES (DESKTOP FIRST) --- */

/* A. Justified Layout */
/* =============================================================================
   對齊式 (Justified) - 強制滿版 CSS
   ============================================================================= */

.wp-block-gallery.custom-layout[data-layout="justified"] {
display: block !important;
width: 100%;
}

.wp-block-gallery.custom-layout[data-layout="justified"] .gallery-row-justified {
display: flex;
margin-bottom: 10px;
width: 100%; /* 確保每行都是滿版 */
}

.wp-block-gallery.custom-layout[data-layout="justified"] .gallery-row-justified:last-child {
margin-bottom: 0;
}

.wp-block-gallery.custom-layout[data-layout="justified"] .justified-item {
flex-shrink: 0;
display: block;
height: 100%;
box-sizing: border-box;
overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-gallery.custom-layout[data-layout="justified"] .justified-item img {
width: 100%;
height: 100%;
display: block;
border: none !important;

/* 🎯 關鍵：使用 cover 填滿容器，確保對齊 */
object-fit: cover;
object-position: center;
}

/* 懸停效果 */
/*.wp-block-gallery.custom-layout[data-layout="justified"] .justified-item:hover {
transform: translateY(-3px);
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
z-index: 2;
}*/

/* =============================================================================
   均分列 (Equal Row) - 完整顯示 CSS
   ============================================================================= */

.wp-block-gallery.custom-layout[data-layout="equal-row"] {
display: flex !important;
width: 100%;
align-items: stretch;
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .gallery-row-equal {
display: flex;
gap: 10px;
width: 100%;
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .equal-row-item {
display: block;
height: 100%;
box-sizing: border-box;
overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .equal-row-item img {
width: 100%;
height: 100%;
display: block;
border: none !important;

/* 🎯 關鍵：使用 contain 完整顯示，不裁切 */
object-fit: contain;
object-position: center;

/* 添加淺色背景，避免透明圖片顯示問題 */
background: #f8f8f8;
}

/* 懸停效果 */
.wp-block-gallery.custom-layout[data-layout="equal-row"] .equal-row-item:hover {
transform: translateY(-2px);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
z-index: 2;
}

/* =============================================================================
   響應式設計
   ============================================================================= */

/* 平板 */
@media (max-width: 768px) {
/* Justified - 減少間距 */
.wp-block-gallery.custom-layout[data-layout="justified"] .gallery-row-justified {
gap: 6px;
margin-bottom: 6px;
}

/* Equal Row - 減少間距 */
.wp-block-gallery.custom-layout[data-layout="equal-row"] .gallery-row-equal {
gap: 6px;
}
}

/* 手機 */
@media (max-width: 480px) {
/* Justified - 最小間距 */
.wp-block-gallery.custom-layout[data-layout="justified"] .gallery-row-justified {
gap: 4px;
margin-bottom: 4px;
}

/* Equal Row - 改為垂直堆疊（可選） */
.wp-block-gallery.custom-layout[data-layout="equal-row"] {
flex-direction: column !important;
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .gallery-row-equal {
flex-direction: column !important;
gap: 10px;
height: auto !important;
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .equal-row-item {
width: 100% !important;
max-width: 100% !important;
flex: 0 0 auto !important;
height: auto !important;
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .equal-row-item img {
height: auto !important;
max-height: 60vh;
}
}

/* =============================================================================
   列印樣式
   ============================================================================= */

@media print {
.wp-block-gallery.custom-layout[data-layout="justified"],
.wp-block-gallery.custom-layout[data-layout="equal-row"] {
display: block !important;
}

.wp-block-gallery.custom-layout .gallery-row-justified,
.wp-block-gallery.custom-layout .gallery-row-equal {
display: block !important;
page-break-inside: avoid;
}

.wp-block-gallery.custom-layout .justified-item,
.wp-block-gallery.custom-layout .equal-row-item {
display: inline-block !important;
width: auto !important;
height: auto !important;
page-break-inside: avoid;
}
}


/* B. Grid-based layouts (2-7, twocols) */
.wp-block-gallery.custom-layout[data-layout^="2"],
.wp-block-gallery.custom-layout[data-layout^="3"],
.wp-block-gallery.custom-layout[data-layout^="4"],
.wp-block-gallery.custom-layout[data-layout^="5"],
.wp-block-gallery.custom-layout[data-layout^="6"],
.wp-block-gallery.custom-layout[data-layout^="7"],
.wp-block-gallery.custom-layout[data-layout="twocols"] { display: grid !important; }
.wp-block-gallery.custom-layout[data-layout^="2"] > *,
.wp-block-gallery.custom-layout[data-layout^="3"] > *,
.wp-block-gallery.custom-layout[data-layout^="4"] > *,
.wp-block-gallery.custom-layout[data-layout^="5"] > *,
.wp-block-gallery.custom-layout[data-layout^="6"] > *,
.wp-block-gallery.custom-layout[data-layout^="7"] > *,
.wp-block-gallery.custom-layout[data-layout="twocols"] > * { height: 100%; width: 100%; display: block; margin: 0; padding: 0; }

/* C. Two Cols */
.wp-block-gallery.custom-layout[data-layout="twocols"] { grid-template-columns: 1fr 1fr; gap: 10px; height: auto; }
.wp-block-gallery.custom-layout[data-layout="twocols"] > .wp-block-image { height: 100%; }

/* D. Masonry (Waterfall) */
.wp-block-gallery.custom-layout[data-layout="masonry"] { display: block !important; column-count: 3; column-gap: 10px; }
.wp-block-gallery.custom-layout[data-layout="masonry"] .wp-block-image { break-inside: avoid; margin-bottom: 10px !important; }

/* E. Mosaic (Tiled) */
.wp-block-gallery.custom-layout[data-layout="mosaic"] { display: grid !important; gap: 10px; grid-auto-flow: row dense; grid-auto-rows: 150px; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); }
.wp-block-gallery.custom-layout[data-layout="mosaic"] .wp-block-image:nth-child(3n) { grid-column: span 2; }
.wp-block-gallery.custom-layout[data-layout="mosaic"] .wp-block-image:nth-child(4n) { grid-row: span 2; }

/* F. Instagram (Square Grid) */
.wp-block-gallery.custom-layout[data-layout="insta"] { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 6px; }
.wp-block-gallery.custom-layout[data-layout="insta"] .wp-block-image { aspect-ratio: 1 / 1; }

/* G. Fullwidth (Horizontal Scroll) */
.wp-block-gallery.custom-layout[data-layout="fullwidth"] { display: flex !important; flex-wrap: nowrap; overflow-x: auto; gap: 10px; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); width: 100vw; padding-left: max(10px, env(safe-area-inset-left)); padding-right: max(10px, env(safe-area-inset-right)); box-sizing: border-box; scroll-snap-type: x mandatory; }
.wp-block-gallery.custom-layout[data-layout="fullwidth"] .wp-block-image { flex: 0 0 80vw; height: 60vh; scroll-snap-align: center; }

/* H. Coverflow */
.wp-block-gallery.custom-layout[data-layout="coverflow"] { display: flex !important; align-items: center; overflow-x: auto; padding: 2rem 0; perspective: 1200px; }
.wp-block-gallery.custom-layout[data-layout="coverflow"] .wp-block-image { flex: 0 0 40%; height: 400px; transition: transform 0.5s ease; transform: rotateY(45deg) scale(0.8); }
/* [修正] 移除 Coverflow 的放大效果，但保留翻轉 */
.wp-block-gallery.custom-layout[data-layout="coverflow"] .wp-block-image:hover { transform: rotateY(0) scale(1); z-index: 10; }

/* I. Polaroid */
.wp-block-gallery.custom-layout[data-layout="polaroid"] { display: flex !important; flex-wrap: wrap; gap: 20px; justify-content: center; padding: 20px; }
.wp-block-gallery.custom-layout[data-layout="polaroid"] .wp-block-image { background: white; padding: 10px 10px 30px 10px; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); transform: rotate(-2deg); transition: transform 0.3s ease; width: 200px !important; height: auto !important; position: relative; }
.wp-block-gallery.custom-layout[data-layout="polaroid"] .wp-block-image:nth-child(even) { transform: rotate(2deg); }
/* [修正] 移除 Polaroid 的放大效果，但保留回正 */
.wp-block-gallery.custom-layout[data-layout="polaroid"] .wp-block-image:hover { transform: rotate(0deg) scale(1); z-index: 10; }
.wp-block-gallery.custom-layout[data-layout="polaroid"] .wp-block-image img { object-fit: cover; }

/* J. Featured Big */
.wp-block-gallery.custom-layout[data-layout="featuredbig"] { display: grid !important; gap: 10px; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; height: 400px; }
.wp-block-gallery.custom-layout[data-layout="featuredbig"] > *:first-child { grid-row: 1 / 3; grid-column: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="featuredbig"] .wp-block-image img { object-fit: cover; }

/* K. Circle Grid */
.wp-block-gallery.custom-layout[data-layout="circlegrid"] {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
gap: 20px;
padding: 20px;
justify-content: center;
}
.wp-block-gallery.custom-layout[data-layout="circlegrid"] .wp-block-image { aspect-ratio: 1 / 1; border-radius: 50%; overflow: hidden; transition: transform 0.3s ease, box-shadow 0.3s ease; }
/* [修正] 移除 Circle Grid 的放大效果，但保留陰影 */
.wp-block-gallery.custom-layout[data-layout="circlegrid"] .wp-block-image:hover {
transform: scale(1);
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
}
.wp-block-gallery.custom-layout[data-layout="circlegrid"] .wp-block-image img { width: 100%; height: 100%; object-fit: cover; }

/* L. Image Compare */
/* L. Image Compare - 修正版 */
/* ============================================================================
   L. Image Compare - 純 CSS 實現（高效能版本）
   使用原生 range input + CSS clip-path，無外部依賴
   ============================================================================ */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] { 
position: relative; 
width: 100%;
--compare-position: 50%; /* CSS 變數控制分割位置 */
}

/* 圖片比較容器 */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-wrapper {
position: relative;
width: 100%;
overflow: hidden;
border-radius: 8px;
background: #f8f8f8;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
aspect-ratio: 16 / 9; /* 預設比例，會被 JS 覆蓋 */
user-select: none;
-webkit-user-select: none;
}

/* 後圖（右側/底層）*/
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
z-index: 1;
}

/* 前圖（左側/上層）- 使用 clip-path 裁切 */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
object-fit: contain;
z-index: 2;
clip-path: inset(0 calc(100% - var(--compare-position)) 0 0);
-webkit-clip-path: inset(0 calc(100% - var(--compare-position)) 0 0);
}

/* 滑桿軌道（透明，覆蓋整個區域） */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-range {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
opacity: 0; /* 隱藏原生滑桿 */
cursor: ew-resize;
margin: 0;
-webkit-appearance: none;
appearance: none;
background: transparent;
}

/* 分割線 */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-divider {
position: absolute;
top: 0;
left: var(--compare-position);
width: 3px;
height: 100%;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
z-index: 5;
transform: translateX(-50%);
pointer-events: none;
}

/* 拖動手把 */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-handle {
position: absolute;
top: 50%;
left: var(--compare-position);
width: 44px;
height: 44px;
background: rgba(255, 255, 255, 0.95);
border-radius: 50%;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
z-index: 6;
transform: translate(-50%, -50%);
pointer-events: none;
display: flex;
align-items: center;
justify-content: center;
}

/* 手把箭頭圖標 */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-handle::before,
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-handle::after {
content: '';
position: absolute;
width: 0;
height: 0;
border-style: solid;
}

.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-handle::before {
border-width: 7px 10px 7px 0;
border-color: transparent #555 transparent transparent;
left: 8px;
}

.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-handle::after {
border-width: 7px 0 7px 10px;
border-color: transparent transparent transparent #555;
right: 8px;
}

/* 標籤 */
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-label {
position: absolute;
bottom: 15px;
padding: 6px 14px;
background: rgba(0, 0, 0, 0.7);
color: #fff;
font-size: 13px;
font-weight: 500;
border-radius: 4px;
z-index: 4;
pointer-events: none;
}

.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-label-before {
left: 15px;
}

.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-label-after {
right: 15px;
}

/* 手機觸控優化 */
@media (max-width: 768px) {
.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-handle {
width: 50px;
height: 50px;
}

.wp-block-gallery.custom-layout[data-layout="imagecompare"] .image-compare-label {
font-size: 11px;
padding: 4px 10px;
bottom: 10px;
}
}

/* M. Film Strip */
.wp-block-gallery.custom-layout[data-layout="filmstrip"] { background: #222; padding: 20px 10px; display: flex !important; gap: 5px; overflow-x: auto; border-top: 10px solid #333; border-bottom: 10px solid #333; position: relative; }
.wp-block-gallery.custom-layout[data-layout="filmstrip"]::before,
.wp-block-gallery.custom-layout[data-layout="filmstrip"]::after { content: ''; position: absolute; left: 0; right: 0; height: 8px; background: repeating-linear-gradient( to right, #444 0px, #444 15px, #666 15px, #666 25px ); }
.wp-block-gallery.custom-layout[data-layout="filmstrip"]::before { top: 2px; }
.wp-block-gallery.custom-layout[data-layout="filmstrip"]::after { bottom: 2px; }
.wp-block-gallery.custom-layout[data-layout="filmstrip"] .wp-block-image { flex: 0 0 200px; height: 150px !important; border: 2px solid #555; }
.wp-block-gallery.custom-layout[data-layout="filmstrip"] .wp-block-image img { object-fit: cover; }

/* N. Honeycomb */
.wp-block-gallery.custom-layout[data-layout="honeycomb"] { display: flex !important; flex-wrap: wrap; gap: 5px; justify-content: center; }
.wp-block-gallery.custom-layout[data-layout="honeycomb"] .wp-block-image { width: 150px !important; height: 130px !important; clip-path: polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); margin: 10px 5px; transition: transform 0.3s ease; }
/* [修正] 移除 Honeycomb 的放大效果 */
.wp-block-gallery.custom-layout[data-layout="honeycomb"] .wp-block-image:hover {
transform: scale(1);
z-index: 10;
}
.wp-block-gallery.custom-layout[data-layout="honeycomb"] .wp-block-image img { object-fit: cover; }

/* O. Offset Columns */
.wp-block-gallery.custom-layout[data-layout="offsetcols"] { display: grid !important; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; }
.wp-block-gallery.custom-layout[data-layout="offsetcols"] .wp-block-image:nth-child(even) { transform: translateY(30px); }
.wp-block-gallery.custom-layout[data-layout="offsetcols"] .wp-block-image { transition: transform 0.3s ease; }
/* [修正] 移除 Offset Columns 的放大效果，但保留上移 */
.wp-block-gallery.custom-layout[data-layout="offsetcols"] .wp-block-image:hover {
transform: translateY(0px) scale(1);
}

/* P. Split Focus */
.wp-block-gallery.custom-layout[data-layout="splitfocus"] {
    display: grid !important;
    grid-template-columns: 3fr 2fr;
    grid-template-rows: 1fr 1fr; /* [修正] 定義兩行，讓瀏覽器自動處理間距 */
    gap: 15px;
    height: 400px;
}
.wp-block-gallery.custom-layout[data-layout="splitfocus"] > *:first-child {
    grid-row: 1 / -1;
}
/* [修正] 移除硬編碼的比例計算，改由 grid-template-rows 控制 */
/* .wp-block-gallery.custom-layout[data-layout="splitfocus"] > *:not(:first-child) .wp-block-image { height: calc(50% - 7.5px) !important; } */
.wp-block-gallery.custom-layout[data-layout="splitfocus"] .wp-block-image img {
    object-fit: cover;
}

/* --- Q. Diagonal Stack (最終響應式版) --- */
.wp-block-gallery.custom-layout[data-layout="diagstack"] {
position: relative;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
perspective: 1000px;
cursor: pointer;

/* [根本性修改] 移除固定的 height，改用 aspect-ratio */
/* 這會讓容器的高度根據其寬度，保持 16:9 的黃金比例 */
aspect-ratio: 16 / 9;

/* [新增] 添加最小和最大高度，防止在極端螢幕尺寸下變形 */
/* 確保在手機上不會太扁，在超寬螢幕上不會過高 */
min-height: 350px;
max-height: 65vh; /* 最大高度不超過螢幕可見高度的 65% */
margin: 2em auto; /* 為容器上下增加一些間距，使其呼吸空間更大 */
}

.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image {
position: absolute;
/* [微調] 略微調整卡片的大小，以更好地適應新的容器尺寸 */
width: clamp(220px, 45%, 350px) !important;
height: auto !important;
aspect-ratio: 4 / 3;
transition: transform 0.5s ease-in-out, opacity 0.5s ease;
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
border-radius: 8px;
overflow: hidden;
}

/* 不同的卡片有不同的初始旋轉角度 (保持不變) */
.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image:nth-of-type(3n+1) { transform: rotate(-4deg) translateX(-10px); }
.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image:nth-of-type(3n+2) { transform: rotate(2deg) translateX(5px) translateY(10px); }
.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image:nth-of-type(3n+3) { transform: rotate(5deg) translateX(10px) translateY(-5px); }

/* 滑鼠懸停在最上方的卡片時，給予回饋 (保持不變) */
.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image:first-child:hover {
transform: rotate(0deg) scale(1.03);
}

/* 當卡片被點擊並準備移到最後時的動畫 (保持不變) */
.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image.is-moving {
transform: translateX(150%) rotate(30deg) !important;
opacity: 0;
}

/* R. Slider */
.wp-block-gallery.custom-layout[data-layout="slider"] { height: 50vh; max-height: 500px; min-height: 300px; background: #f0f0f0; display: block; opacity: 1; }
.wp-block-gallery.custom-layout[data-layout="slider"] .flickity-viewport,
.wp-block-gallery.custom-layout[data-layout="slider"] .flickity-slider { height: 100%; }
.wp-block-gallery.custom-layout[data-layout="slider"] .gallery-cell { height: 100%; margin-right: 10px; box-sizing: border-box; }
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="1"] .gallery-cell { width: 100%; }
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="2"] .gallery-cell { width: 50%; }
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="3"] .gallery-cell { width: 33.3333%; }
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="4"] .gallery-cell { width: 25%; }

.gallery-layout__unified-meta {
    width: min(100%, 960px);
    margin: 14px auto 0;
    padding: 14px 16px;
    border-top: 1px solid rgba(15, 23, 42, 0.12);
    display: grid;
    gap: 10px;
    color: #334155;
    line-height: 1.7;
    font-size: 14px;
}

.gallery-layout__unified-caption {
    color: #0f172a;
}

.gallery-layout__unified-source {
    color: #475569;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: baseline;
}

.gallery-layout__unified-source-prefix {
    font-weight: 600;
}

@media (max-width: 768px) {
    .gallery-layout__unified-meta {
        margin-top: 12px;
        padding: 12px 10px 0;
        font-size: 13px;
    }
}
.wp-block-gallery.custom-layout[data-layout="slider"]:not([data-slider-cols]) .gallery-cell { width: 100%; }
.wp-block-gallery.custom-layout[data-layout="slider"] .gallery-cell img { display: block; width: 100%; height: 100%; object-fit: contain; }
.wp-block-gallery.custom-layout[data-layout="slider"] .flickity-enabled { outline: none; }
.wp-block-gallery.custom-layout[data-layout="slider"] .flickity-page-dots { bottom: -40px; }
.wp-block-gallery.custom-layout[data-layout="slider"] .flickity-prev-next-button { background: rgba(255, 255, 255, 0.8); border-radius: 50%; }

/* --- COMBO LAYOUTS --- */
.wp-block-gallery.custom-layout[data-layout^="hero-"] > *,
.wp-block-gallery.custom-layout[data-layout^="symmetrical-"] > *,
.wp-block-gallery.custom-layout[data-layout^="diamond-"] > *,
.wp-block-gallery.custom-layout[data-layout^="asymmetric-"] > *,
.wp-block-gallery.custom-layout[data-layout^="cinema-"] > *,
.wp-block-gallery.custom-layout[data-layout^="puzzle-"] > *,
.wp-block-gallery.custom-layout[data-layout^="t-shape-"] > *,
.wp-block-gallery.custom-layout[data-layout="featuredbig"] > *,
.wp-block-gallery.custom-layout[data-layout="splitfocus"] > * {
height: 100%;
width: 100%;
overflow: hidden;
}

/* --- AE. 均分列 (Equal Row) - [升級版：完整顯示，高度一致] --- */
.wp-block-gallery.custom-layout[data-layout="equal-row"] {
display: flex !important;
gap: 10px;
width: 100%;
/* [修改前] align-items: flex-start; */
align-items: stretch; /* [修改後] 確保所有項目從頂部對齊 */
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .wp-block-image {
/* 
 * 核心：讓每個 flex item (圖片容器) 的寬度
 * 根據其內容 (圖片) 的原始寬度來按比例分配空間。
 * flex-grow: 1; -> 允許放大以填滿空間
 * flex-shrink: 1; -> 允許縮小
 * flex-basis: 0; -> 初始寬度為0，完全依賴比例計算
 */
flex: 1 1 0;
min-width: 0; /* 防止 flex item 在內容過多時溢出 */
}

.wp-block-gallery.custom-layout[data-layout="equal-row"] .wp-block-image a,
.wp-block-gallery.custom-layout[data-layout="equal-row"] .wp-block-image img {
display: block;
width: 100%;   /* 圖片寬度填滿其容器 */
/* [修改前] height: auto; */
height: 100%;  /* [修改後] 關鍵：讓圖片高度自動根據其寬度和原始比例調整 */

/* [重要] 移除 object-fit，因為我們現在要完整顯示圖片 */
object-fit: cover; /* [新增] 讓圖片填滿容器，可能會裁切部分內容 */
}

/* --- AF. 結構化網格系統 (Structured Grid System) - [完整顯示版] --- */
.wp-block-gallery.custom-layout[data-layout^="grid-"] {
display: grid !important;
width: 100%;

/* [核心修改] 分別定義行和列的間距 */
row-gap: 50px;/* 增加行間距，為說明文字預留足夠的垂直空間 */
column-gap: 10px; /* 保持列間距不變 */
}

.wp-block-gallery.custom-layout[data-layout^="grid-"] .wp-block-image {
background-color: #f8f8f8;
}

.wp-block-gallery.custom-layout[data-layout^="grid-"] .wp-block-image img {
display: block;
width: 100%;
height: 100%;
object-fit: contain; /* 核心：所有網格都完整顯示圖片 */
}


/* --- 個別網格定義 --- */

/* 方格佈局 (2x2) */
.wp-block-gallery.custom-layout[data-layout="grid-2x2"] {
grid-template-columns: repeat(2, 1fr);
/* 高度由內容決定 */
}

/* [新增] 網格 3x2 (3列, 2行) */
.wp-block-gallery.custom-layout[data-layout="grid-3x2"] {
grid-template-columns: repeat(3, 1fr);
}

/* [新增] 網格 2x3 (2列, 3行) */
.wp-block-gallery.custom-layout[data-layout="grid-2x3"] {
grid-template-columns: repeat(2, 1fr);
}

/* [新增] 方格佈局 (3x3) */
.wp-block-gallery.custom-layout[data-layout="grid-3x3"] {
grid-template-columns: repeat(3, 1fr);
}

/* [新增] 網格 4x2 (4列, 2行) */
.wp-block-gallery.custom-layout[data-layout="grid-4x2"] {
grid-template-columns: repeat(4, 1fr);
}

/* [新增] 網格 2x4 (2列, 4行) */
.wp-block-gallery.custom-layout[data-layout="grid-2x4"] {
grid-template-columns: repeat(2, 1fr);
}

/* [新增] 方格佈局 (4x4) */
.wp-block-gallery.custom-layout[data-layout="grid-4x4"] {
grid-template-columns: repeat(4, 1fr);
}


/* S. Hero Left Stack */
.wp-block-gallery.custom-layout[data-layout="hero-left-stack"] { display: grid !important; grid-template-columns: 2fr 1fr; grid-template-rows: 1fr 1fr; gap: 10px; height: 400px; }
.wp-block-gallery.custom-layout[data-layout="hero-left-stack"] > *:first-child { grid-row: 1 / 3; grid-column: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="hero-left-stack"] .wp-block-image img { object-fit: cover; }

/* T. Hero Top Four */
.wp-block-gallery.custom-layout[data-layout="hero-top-four"] { 
    display: grid !important; 
    grid-template-columns: repeat(4, 1fr); 
    grid-template-rows: 2fr 1fr; 
    gap: 10px; 
    height: 450px; /* [修正] 恢復高度以確保 fr 分配生效 */
}
.wp-block-gallery.custom-layout[data-layout="hero-top-four"] > *:first-child { 
    grid-column: 1 / 5; 
    grid-row: 1 / 2; 
}
.wp-block-gallery.custom-layout[data-layout="hero-top-four"] .wp-block-image img { 
    object-fit: cover; 
}

/* U. Symmetrical Sides */
.wp-block-gallery.custom-layout[data-layout="symmetrical-sides"] { display: grid !important; grid-template-columns: 1fr 2fr 1fr; gap: 10px; height: 350px; }
.wp-block-gallery.custom-layout[data-layout="symmetrical-sides"] > *:nth-child(2) { grid-column: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="symmetrical-sides"] .wp-block-image img { object-fit: cover; }

/* V. Diamond Focus */
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] { display: grid !important; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr); gap: 10px; height: 400px; }
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] > *:nth-child(1) { grid-column: 2 / 3; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] > *:nth-child(2) { grid-column: 1 / 2; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] > *:nth-child(3) { grid-column: 2 / 3; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] > *:nth-child(4) { grid-column: 3 / 4; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] > *:nth-child(5) { grid-column: 2 / 3; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="diamond-focus"] .wp-block-image img { object-fit: cover; }

/* W. Asymmetric Duo */
.wp-block-gallery.custom-layout[data-layout="asymmetric-duo"] { display: grid !important; grid-template-columns: 3fr 2fr; grid-template-rows: 1fr 1fr 1fr; gap: 10px; height: 450px; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-duo"] > *:nth-child(1) { grid-column: 1 / 2; grid-row: 1 / 3; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-duo"] > *:nth-child(2) { grid-column: 2 / 3; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-duo"] > *:nth-child(3) { grid-column: 1 / 2; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-duo"] > *:nth-child(4) { grid-column: 2 / 3; grid-row: 2 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-duo"] .wp-block-image img { object-fit: cover; }


/* ==========================================================================
   [新增] 全系列不對稱版型 (3-9+ 張圖片)
   ========================================================================== */

/* AA. 不對稱三圖 (Asymmetric Trio) */
.wp-block-gallery.custom-layout[data-layout="asymmetric-tri"] {
display: grid !important;
grid-template-columns: 2fr 1fr;
grid-template-rows: 1fr 1fr;
gap: 10px;
height: clamp(350px, 50vh, 450px);
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-tri"] > *:nth-child(1) {
grid-column: 1 / 2;
grid-row: 1 / 3;
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-tri"] .wp-block-image img { object-fit: cover; }

/* AB. 不對稱四圖 (Asymmetric Quad Stack) */
.wp-block-gallery.custom-layout[data-layout="asymmetric-quad-stack"] {
display: grid !important;
grid-template-columns: 2fr 1fr;
grid-template-rows: 1fr 1fr 1fr;
gap: 10px;
height: clamp(450px, 70vh, 600px);
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-quad-stack"] > *:nth-child(1) {
grid-column: 1 / 2;
grid-row: 1 / 4;
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-quad-stack"] .wp-block-image img { object-fit: cover; }

/* AC. 不對稱五圖 (Asymmetric Penta) */
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] {
display: grid !important;
grid-template-columns: 2fr 1.2fr;
grid-template-rows: 1fr 1fr 1fr;
gap: 10px;
height: clamp(450px, 65vh, 650px);
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] > *:nth-child(1) { grid-column: 1 / 2; grid-row: 1 / 3; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] > *:nth-child(2) { grid-column: 2 / 3; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] > *:nth-child(3) { grid-column: 2 / 3; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] > *:nth-child(4) { grid-column: 1 / 2; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] > *:nth-child(5) { grid-column: 2 / 3; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-penta"] .wp-block-image img { object-fit: cover; }


/* AD. 不對稱六/七圖 (Asymmetric Hex/Sept) - 此版型對6或7張圖片效果都很好 */
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] {
display: grid !important;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(3, 1fr);
gap: 10px;
height: clamp(500px, 75vh, 700px);
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(1) { grid-column: 1 / 2; grid-row: 1 / 3; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(2) { grid-column: 2 / 4; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(3) { grid-column: 2 / 3; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(4) { grid-column: 3 / 4; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(5) { grid-column: 1 / 2; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(6) { grid-column: 2 / 3; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] > *:nth-child(7) { grid-column: 3 / 4; grid-row: 3 / 4; }
.wp-block-gallery.custom-layout[data-layout="asymmetric-hex"] .wp-block-image img { object-fit: cover; }


/* AE. 動態不對稱 (Asymmetric Dynamic) - 適用於 7-12+ 張圖片 */
.wp-block-gallery.custom-layout[data-layout="asymmetric-dynamic"] {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
grid-auto-rows: clamp(150px, 20vh, 200px);
grid-auto-flow: dense; /* 關鍵：允許項目自動填充空白，創造拼圖感 */
gap: 10px;
}
/* 透過 nth-child 讓特定圖片變大，產生不規則的視覺焦點 */
.wp-block-gallery.custom-layout[data-layout="asymmetric-dynamic"] > *:nth-child(5n + 1) {
grid-column: span 2;
grid-row: span 1;
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-dynamic"] > *:nth-child(7n + 2) {
grid-column: span 1;
grid-row: span 2;
}
/* 確保第1張圖總是最大的，作為視覺起點 */
.wp-block-gallery.custom-layout[data-layout="asymmetric-dynamic"] > *:first-child {
grid-column: span 2;
grid-row: span 2;
}
.wp-block-gallery.custom-layout[data-layout="asymmetric-dynamic"] .wp-block-image img { object-fit: cover; }


/* X. Cinema Strip */
.wp-block-gallery.custom-layout[data-layout="cinema-strip"] { display: grid !important; grid-template-columns: repeat(4, 1fr); grid-template-rows: 3fr 1fr; gap: 10px; height: 400px; }
.wp-block-gallery.custom-layout[data-layout="cinema-strip"] > *:first-child { grid-column: 1 / 5; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="cinema-strip"] .wp-block-image img { object-fit: cover; }

/* Y. Puzzle Grid */
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] { display: grid !important; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(2, 1fr); gap: 10px; height: 350px; }
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] > *:nth-child(1) { grid-column: 1 / 3; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] > *:nth-child(2) { grid-column: 3 / 5; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] > *:nth-child(3) { grid-column: 1 / 2; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] > *:nth-child(4) { grid-column: 2 / 4; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] > *:nth-child(5) { grid-column: 4 / 5; grid-row: 2 / 3; }
.wp-block-gallery.custom-layout[data-layout="puzzle-grid"] .wp-block-image img { object-fit: cover; }

/* Z. T-Shape Layout */
.wp-block-gallery.custom-layout[data-layout="t-shape-layout"] { display: grid !important; grid-template-columns: repeat(2, 1fr); grid-template-rows: 2fr 1fr; gap: 10px; height: 400px; }
.wp-block-gallery.custom-layout[data-layout="t-shape-layout"] > *:first-child { grid-column: 1 / 3; grid-row: 1 / 2; }
.wp-block-gallery.custom-layout[data-layout="t-shape-layout"] .wp-block-image img { object-fit: cover; }


/* --- 5. SMART CAPTION STYLING (Whitelist Version) --- */
/*
 * 最終策略：白名單模式。
 * 1. 預設隱藏所有自訂圖庫的圖片說明，確保佈局絕對穩定。
 * 2. 只為被允許的、佈局安全的排版（如雙欄）恢復說明的可見性。
 */

/* ==========================================================================
   Part 5.1: 全局預設 - 徹底隱藏所有說明
   - 這是我們的基礎規則，確保像 Justified 這類敏感佈局不受任何影響。
   - 使用 display: none !important; 確保最高優先級。
   ========================================================================== */

.wp-block-gallery.custom-layout .wp-block-image figcaption {
display: none !important;
}

/* ==========================================================================
   Part 5.2: 白名單 - 恢復特定佈局的說明可見性 (最終修正版)
   ========================================================================== */
   
/* 步驟 1: 這是核心。將圖片容器本身變成一個 Grid，
   以便我們能將圖片和說明放在同一單元格內重疊。*/
.wp-block-gallery.custom-layout[data-layout="twocols"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout="masonry"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout="offsetcols"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="grid-"] .wp-block-image, /* 針對所有 grid-* 版型 */
.wp-block-gallery.custom-layout[data-layout^="1"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="2"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="3"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="4"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="5"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="6"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="7"] .wp-block-image {
position: relative; /* 仍然需要相對定位作為絕對定位的錨點 */
overflow: visible; /* 允許絕對定位的說明文字顯示在容器外部 */
}

/* 步驟 2: 讓圖片和說明都佔據網格的第一行第一列，使它們重疊 */
.wp-block-gallery.custom-layout .wp-block-image > img,
.wp-block-gallery.custom-layout .wp-block-image > figcaption {
grid-row: 1 / 2;
grid-column: 1 / 2;
}

/* 步驟 3: 圖片樣式 - 讓圖片及其 <picture> 容器撐滿整個容器 */
.wp-block-gallery.custom-layout .wp-block-image > img,
.wp-block-gallery.custom-layout .wp-block-image > picture,
.wp-block-gallery.custom-layout .wp-block-image > a > img,
.wp-block-gallery.custom-layout .wp-block-image > a > picture {
width: 100%;
height: 100%;
display: block;
object-fit: inherit; 
}


/* 步驟 4: 說明的樣式 - [最佳化版] 移除陰影並美化顯示 */
.wp-block-gallery.custom-layout[data-layout="twocols"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout="masonry"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout="offsetcols"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="grid-"] .wp-block-image figcaption, /* 針對所有 grid-* 版型 */
.wp-block-gallery.custom-layout[data-layout^="1"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="2"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="3"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="4"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="5"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="6"] .wp-block-image figcaption,
.wp-block-gallery.custom-layout[data-layout^="7"] .wp-block-image figcaption {
display: block !important;

/* --- 核心定位 --- */
position: absolute;
top: 100%; /* 定位到容器底部外側 */
left: 0;
width: 100%;

/* --- [改善] 視覺美化 --- */
background: none;
color: #555; /* 使用深灰色，比純黑色更柔和，增加質感 */
font-size: 0.85em; /* 略微縮小字體，使其作為輔助說明文字更精緻 */
font-style: italic; /* 採用斜體，增添文藝感 */
line-height: 1.4;
padding: 10px 5px 0; /* 微調上方間距，增加呼吸感 */
text-align: center;
text-shadow: none !important; /* [核心要求] 強制移除任何可能繼承自佈景主題的文字陰影 */
z-index: 2; /* 確保說明文字在其他內容之上 */
}

/* ==========================================================================
   [修正] Layout 5 (1大4小) 的說明文字避免與下一列重疊
   - 將說明固定在圖片內部底部，避免 top:100% 造成跑版
   ========================================================================== */
.wp-block-gallery.custom-layout[data-layout="5"] .wp-block-image {
overflow: hidden; /* 讓說明文字留在圖片內，不影響網格高度 */
}

.wp-block-gallery.custom-layout[data-layout="5"] .wp-block-image figcaption {
top: auto;
bottom: 0;
left: 0;
right: 0;
width: 100%;
padding: 8px 10px;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
color: #fff;
font-style: normal;
text-align: left;
}

/* ==========================================================================
   Part 5.3: 全域性規則 (Global Rules)
   - 這些規則適用於所有自訂圖庫，無論說明是否可見。
   ========================================================================== */

/* 如果圖片有說明（即使它被設為 display: none），
   依然停用滑鼠懸停的放大效果。這個邏輯可以保持不變。*/
.wp-block-gallery.custom-layout .wp-block-image:has(figcaption):hover img,
.wp-block-gallery.custom-layout .wp-block-image:has(.wp-element-caption):hover img {
transform: scale(1);
}


/* --- 6. RESPONSIVE DESIGN (RWD) --- */

/**
 * 6.1 TABLET STYLES (螢幕寬度 <= 768px)
 */
@media (max-width: 768px) {
.wp-block-gallery.custom-layout[data-layout="slider"] {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}

.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] {
padding: 14px;
border-radius: 14px;
}

/* 基本網格 */
.wp-block-gallery.custom-layout[data-layout="twocols"],
.wp-block-gallery.custom-layout[data-layout="3"],
.wp-block-gallery.custom-layout[data-layout="4"] { grid-template-columns: repeat(2, 1fr) !important; }
.wp-block-gallery.custom-layout[data-layout="5"],
.wp-block-gallery.custom-layout[data-layout="6"],
.wp-block-gallery.custom-layout[data-layout="7"] { grid-template-columns: repeat(3, 1fr) !important; }

/* 特殊版型 */
.wp-block-gallery.custom-layout[data-layout="masonry"] { column-count: 2; }
.wp-block-gallery.custom-layout[data-layout="circlegrid"] { 
/* 修改7: 平板上調整最小寬度和內邊距 */
grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
padding: 20px 15px;
gap: 15px;
}

.wp-block-gallery.custom-layout[data-layout="circlegrid"] .wp-block-image {
min-width: 100px;
max-width: 200px;
}
}

/**
 * 6.2 MOBILE STYLES (螢幕寬度 <= 480px)
 */
@media (max-width: 480px) {
/* Slider 強制變為單欄 */
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="2"] .gallery-cell,
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="3"] .gallery-cell,
.wp-block-gallery.custom-layout[data-layout="slider"][data-slider-cols="4"] .gallery-cell {
width: 100%;
}

.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] {
padding: 10px;
}

.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .wp-block-image img {
height: clamp(220px, 48vh, 420px);
}

.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-button {
width: 78px;
}

/* 基本網格全部變為單欄 (除了 twocols) */
.wp-block-gallery.custom-layout[data-layout^="2"],
.wp-block-gallery.custom-layout[data-layout^="3"],
.wp-block-gallery.custom-layout[data-layout^="4"],
.wp-block-gallery.custom-layout[data-layout^="5"],
.wp-block-gallery.custom-layout[data-layout^="6"],
.wp-block-gallery.custom-layout[data-layout^="7"] { 
    grid-template-columns: 1fr !important; 
    gap: 10px; 
    height: auto !important; /* Reset JS-applied fixed height */
}

/* [Fix] Clear JS-applied positioning to ensure 1-column stack */
.wp-block-gallery.custom-layout[data-layout^="2"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="3"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="4"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="5"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="6"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout^="7"] .wp-block-image {
    grid-column: auto !important;
    grid-row: auto !important;
    width: 100% !important;
    height: auto !important;
}

/* 特殊版型 */
.wp-block-gallery.custom-layout[data-layout="masonry"] { column-count: 1; }
.wp-block-gallery.custom-layout[data-layout="diagstack"] { height: auto; }
.wp-block-gallery.custom-layout[data-layout="diagstack"] .wp-block-image { position: static !important; width: 100% !important; height: auto !important; transform: none !important; margin-bottom: 10px; }

.wp-block-gallery.custom-layout[data-layout="circlegrid"] { 
/* 修改8: 手機上進一步調整，確保至少能放下2個圓形 */
grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
padding: 15px 10px;
gap: 10px;
}

.wp-block-gallery.custom-layout[data-layout="circlegrid"] .wp-block-image {
min-width: 80px;
max-width: 150px;
}

.wp-block-gallery.custom-layout[data-layout="poster-duo"] {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
}

/* 修改9: 添加容器最小寬度保護 */
@media (max-width: 320px) {
.wp-block-gallery.custom-layout[data-layout="circlegrid"] {
grid-template-columns: repeat(2, 1fr);
padding: 10px 5px;
}
}

/* --- 7. ADDITIONAL UTILITY CLASSES --- */
.wp-block-gallery.custom-layout.layout-ready { opacity: 1; }
.wp-block-gallery.custom-layout a { display: block; text-decoration: none; color: inherit; }
.wp-block-gallery.custom-layout a:hover { text-decoration: none; }
.wp-block-gallery.custom-layout .wp-block-image:focus-within,
.wp-block-gallery.custom-layout a:focus { outline: 2px solid #0073aa; outline-offset: 2px; }

@media print {
.wp-block-gallery.custom-layout { display: block !important; overflow: visible !important; height: auto !important; page-break-inside: avoid; }
.wp-block-gallery.custom-layout .wp-block-image { display: block !important; width: 100% !important; height: auto !important; margin-bottom: 10px !important; break-inside: avoid; }
.wp-block-gallery.custom-layout .wp-block-image img { max-width: 100% !important; height: auto !important; object-fit: contain !important; }
}

@media (prefers-contrast: high) {
.wp-block-gallery.custom-layout[data-layout="polaroid"] .wp-block-image { border: 2px solid black; }
.wp-block-gallery.custom-layout[data-layout="filmstrip"] { border-top: 2px solid black; border-bottom: 2px solid black; }
}

@media (prefers-reduced-motion: reduce) {
.wp-block-gallery.custom-layout .wp-block-image,
.wp-block-gallery.custom-layout img,
.wp-block-gallery.custom-layout [data-layout] .wp-block-image,
.wp-block-gallery.custom-layout [data-layout] .wp-block-image:hover,
.wp-block-gallery.custom-layout [data-layout] .wp-block-image:hover img {
transition: none !important;
transform: none !important;
}
.wp-block-gallery.custom-layout:not(.layout-ready)::before { animation: none !important; }
}


/* ==========================================================================
   [新增 2025-12] 8 種新版型 CSS 樣式
   ========================================================================== */

/* --- A0. Hero Thumb Carousel 主圖 + 縮圖列 --- */
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] {
display: block !important;
background: linear-gradient(180deg, #fafbfd 0%, #f2f4f7 100%);
border: 1px solid rgba(15, 23, 42, 0.08);
border-radius: 18px;
padding: 18px;
box-sizing: border-box;
opacity: 1;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage {
margin-bottom: 14px;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .flickity-viewport {
border-radius: 14px;
overflow: hidden;
background: #111827;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .gallery-cell {
width: 100%;
min-height: 1px;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage a,
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .wp-block-image,
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage figure {
display: block;
height: 100%;
margin: 0;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .wp-block-image {
background: #111827;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .wp-block-image img {
display: block;
width: 100%;
height: clamp(280px, 56vh, 620px);
object-fit: contain;
object-position: center;
background: #111827;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-stage .wp-block-image figcaption {
position: static;
display: block;
padding: 12px 14px 0;
background: transparent;
color: #334155;
font-size: 14px;
line-height: 1.7;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-nav {
display: flex;
gap: 10px;
overflow-x: auto;
overflow-y: hidden;
padding: 2px 2px 6px;
scrollbar-width: thin;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-nav::-webkit-scrollbar {
height: 6px;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-nav::-webkit-scrollbar-thumb {
background: rgba(100, 116, 139, 0.35);
border-radius: 999px;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-button {
flex: 0 0 auto;
width: 92px;
padding: 0;
border: 2px solid transparent;
border-radius: 12px;
background: #fff;
box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08);
overflow: hidden;
cursor: pointer;
transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-button:hover {
transform: translateY(-1px);
box-shadow: 0 8px 22px rgba(15, 23, 42, 0.12);
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-button.is-active {
border-color: #0073aa;
box-shadow: 0 0 0 3px rgba(0, 115, 170, 0.12);
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .hero-thumb-image {
display: block;
width: 100%;
aspect-ratio: 4 / 3;
object-fit: cover;
object-position: center;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .flickity-prev-next-button {
width: 42px;
height: 42px;
background: rgba(255, 255, 255, 0.92);
border: 1px solid rgba(15, 23, 42, 0.08);
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .flickity-prev-next-button:hover {
background: #fff;
}
.wp-block-gallery.custom-layout[data-layout="hero-thumb-carousel"] .flickity-button-icon {
fill: #0f172a;
}

/* --- A0-2. Poster Duo 雙海報並排 --- */
.wp-block-gallery.custom-layout[data-layout="poster-duo"] {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 18px;
align-items: start;
}
.wp-block-gallery.custom-layout[data-layout="poster-duo"] > * {
min-width: 0;
}
.wp-block-gallery.custom-layout[data-layout="poster-duo"] a,
.wp-block-gallery.custom-layout[data-layout="poster-duo"] .wp-block-image,
.wp-block-gallery.custom-layout[data-layout="poster-duo"] figure {
display: block;
margin: 0;
}
.wp-block-gallery.custom-layout[data-layout="poster-duo"] .wp-block-image {
padding: 14px;
background: linear-gradient(180deg, #fbfbfc 0%, #f4f6f8 100%);
border: 1px solid rgba(15, 23, 42, 0.08);
border-radius: 18px;
box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}
.wp-block-gallery.custom-layout[data-layout="poster-duo"] .wp-block-image img {
display: block;
width: 100%;
aspect-ratio: 2 / 3;
height: auto;
object-fit: contain;
object-position: center;
background: #ffffff;
border-radius: 12px;
}
.wp-block-gallery.custom-layout[data-layout="poster-duo"] .wp-block-image figcaption {
position: static;
display: block;
padding-top: 10px;
background: transparent;
color: #334155;
font-size: 14px;
line-height: 1.7;
}

/* --- A1. Carousel 輪播圖 --- */
/* 基於 Slider，但有不同的視覺風格 */
.wp-block-gallery.custom-layout[data-layout="carousel"] {
height: 60vh;
max-height: 550px;
min-height: 350px;
background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
border-radius: 12px;
padding: 20px;
display: block;
opacity: 1;
}
.wp-block-gallery.custom-layout[data-layout="carousel"] .flickity-viewport,
.wp-block-gallery.custom-layout[data-layout="carousel"] .flickity-slider { height: 100%; }
.wp-block-gallery.custom-layout[data-layout="carousel"] .gallery-cell {
height: 100%;
margin-right: 15px;
box-sizing: border-box;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3);
}
.wp-block-gallery.custom-layout[data-layout="carousel"] .gallery-cell img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
}
.wp-block-gallery.custom-layout[data-layout="carousel"] .flickity-page-dots {
bottom: -30px;
}
.wp-block-gallery.custom-layout[data-layout="carousel"] .flickity-page-dots .dot {
background: rgba(255, 255, 255, 0.5);
}
.wp-block-gallery.custom-layout[data-layout="carousel"] .flickity-page-dots .dot.is-selected {
background: #fff;
}
.wp-block-gallery.custom-layout[data-layout="carousel"] .flickity-prev-next-button {
background: rgba(255, 255, 255, 0.9);
border-radius: 50%;
}


/* --- A2. Panorama 全景滾動 --- */
.wp-block-gallery.custom-layout[data-layout="panorama"] {
display: block !important;
overflow-x: auto;
overflow-y: hidden;
white-space: nowrap;
scroll-snap-type: x mandatory;
-webkit-overflow-scrolling: touch;
padding: 20px 0;
background: linear-gradient(to right, #0f0c29, #302b63, #24243e);
border-radius: 8px;
}
.wp-block-gallery.custom-layout[data-layout="panorama"] .wp-block-image {
display: inline-block !important;
width: auto !important;
height: 400px !important;
margin-right: 5px;
scroll-snap-align: start;
vertical-align: top;
white-space: normal;
flex: none !important;
}
.wp-block-gallery.custom-layout[data-layout="panorama"] .wp-block-image img {
height: 100%;
width: auto !important;
max-width: none;
object-fit: cover;
}
/* 滾動條美化 */
.wp-block-gallery.custom-layout[data-layout="panorama"]::-webkit-scrollbar {
height: 8px;
}
.wp-block-gallery.custom-layout[data-layout="panorama"]::-webkit-scrollbar-track {
background: rgba(255, 255, 255, 0.1);
border-radius: 4px;
}
.wp-block-gallery.custom-layout[data-layout="panorama"]::-webkit-scrollbar-thumb {
background: rgba(255, 255, 255, 0.4);
border-radius: 4px;
}


/* --- A3. Staggered 錯落排列 --- */
.wp-block-gallery.custom-layout[data-layout="staggered"] {
display: grid !important;
grid-template-columns: repeat(4, 1fr);
gap: 15px;
padding: 20px;
}
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image {
border-radius: 8px;
overflow: hidden;
transition: transform 0.4s ease, box-shadow 0.4s ease;
}
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image:nth-child(odd) {
transform: translateY(20px);
}
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image:nth-child(even) {
transform: translateY(-20px);
}
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image:hover {
transform: translateY(0) scale(1.02);
box-shadow: 0 15px 40px rgba(0, 0, 0, 0.2);
z-index: 10;
}
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image img {
width: 100%;
height: 100%;
object-fit: cover;
}


/* --- A4. Spotlight 聚光燈效果 --- */
.wp-block-gallery.custom-layout[data-layout="spotlight"] {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 10px;
background: #111;
padding: 20px;
border-radius: 12px;
}
.wp-block-gallery.custom-layout[data-layout="spotlight"] .wp-block-image {
border-radius: 8px;
overflow: hidden;
transition: opacity 0.4s ease, transform 0.4s ease, filter 0.4s ease;
}
.wp-block-gallery.custom-layout[data-layout="spotlight"] .wp-block-image.spotlight-dimmed {
opacity: 0.3;
filter: grayscale(80%);
transform: scale(0.95);
}
.wp-block-gallery.custom-layout[data-layout="spotlight"] .wp-block-image:not(.spotlight-dimmed) {
z-index: 10;
box-shadow: 0 0 30px rgba(255, 255, 255, 0.3);
}
.wp-block-gallery.custom-layout[data-layout="spotlight"] .wp-block-image img {
width: 100%;
height: 100%;
object-fit: cover;
}


/* --- A5. Timeline 時間軸 --- */
.wp-block-gallery.custom-layout[data-layout="timeline"] {
display: flex !important;
flex-direction: column;
position: relative;
padding-left: 60px;
gap: 30px;
}
/* 時間軸線條 */
.wp-block-gallery.custom-layout[data-layout="timeline"]::before {
content: '';
position: absolute;
left: 25px;
top: 0;
bottom: 0;
width: 4px;
background: linear-gradient(to bottom, #667eea 0%, #764ba2 100%);
border-radius: 2px;
}
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image {
position: relative;
width: 100% !important;
max-width: 500px;
border-radius: 12px;
overflow: hidden;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
}
/* 時間軸節點 */
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image::before {
content: '';
position: absolute;
left: -47px;
top: 50%;
transform: translateY(-50%);
width: 16px;
height: 16px;
background: #667eea;
border: 4px solid #fff;
border-radius: 50%;
box-shadow: 0 2px 8px rgba(102, 126, 234, 0.4);
z-index: 2;
}
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image:nth-child(even) {
align-self: flex-end;
}
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image:hover {
transform: scale(1.02);
}
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image img {
width: 100%;
height: auto;
object-fit: cover;
}


/* --- A6. Flip Cards 翻轉卡片 --- */
.wp-block-gallery.custom-layout[data-layout="flip-cards"] {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 20px;
padding: 20px;
perspective: 1000px;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .wp-block-image {
height: 300px !important;
position: relative;
perspective: 1000px;
cursor: pointer;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-inner {
position: relative;
width: 100%;
height: 100%;
transition: transform 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
transform-style: preserve-3d;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .wp-block-image:hover .flip-card-inner {
transform: rotateY(180deg);
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-front,
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-back {
position: absolute;
width: 100%;
height: 100%;
backface-visibility: hidden;
border-radius: 12px;
overflow: hidden;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-front {
z-index: 2;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-front img {
width: 100%;
height: 100%;
object-fit: cover;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-back {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
transform: rotateY(180deg);
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
box-sizing: border-box;
}
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .flip-card-content {
color: #fff;
font-size: 1.1em;
text-align: center;
line-height: 1.6;
}


/* --- A7. Minimal 極簡風格 --- */
.wp-block-gallery.custom-layout[data-layout="minimal"] {
display: flex !important;
flex-direction: column;
align-items: center;
gap: 60px;
padding: 40px 20px;
background: #fafafa;
}
.wp-block-gallery.custom-layout[data-layout="minimal"] .wp-block-image {
max-width: 800px;
width: 100% !important;
border: 1px solid #eee;
padding: 20px;
background: #fff;
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
transition: box-shadow 0.3s ease;
}
.wp-block-gallery.custom-layout[data-layout="minimal"] .wp-block-image:hover {
box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
}
.wp-block-gallery.custom-layout[data-layout="minimal"] .wp-block-image img {
width: 100%;
height: auto;
object-fit: contain;
}
/* 極簡風格允許顯示說明 */
.wp-block-gallery.custom-layout[data-layout="minimal"] .wp-block-image figcaption {
display: block !important;
text-align: center;
margin-top: 15px;
font-size: 0.9em;
color: #666;
font-style: italic;
}


/* --- A8. Overlap 重疊堆積 --- */
.wp-block-gallery.custom-layout[data-layout="overlap"] {
display: flex !important;
justify-content: center;
align-items: center;
padding: 40px;
min-height: 500px;
position: relative;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image {
position: absolute !important;
width: clamp(200px, 40%, 350px) !important;
height: auto !important;
border-radius: 12px;
box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);
transition: transform 0.4s ease, z-index 0s 0.2s;
overflow: hidden;
}
/* 不同位置的圖片 */
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image:nth-child(1) {
transform: rotate(-8deg) translate(-30%, -20%);
z-index: 1;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image:nth-child(2) {
transform: rotate(5deg) translate(25%, 10%);
z-index: 2;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image:nth-child(3) {
transform: rotate(-3deg) translate(-15%, 25%);
z-index: 3;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image:nth-child(4) {
transform: rotate(8deg) translate(20%, -25%);
z-index: 4;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image:nth-child(5) {
transform: rotate(-5deg) translate(5%, 0);
z-index: 5;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image:hover {
transform: rotate(0deg) scale(1.1) !important;
z-index: 100 !important;
transition: transform 0.4s ease, z-index 0s;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image img {
width: 100%;
height: 100%;
object-fit: cover;
}


/* ==========================================================================
   [新增版型] 響應式設計
   ========================================================================== */

@media (max-width: 768px) {
/* Panorama */
.wp-block-gallery.custom-layout[data-layout="panorama"] .wp-block-image {
height: 300px !important;
}

/* Staggered */
.wp-block-gallery.custom-layout[data-layout="staggered"] {
grid-template-columns: repeat(2, 1fr);
}
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image:nth-child(odd),
.wp-block-gallery.custom-layout[data-layout="staggered"] .wp-block-image:nth-child(even) {
transform: none;
}

/* Timeline */
.wp-block-gallery.custom-layout[data-layout="timeline"] {
padding-left: 40px;
}
.wp-block-gallery.custom-layout[data-layout="timeline"]::before {
left: 15px;
}
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image::before {
left: -33px;
width: 12px;
height: 12px;
}

/* Overlap */
.wp-block-gallery.custom-layout[data-layout="overlap"] {
min-height: 400px;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image {
width: clamp(150px, 50%, 280px) !important;
}
}

@media (max-width: 480px) {
/* Carousel */
.wp-block-gallery.custom-layout[data-layout="carousel"] {
height: 45vh;
min-height: 280px;
padding: 10px;
}

/* Panorama */
.wp-block-gallery.custom-layout[data-layout="panorama"] .wp-block-image {
height: 220px !important;
}

/* Staggered - 變為單欄 */
.wp-block-gallery.custom-layout[data-layout="staggered"] {
grid-template-columns: 1fr;
}

/* Timeline */
.wp-block-gallery.custom-layout[data-layout="timeline"] {
padding-left: 30px;
}
.wp-block-gallery.custom-layout[data-layout="timeline"]::before {
left: 10px;
width: 3px;
}
.wp-block-gallery.custom-layout[data-layout="timeline"] .wp-block-image::before {
left: -27px;
width: 10px;
height: 10px;
}

/* Flip Cards */
.wp-block-gallery.custom-layout[data-layout="flip-cards"] .wp-block-image {
height: 250px !important;
}

/* Minimal */
.wp-block-gallery.custom-layout[data-layout="minimal"] {
gap: 40px;
padding: 20px 10px;
}

/* Overlap - 變為堆疊顯示 */
.wp-block-gallery.custom-layout[data-layout="overlap"] {
flex-direction: column;
min-height: auto;
gap: 20px;
padding: 20px;
}
.wp-block-gallery.custom-layout[data-layout="overlap"] .wp-block-image {
position: relative !important;
width: 100% !important;
transform: none !important;
}
}

/* --- 8. LOADING STATE --- */
.wp-block-gallery.custom-layout.is-loading {
    opacity: 0.6;
    pointer-events: none;
    position: relative;
    min-height: 200px;
    transition: opacity 0.3s ease;
}

.wp-block-gallery.custom-layout.is-loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 30px;
    height: 30px;
    margin: -15px 0 0 -15px;
    border: 3px solid rgba(0, 0, 0, 0.1);
    border-top-color: #333;
    border-radius: 50%;
    animation: gallery-spinner 0.8s linear infinite;
    z-index: 10;
}

@keyframes gallery-spinner {
    to { transform: rotate(360deg); }
}


/* === infinite-scroll.css === */
/**
 * ============================================================================
 * 單篇文章無限滾動 - 完整 CSS 檔案 (v2.0)
 * ============================================================================
 *
 * @version 2.0.0
 * @description 整合所有優化效果的最終版本，適用於外部檔案載入。
 * - 更流暢的載入動畫與過渡效果。
 * - 引入骨架屏 (Skeleton Screen) 以提升感知效能。
 * - 保留並優化了響應式、Dark Mode、列印等現代化樣式。
 * - 結構化與註解更清晰，易於維護。
 */

/* ========================================================================= */
/* 0. 動畫定義 (Keyframes)
/* ========================================================================= */

/* 新載入內容的淡入+上移動畫 */
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}

/* 載入器旋轉動畫 */
@keyframes rotate {
100% {
transform: rotate(360deg);
}
}

/* 載入器路徑動畫 */
@keyframes dash {
0% {
stroke-dasharray: 1, 150;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -35;
}
100% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -124;
}
}

/* 骨架屏閃爍動畫 */
@keyframes shimmer {
0% {
background-position: 200% 0;
}
100% {
background-position: -200% 0;
}
}


/* ========================================================================= */
/* 1. 新文章容器與分隔線
/* ========================================================================= */

.infinite-scroll-post {
opacity: 0; /* 初始透明，等待動畫觸發 */
animation: fadeInUp 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards;
}

/* 重整時首屏不破版：第一則文章直接顯示，不做淡入（桌機／手機／平板通用） */
main#postshow-a > .infinite-scroll-post:first-of-type {
opacity: 1;
animation: none;
transform: translateY(0);
}

/* 確保文章之間有適當的視覺間隔，同時避免與分隔線的 margin 疊加 */
.infinite-scroll-post + .infinite-scroll-post {
padding-top: 40px; /* 用 padding 代替 border-top，避免影響 box-sizing */
}

.infinite-scroll-divider {
/* 預設不顯示，只在 JS 插入的新文章中顯示 */
display: none;
margin: 80px 0 60px;
text-align: center;
position: relative;
opacity: 0; /* 初始透明 */
animation: fadeInUp 0.7s 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; /* 延遲出現 */
}

/* 為第一篇之後的所有文章啟用分隔線 */
.infinite-scroll-post + .infinite-scroll-post .infinite-scroll-divider {
display: block;
}

.infinite-scroll-divider::before {
content: '';
position: absolute;
top: 50%;
left: 0;
right: 0;
height: 1px;
background: linear-gradient(to right, transparent, #e0e0e0 20%, #e0e0e0 80%, transparent);
}

.infinite-scroll-divider .divider-text {
position: relative;
display: inline-block;
padding: 8px 25px;
background: #fff;
color: #a0a0a0;
font-size: 13px;
font-weight: 500;
letter-spacing: 1.5px;
text-transform: uppercase;
border: 1px solid #e0e0e0;
border-radius: 20px;
z-index: 1; /* 確保文字在線上層 */
}

/* Keep trigger/end controls behind all posts even when parent is flex-ordered. */
main#postshow-a > #infinite-scroll-trigger,
main#postshow-a > #infinite-scroll-end {
order: 9999;
}

/* Keep appended infinite-scroll articles after current content in flex contexts. */
main#postshow-a > .infinite-scroll-post {
order: 20;
}


/* ========================================================================= */
/* 2. 載入觸發器、骨架屏與動畫
/* ========================================================================= */

.infinite-scroll-trigger {
padding: 60px 20px;
text-align: center;
min-height: 200px;
transition: opacity 0.4s ease;
opacity: 0; /* 初始完全透明 */
}

/* 當 JS 設置為 loading 狀態時，才讓它淡入 */
.infinite-scroll-trigger[data-loading="true"] {
opacity: 1;
}

/* 【新增】手動模式:當有按鈕時也要顯示 */
.infinite-scroll-trigger:has(#infinite-scroll-load-more-button) {
opacity: 1;
}

/* 傳統載入器 (作為骨架屏的備用) */
.infinite-scroll-loader {
display: none; /* 預設隱藏，優先使用骨架屏 */
flex-direction: column;
align-items: center;
gap: 15px;
}

.infinite-scroll-loader .spinner {
width: 45px;
height: 45px;
animation: rotate 1.8s linear infinite;
}

.infinite-scroll-loader .spinner .path {
stroke: #4a5568;
stroke-linecap: round;
animation: dash 1.5s ease-in-out infinite;
}

.loading-text {
margin: 0;
color: #718096;
font-size: 14px;
}

/* 手動載入按鈕 */
#infinite-scroll-load-more-button,
.load-more-button { /* 兼容舊 class name */
background: #4a5568;
color: #fff;
border: none;
padding: 12px 30px;
font-size: 15px;
border-radius: 8px;
cursor: pointer;
transition: background 0.3s, transform 0.2s;
}

#infinite-scroll-load-more-button:hover,
.load-more-button:hover {
background: #2d3748;
transform: translateY(-2px);
}


/* ========================================================================= */
/* 3. 骨架屏 (Skeleton Screen)
/* ========================================================================= */

.infinite-scroll-skeleton {
display: none; /* 預設隱藏，由 JS 控制顯示 */
padding: 40px 0;
}

.skeleton-wrapper {
max-width: 100%;
margin: auto;
background: #fff;
padding: 20px;
border-radius: 8px;
}

.skeleton-item {
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
background-size: 200% 100%;
animation: shimmer 1.8s infinite;
border-radius: 4px;
}

.skeleton-title { height: 32px; width: 70%; margin-bottom: 20px; }
.skeleton-meta { height: 16px; width: 40%; margin-bottom: 30px; }
.skeleton-content { display: flex; flex-direction: column; gap: 12px; }
.skeleton-line { height: 16px; }
.skeleton-line:nth-child(1) { width: 100%; }
.skeleton-line:nth-child(2) { width: 95%; }
.skeleton-line:nth-child(3) { width: 98%; }


/* ========================================================================= */
/* 4. 結束訊息
/* ========================================================================= */

.infinite-scroll-end {
padding: 70px 20px;
text-align: center;
background-color: #f7fafc;
border-top: 1px solid #e2e8f0;
margin: 60px 0;
border-radius: 12px;
position: relative; /* 為關閉按鈕定位 */
}

/* 關閉按鈕 */
.infinite-scroll-end-close {
position: absolute;
top: 15px;
right: 15px;
width: 32px;
height: 32px;
background: rgba(0, 0, 0, 0.05);
border: none;
border-radius: 50%;
font-size: 24px;
line-height: 1;
color: #718096;
cursor: pointer;
transition: all 0.2s ease;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
}

.infinite-scroll-end-close:hover {
background: rgba(0, 0, 0, 0.1);
color: #2d3748;
transform: rotate(90deg);
}

.infinite-scroll-end-close:active {
transform: rotate(90deg) scale(0.95);
}

.infinite-scroll-end p {
font-size: 1.1em;
color: #4a5568;
margin: 0 0 25px 0;
font-weight: 500;
}

.infinite-scroll-end .back-home {
display: inline-block;
padding: 12px 32px;
background-color: #4a5568;
color: #fff;
text-decoration: none;
border-radius: 8px;
font-weight: 600;
transition: all 0.3s ease;
}

.infinite-scroll-end .back-home:hover {
background-color: #2d3748;
transform: translateY(-3px);
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.1);
}

/* 結束區塊按鈕容器 */
.infinite-scroll-end-actions {
display: flex;
flex-wrap: wrap;
gap: 12px;
justify-content: center;
align-items: center;
}

/* 繼續載入最新文章按鈕 */
.infinite-scroll-end .load-latest-button {
display: inline-block;
padding: 12px 32px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: #fff;
border: none;
border-radius: 8px;
font-size: 15px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
}

.infinite-scroll-end .load-latest-button:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(102, 126, 234, 0.4);
}


/* ========================================================================= */
/* 5. 哨兵元素 (不可見)
/* ========================================================================= */

.scroll-sentinel-top,
.scroll-sentinel-bottom {
height: 1px;
visibility: hidden;
pointer-events: none;
}


/* ========================================================================= */
/* 6. 響應式設計
/* ========================================================================= */

@media (max-width: 768px) {
.infinite-scroll-divider {
margin: 60px 0 40px;
}

.infinite-scroll-trigger {
padding: 40px 15px;
min-height: 150px;
}

.infinite-scroll-end {
margin: 40px 0; /* 在手機上可以移除左右負邊距，讓其填滿 */
border-radius: 0;
padding: 60px 20px;
}

.infinite-scroll-end p {
font-size: 1rem;
}
}


/* ========================================================================= */
/* 7. 無障礙與使用者偏好
/* ========================================================================= */

/* 焦點可見性 */
.infinite-scroll-end .back-home:focus-visible,
#infinite-scroll-load-more-button:focus-visible {
outline: 3px solid #4a5568;
outline-offset: 3px;
}

/* 減少動畫偏好：關閉動畫時文章仍須直接可見，避免破版 */
@media (prefers-reduced-motion: reduce) {
.infinite-scroll-post,
.infinite-scroll-divider,
.infinite-scroll-loader .spinner,
.infinite-scroll-end .back-home,
#infinite-scroll-load-more-button,
.skeleton-item {
animation: none !important;
transition: none !important;
}
.infinite-scroll-post {
opacity: 1 !important;
transform: none !important;
}
}


/* ========================================================================= */
/* 8. 列印樣式
/* ========================================================================= */

@media print {
.infinite-scroll-trigger,
.infinite-scroll-end,
.infinite-scroll-divider {
display: none !important;
}

.infinite-scroll-post {
page-break-inside: avoid;
break-inside: avoid;
opacity: 1 !important; /* 確保在列印時可見 */
transform: none !important;
}
}


/* ========================================================================= */
/* 9. Dark Mode 支援 (可選)
/* ========================================================================= */

@media (prefers-color-scheme: dark) {
/* 也可以使用 body.dark-mode 或 html.dark-mode 選擇器 */
.infinite-scroll-divider::before {
background: linear-gradient(to right, transparent, #3a3a3a 20%, #3a3a3a 80%, transparent);
}

.infinite-scroll-divider .divider-text {
/*background: #1a1a1a;*/
color: #999;
border-color: #3a3a3a;
}

.loading-text {
color: #999;
}

.infinite-scroll-loader .spinner .path {
stroke: #999;
}

#infinite-scroll-load-more-button,
.load-more-button {
background: #555;
}
#infinite-scroll-load-more-button:hover,
.load-more-button:hover {
background: #777;
}

.infinite-scroll-end {
background: #1a1a1a;
border-top-color: #3a3a3a;
}

.infinite-scroll-end p {
color: #999;
}

.infinite-scroll-end .back-home {
background: #555;
}
.infinite-scroll-end .back-home:hover {
background: #777;
}

.skeleton-item {
background: linear-gradient(90deg, #2d2d2d 25%, #3a3a3a 50%, #2d2d2d 75%);
}
}

/*
 * =======================================================
 *  無限滾動 - 廣告顯示與佈局最終修正
 * =======================================================
 */

/* 
 * 1. 確保新載入的廣告預設為隱藏，防止提前閃現。
 *(由 JavaScript 負責在適當時機將其 display 改為 block)
 */
.infinite-scroll-post .ad-container-top:not(:empty) {
display: none;
}

/* 
 * 2. 例外規則：確保頁面首次載入時，第一篇文章的廣告是正常可見的。
 */
main#postshow-a > .infinite-scroll-post:first-of-type .ad-container-top:not(:empty) {
display: block;
}

/* 
 * 3. 【本次新增】為所有文章頂部的廣告容器增加上邊距，解決與分隔線緊貼的問題。
 *這個樣式會對所有 .ad-container-top 生效，無論它是顯示還是隱藏。
 */
.infinite-scroll-post .ad-container-top:not(:empty) {
margin-top: 25px; /* 可根據需求調整數值 */
}

/*
 * 無限滾動 - 分隔線樣式修正
 * -------------------------------------
 * 確保 AJAX 載入的文章頂部分隔線永遠可見且有適當的間距。
 */
.infinite-scroll-post .infinite-scroll-divider {
display: block ; /* 使用 !important 強制顯示 */
text-align: center;
padding: 20px 0;
margin-top: 30px; /* 與上一篇文章的結尾產生間距 */
margin-bottom: 30px; /* 與本篇文章的開頭產生間距 */
color: #888;
}

/* 確保你的 CSS 有這些設定 */
#postshow-a .entry-title {
word-wrap: break-word;
overflow-wrap: break-word;
word-break: break-word;
hyphens: auto;
}

#postshow-a article {
max-width: 100%;
overflow: hidden;
}

#postshow-a .entry-header {
max-width: 100%;
overflow: hidden;
}

/* 2-6 在無限滾動中固定為「上 Hero、下內容」，避免切換文章時版型抖動 */
main#postshow-a .infinite-scroll-post.si-26-split-inspired > [id^="post-"] {
display: block !important;
}

main#postshow-a .infinite-scroll-post.si-26-split-inspired #si-single-content {
margin-top: 0 !important;
}

/* Global layout customization (per-loaded-article) */
/* width tokens -> CSS variables (cache-friendly: class-based, no inline style) */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-800 { --hd-featured-image-max-width: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-820 { --hd-featured-image-max-width: 820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-840 { --hd-featured-image-max-width: 840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-860 { --hd-featured-image-max-width: 860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-880 { --hd-featured-image-max-width: 880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-900 { --hd-featured-image-max-width: 900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-920 { --hd-featured-image-max-width: 920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-940 { --hd-featured-image-max-width: 940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-960 { --hd-featured-image-max-width: 960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-980 { --hd-featured-image-max-width: 980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1000 { --hd-featured-image-max-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1020 { --hd-featured-image-max-width: 1020px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1040 { --hd-featured-image-max-width: 1040px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1060 { --hd-featured-image-max-width: 1060px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1080 { --hd-featured-image-max-width: 1080px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1100 { --hd-featured-image-max-width: 1100px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1120 { --hd-featured-image-max-width: 1120px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1140 { --hd-featured-image-max-width: 1140px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1160 { --hd-featured-image-max-width: 1160px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1180 { --hd-featured-image-max-width: 1180px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1200 { --hd-featured-image-max-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1220 { --hd-featured-image-max-width: 1220px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1240 { --hd-featured-image-max-width: 1240px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1260 { --hd-featured-image-max-width: 1260px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1280 { --hd-featured-image-max-width: 1280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1300 { --hd-featured-image-max-width: 1300px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1320 { --hd-featured-image-max-width: 1320px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1340 { --hd-featured-image-max-width: 1340px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1360 { --hd-featured-image-max-width: 1360px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1380 { --hd-featured-image-max-width: 1380px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1400 { --hd-featured-image-max-width: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1420 { --hd-featured-image-max-width: 1420px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1440 { --hd-featured-image-max-width: 1440px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1460 { --hd-featured-image-max-width: 1460px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1480 { --hd-featured-image-max-width: 1480px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1500 { --hd-featured-image-max-width: 1500px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1520 { --hd-featured-image-max-width: 1520px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1540 { --hd-featured-image-max-width: 1540px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1560 { --hd-featured-image-max-width: 1560px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1580 { --hd-featured-image-max-width: 1580px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1600 { --hd-featured-image-max-width: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1620 { --hd-featured-image-max-width: 1620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1640 { --hd-featured-image-max-width: 1640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1660 { --hd-featured-image-max-width: 1660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1680 { --hd-featured-image-max-width: 1680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1700 { --hd-featured-image-max-width: 1700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1720 { --hd-featured-image-max-width: 1720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1740 { --hd-featured-image-max-width: 1740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1760 { --hd-featured-image-max-width: 1760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1780 { --hd-featured-image-max-width: 1780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1800 { --hd-featured-image-max-width: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1820 { --hd-featured-image-max-width: 1820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1840 { --hd-featured-image-max-width: 1840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1860 { --hd-featured-image-max-width: 1860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1880 { --hd-featured-image-max-width: 1880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1900 { --hd-featured-image-max-width: 1900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1920 { --hd-featured-image-max-width: 1920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1940 { --hd-featured-image-max-width: 1940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1960 { --hd-featured-image-max-width: 1960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-1980 { --hd-featured-image-max-width: 1980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-2000 { --hd-featured-image-max-width: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fw-full { --hd-featured-image-max-width: 100vw; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-600 { --hd-title-max-width: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-620 { --hd-title-max-width: 620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-640 { --hd-title-max-width: 640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-660 { --hd-title-max-width: 660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-680 { --hd-title-max-width: 680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-700 { --hd-title-max-width: 700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-720 { --hd-title-max-width: 720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-740 { --hd-title-max-width: 740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-760 { --hd-title-max-width: 760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-780 { --hd-title-max-width: 780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-800 { --hd-title-max-width: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-820 { --hd-title-max-width: 820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-840 { --hd-title-max-width: 840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-860 { --hd-title-max-width: 860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-880 { --hd-title-max-width: 880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-900 { --hd-title-max-width: 900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-920 { --hd-title-max-width: 920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-940 { --hd-title-max-width: 940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-960 { --hd-title-max-width: 960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-980 { --hd-title-max-width: 980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1000 { --hd-title-max-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1020 { --hd-title-max-width: 1020px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1040 { --hd-title-max-width: 1040px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1060 { --hd-title-max-width: 1060px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1080 { --hd-title-max-width: 1080px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1100 { --hd-title-max-width: 1100px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1120 { --hd-title-max-width: 1120px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1140 { --hd-title-max-width: 1140px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1160 { --hd-title-max-width: 1160px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1180 { --hd-title-max-width: 1180px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1200 { --hd-title-max-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1220 { --hd-title-max-width: 1220px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1240 { --hd-title-max-width: 1240px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1260 { --hd-title-max-width: 1260px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1280 { --hd-title-max-width: 1280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1300 { --hd-title-max-width: 1300px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1320 { --hd-title-max-width: 1320px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1340 { --hd-title-max-width: 1340px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1360 { --hd-title-max-width: 1360px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1380 { --hd-title-max-width: 1380px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1400 { --hd-title-max-width: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1420 { --hd-title-max-width: 1420px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1440 { --hd-title-max-width: 1440px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1460 { --hd-title-max-width: 1460px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1480 { --hd-title-max-width: 1480px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1500 { --hd-title-max-width: 1500px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1520 { --hd-title-max-width: 1520px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1540 { --hd-title-max-width: 1540px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1560 { --hd-title-max-width: 1560px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1580 { --hd-title-max-width: 1580px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1600 { --hd-title-max-width: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1620 { --hd-title-max-width: 1620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1640 { --hd-title-max-width: 1640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1660 { --hd-title-max-width: 1660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1680 { --hd-title-max-width: 1680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1700 { --hd-title-max-width: 1700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1720 { --hd-title-max-width: 1720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1740 { --hd-title-max-width: 1740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1760 { --hd-title-max-width: 1760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1780 { --hd-title-max-width: 1780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1800 { --hd-title-max-width: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1820 { --hd-title-max-width: 1820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1840 { --hd-title-max-width: 1840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1860 { --hd-title-max-width: 1860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1880 { --hd-title-max-width: 1880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1900 { --hd-title-max-width: 1900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1920 { --hd-title-max-width: 1920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1940 { --hd-title-max-width: 1940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1960 { --hd-title-max-width: 1960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-1980 { --hd-title-max-width: 1980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tw-2000 { --hd-title-max-width: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-600 { --hd-meta-max-width: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-620 { --hd-meta-max-width: 620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-640 { --hd-meta-max-width: 640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-660 { --hd-meta-max-width: 660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-680 { --hd-meta-max-width: 680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-700 { --hd-meta-max-width: 700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-720 { --hd-meta-max-width: 720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-740 { --hd-meta-max-width: 740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-760 { --hd-meta-max-width: 760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-780 { --hd-meta-max-width: 780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-800 { --hd-meta-max-width: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-820 { --hd-meta-max-width: 820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-840 { --hd-meta-max-width: 840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-860 { --hd-meta-max-width: 860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-880 { --hd-meta-max-width: 880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-900 { --hd-meta-max-width: 900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-920 { --hd-meta-max-width: 920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-940 { --hd-meta-max-width: 940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-960 { --hd-meta-max-width: 960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-980 { --hd-meta-max-width: 980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1000 { --hd-meta-max-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1020 { --hd-meta-max-width: 1020px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1040 { --hd-meta-max-width: 1040px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1060 { --hd-meta-max-width: 1060px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1080 { --hd-meta-max-width: 1080px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1100 { --hd-meta-max-width: 1100px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1120 { --hd-meta-max-width: 1120px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1140 { --hd-meta-max-width: 1140px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1160 { --hd-meta-max-width: 1160px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1180 { --hd-meta-max-width: 1180px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1200 { --hd-meta-max-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1220 { --hd-meta-max-width: 1220px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1240 { --hd-meta-max-width: 1240px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1260 { --hd-meta-max-width: 1260px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1280 { --hd-meta-max-width: 1280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1300 { --hd-meta-max-width: 1300px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1320 { --hd-meta-max-width: 1320px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1340 { --hd-meta-max-width: 1340px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1360 { --hd-meta-max-width: 1360px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1380 { --hd-meta-max-width: 1380px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1400 { --hd-meta-max-width: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1420 { --hd-meta-max-width: 1420px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1440 { --hd-meta-max-width: 1440px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1460 { --hd-meta-max-width: 1460px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1480 { --hd-meta-max-width: 1480px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1500 { --hd-meta-max-width: 1500px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1520 { --hd-meta-max-width: 1520px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1540 { --hd-meta-max-width: 1540px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1560 { --hd-meta-max-width: 1560px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1580 { --hd-meta-max-width: 1580px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1600 { --hd-meta-max-width: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1620 { --hd-meta-max-width: 1620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1640 { --hd-meta-max-width: 1640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1660 { --hd-meta-max-width: 1660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1680 { --hd-meta-max-width: 1680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1700 { --hd-meta-max-width: 1700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1720 { --hd-meta-max-width: 1720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1740 { --hd-meta-max-width: 1740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1760 { --hd-meta-max-width: 1760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1780 { --hd-meta-max-width: 1780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1800 { --hd-meta-max-width: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1820 { --hd-meta-max-width: 1820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1840 { --hd-meta-max-width: 1840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1860 { --hd-meta-max-width: 1860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1880 { --hd-meta-max-width: 1880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1900 { --hd-meta-max-width: 1900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1920 { --hd-meta-max-width: 1920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1940 { --hd-meta-max-width: 1940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1960 { --hd-meta-max-width: 1960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-1980 { --hd-meta-max-width: 1980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mw-2000 { --hd-meta-max-width: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-600 { --hd-breadcrumb-max-width: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-620 { --hd-breadcrumb-max-width: 620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-640 { --hd-breadcrumb-max-width: 640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-660 { --hd-breadcrumb-max-width: 660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-680 { --hd-breadcrumb-max-width: 680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-700 { --hd-breadcrumb-max-width: 700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-720 { --hd-breadcrumb-max-width: 720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-740 { --hd-breadcrumb-max-width: 740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-760 { --hd-breadcrumb-max-width: 760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-780 { --hd-breadcrumb-max-width: 780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-800 { --hd-breadcrumb-max-width: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-820 { --hd-breadcrumb-max-width: 820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-840 { --hd-breadcrumb-max-width: 840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-860 { --hd-breadcrumb-max-width: 860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-880 { --hd-breadcrumb-max-width: 880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-900 { --hd-breadcrumb-max-width: 900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-920 { --hd-breadcrumb-max-width: 920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-940 { --hd-breadcrumb-max-width: 940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-960 { --hd-breadcrumb-max-width: 960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-980 { --hd-breadcrumb-max-width: 980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1000 { --hd-breadcrumb-max-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1020 { --hd-breadcrumb-max-width: 1020px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1040 { --hd-breadcrumb-max-width: 1040px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1060 { --hd-breadcrumb-max-width: 1060px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1080 { --hd-breadcrumb-max-width: 1080px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1100 { --hd-breadcrumb-max-width: 1100px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1120 { --hd-breadcrumb-max-width: 1120px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1140 { --hd-breadcrumb-max-width: 1140px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1160 { --hd-breadcrumb-max-width: 1160px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1180 { --hd-breadcrumb-max-width: 1180px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1200 { --hd-breadcrumb-max-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1220 { --hd-breadcrumb-max-width: 1220px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1240 { --hd-breadcrumb-max-width: 1240px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1260 { --hd-breadcrumb-max-width: 1260px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1280 { --hd-breadcrumb-max-width: 1280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1300 { --hd-breadcrumb-max-width: 1300px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1320 { --hd-breadcrumb-max-width: 1320px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1340 { --hd-breadcrumb-max-width: 1340px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1360 { --hd-breadcrumb-max-width: 1360px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1380 { --hd-breadcrumb-max-width: 1380px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1400 { --hd-breadcrumb-max-width: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1420 { --hd-breadcrumb-max-width: 1420px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1440 { --hd-breadcrumb-max-width: 1440px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1460 { --hd-breadcrumb-max-width: 1460px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1480 { --hd-breadcrumb-max-width: 1480px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1500 { --hd-breadcrumb-max-width: 1500px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1520 { --hd-breadcrumb-max-width: 1520px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1540 { --hd-breadcrumb-max-width: 1540px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1560 { --hd-breadcrumb-max-width: 1560px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1580 { --hd-breadcrumb-max-width: 1580px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1600 { --hd-breadcrumb-max-width: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1620 { --hd-breadcrumb-max-width: 1620px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1640 { --hd-breadcrumb-max-width: 1640px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1660 { --hd-breadcrumb-max-width: 1660px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1680 { --hd-breadcrumb-max-width: 1680px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1700 { --hd-breadcrumb-max-width: 1700px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1720 { --hd-breadcrumb-max-width: 1720px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1740 { --hd-breadcrumb-max-width: 1740px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1760 { --hd-breadcrumb-max-width: 1760px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1780 { --hd-breadcrumb-max-width: 1780px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1800 { --hd-breadcrumb-max-width: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1820 { --hd-breadcrumb-max-width: 1820px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1840 { --hd-breadcrumb-max-width: 1840px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1860 { --hd-breadcrumb-max-width: 1860px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1880 { --hd-breadcrumb-max-width: 1880px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1900 { --hd-breadcrumb-max-width: 1900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1920 { --hd-breadcrumb-max-width: 1920px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1940 { --hd-breadcrumb-max-width: 1940px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1960 { --hd-breadcrumb-max-width: 1960px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-1980 { --hd-breadcrumb-max-width: 1980px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bw-2000 { --hd-breadcrumb-max-width: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-800 { --hd-content-max-width: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-1000 { --hd-content-max-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-1200 { --hd-content-max-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-1280 { --hd-content-max-width: 1280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth { --hd-content-max-width: 100%; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-24 { --hd-title-font-size: 24px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-28 { --hd-title-font-size: 28px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-32 { --hd-title-font-size: 32px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-36 { --hd-title-font-size: 36px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-40 { --hd-title-font-size: 40px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-44 { --hd-title-font-size: 44px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-48 { --hd-title-font-size: 48px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-ts-52 { --hd-title-font-size: 52px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1000 { --hd-ab-container-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1100 { --hd-ab-container-width: 1100px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1200 { --hd-ab-container-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1280 { --hd-ab-container-width: 1280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1360 { --hd-ab-container-width: 1360px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1440 { --hd-ab-container-width: 1440px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-abw-1600 { --hd-ab-container-width: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-aw-auto { --hd-main-column-width: auto; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-aw-800 { --hd-main-column-width: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-aw-900 { --hd-main-column-width: 900px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-aw-1000 { --hd-main-column-width: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-aw-1100 { --hd-main-column-width: 1100px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-aw-1200 { --hd-main-column-width: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sw-260 { --hd-sidebar-width: 260px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sw-280 { --hd-sidebar-width: 280px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sw-300 { --hd-sidebar-width: 300px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sw-330 { --hd-sidebar-width: 330px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sw-360 { --hd-sidebar-width: 360px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sw-400 { --hd-sidebar-width: 400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-0 { --hd-sidebar-gap: 0px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-4 { --hd-sidebar-gap: 4px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-8 { --hd-sidebar-gap: 8px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-12 { --hd-sidebar-gap: 12px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-18 { --hd-sidebar-gap: 18px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-20 { --hd-sidebar-gap: 20px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-24 { --hd-sidebar-gap: 24px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-sg-32 { --hd-sidebar-gap: 32px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-top-0 { --hd-top-spacing: 0px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-top-12 { --hd-top-spacing: 12px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-top-20 { --hd-top-spacing: 20px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-top-28 { --hd-top-spacing: 28px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-top-36 { --hd-top-spacing: 36px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-top-48 { --hd-top-spacing: 48px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-gs-8 { --hd-section-gap: 8px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-gs-12 { --hd-section-gap: 12px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-gs-16 { --hd-section-gap: 16px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-gs-20 { --hd-section-gap: 20px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-gs-24 { --hd-section-gap: 24px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-gs-32 { --hd-section-gap: 32px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fs-4 { --hd-field-gap: 4px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fs-8 { --hd-field-gap: 8px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fs-10 { --hd-field-gap: 10px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fs-12 { --hd-field-gap: 12px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fs-16 { --hd-field-gap: 16px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fs-20 { --hd-field-gap: 20px; }

/* Responsive tokens: Tablet / Mobile */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwt-inherit { --hd-content-max-width-tablet: var(--hd-content-max-width, 1000px); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwt-800 { --hd-content-max-width-tablet: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwt-850 { --hd-content-max-width-tablet: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwt-1000 { --hd-content-max-width-tablet: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwt-1200 { --hd-content-max-width-tablet: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwt-fullwidth { --hd-content-max-width-tablet: 100%; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwm-inherit { --hd-content-max-width-mobile: var(--hd-content-max-width-tablet, var(--hd-content-max-width, 1000px)); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwm-800 { --hd-content-max-width-mobile: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwm-850 { --hd-content-max-width-mobile: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwm-1000 { --hd-content-max-width-mobile: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwm-1200 { --hd-content-max-width-mobile: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cwm-fullwidth { --hd-content-max-width-mobile: 100%; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-inherit { --hd-featured-image-max-width-tablet: var(--hd-featured-image-max-width, 1000px); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-800 { --hd-featured-image-max-width-tablet: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-850 { --hd-featured-image-max-width-tablet: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-1000 { --hd-featured-image-max-width-tablet: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-1200 { --hd-featured-image-max-width-tablet: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-1400 { --hd-featured-image-max-width-tablet: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-1600 { --hd-featured-image-max-width-tablet: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-1800 { --hd-featured-image-max-width-tablet: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-2000 { --hd-featured-image-max-width-tablet: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwt-full { --hd-featured-image-max-width-tablet: 100vw; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-inherit { --hd-featured-image-max-width-mobile: var(--hd-featured-image-max-width-tablet, var(--hd-featured-image-max-width, 1000px)); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-800 { --hd-featured-image-max-width-mobile: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-850 { --hd-featured-image-max-width-mobile: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-1000 { --hd-featured-image-max-width-mobile: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-1200 { --hd-featured-image-max-width-mobile: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-1400 { --hd-featured-image-max-width-mobile: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-1600 { --hd-featured-image-max-width-mobile: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-1800 { --hd-featured-image-max-width-mobile: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-2000 { --hd-featured-image-max-width-mobile: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-fwm-full { --hd-featured-image-max-width-mobile: 100vw; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-inherit { --hd-title-max-width-tablet: var(--hd-title-max-width, 1000px); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-600 { --hd-title-max-width-tablet: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-800 { --hd-title-max-width-tablet: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-850 { --hd-title-max-width-tablet: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-1000 { --hd-title-max-width-tablet: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-1200 { --hd-title-max-width-tablet: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-1400 { --hd-title-max-width-tablet: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-1600 { --hd-title-max-width-tablet: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-1800 { --hd-title-max-width-tablet: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twt-2000 { --hd-title-max-width-tablet: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-inherit { --hd-title-max-width-mobile: var(--hd-title-max-width-tablet, var(--hd-title-max-width, 1000px)); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-600 { --hd-title-max-width-mobile: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-800 { --hd-title-max-width-mobile: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-850 { --hd-title-max-width-mobile: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-1000 { --hd-title-max-width-mobile: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-1200 { --hd-title-max-width-mobile: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-1400 { --hd-title-max-width-mobile: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-1600 { --hd-title-max-width-mobile: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-1800 { --hd-title-max-width-mobile: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-twm-2000 { --hd-title-max-width-mobile: 2000px; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-inherit { --hd-meta-max-width-tablet: var(--hd-meta-max-width, 1000px); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-600 { --hd-meta-max-width-tablet: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-800 { --hd-meta-max-width-tablet: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-850 { --hd-meta-max-width-tablet: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-1000 { --hd-meta-max-width-tablet: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-1200 { --hd-meta-max-width-tablet: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-1400 { --hd-meta-max-width-tablet: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-1600 { --hd-meta-max-width-tablet: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-1800 { --hd-meta-max-width-tablet: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwt-2000 { --hd-meta-max-width-tablet: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-inherit { --hd-meta-max-width-mobile: var(--hd-meta-max-width-tablet, var(--hd-meta-max-width, 1000px)); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-600 { --hd-meta-max-width-mobile: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-800 { --hd-meta-max-width-mobile: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-850 { --hd-meta-max-width-mobile: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-1000 { --hd-meta-max-width-mobile: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-1200 { --hd-meta-max-width-mobile: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-1400 { --hd-meta-max-width-mobile: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-1600 { --hd-meta-max-width-mobile: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-1800 { --hd-meta-max-width-mobile: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-mwm-2000 { --hd-meta-max-width-mobile: 2000px; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-inherit { --hd-breadcrumb-max-width-tablet: var(--hd-breadcrumb-max-width, 1000px); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-600 { --hd-breadcrumb-max-width-tablet: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-800 { --hd-breadcrumb-max-width-tablet: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-850 { --hd-breadcrumb-max-width-tablet: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-1000 { --hd-breadcrumb-max-width-tablet: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-1200 { --hd-breadcrumb-max-width-tablet: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-1400 { --hd-breadcrumb-max-width-tablet: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-1600 { --hd-breadcrumb-max-width-tablet: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-1800 { --hd-breadcrumb-max-width-tablet: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwt-2000 { --hd-breadcrumb-max-width-tablet: 2000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-inherit { --hd-breadcrumb-max-width-mobile: var(--hd-breadcrumb-max-width-tablet, var(--hd-breadcrumb-max-width, 1000px)); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-600 { --hd-breadcrumb-max-width-mobile: 600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-800 { --hd-breadcrumb-max-width-mobile: 800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-850 { --hd-breadcrumb-max-width-mobile: 850px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-1000 { --hd-breadcrumb-max-width-mobile: 1000px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-1200 { --hd-breadcrumb-max-width-mobile: 1200px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-1400 { --hd-breadcrumb-max-width-mobile: 1400px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-1600 { --hd-breadcrumb-max-width-mobile: 1600px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-1800 { --hd-breadcrumb-max-width-mobile: 1800px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-bwm-2000 { --hd-breadcrumb-max-width-mobile: 2000px; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-inherit { --hd-title-font-size-tablet: var(--hd-title-font-size, 44px); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-24 { --hd-title-font-size-tablet: 24px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-28 { --hd-title-font-size-tablet: 28px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-32 { --hd-title-font-size-tablet: 32px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-36 { --hd-title-font-size-tablet: 36px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-40 { --hd-title-font-size-tablet: 40px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-44 { --hd-title-font-size-tablet: 44px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-48 { --hd-title-font-size-tablet: 48px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tst-52 { --hd-title-font-size-tablet: 52px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-inherit { --hd-title-font-size-mobile: var(--hd-title-font-size-tablet, var(--hd-title-font-size, 44px)); }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-24 { --hd-title-font-size-mobile: 24px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-28 { --hd-title-font-size-mobile: 28px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-32 { --hd-title-font-size-mobile: 32px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-36 { --hd-title-font-size-mobile: 36px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-40 { --hd-title-font-size-mobile: 40px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-44 { --hd-title-font-size-mobile: 44px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-48 { --hd-title-font-size-mobile: 48px; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-tsm-52 { --hd-title-font-size-mobile: 52px; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable {
--hd-content-max-width-active: var(--hd-content-max-width, 1000px);
--hd-featured-image-max-width-active: var(--hd-featured-image-max-width, 1000px);
--hd-title-max-width-active: var(--hd-title-max-width, 1000px);
--hd-meta-max-width-active: var(--hd-meta-max-width, 1000px);
--hd-breadcrumb-max-width-active: var(--hd-breadcrumb-max-width, 1000px);
--hd-title-font-size-active: var(--hd-title-font-size, inherit);
--fc-content-width: var(--hd-content-max-width-active);
}

@media (max-width: 1199px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable {
--hd-content-max-width-active: var(--hd-content-max-width-tablet, var(--hd-content-max-width, 1000px));
--hd-featured-image-max-width-active: var(--hd-featured-image-max-width-tablet, var(--hd-featured-image-max-width, 1000px));
--hd-title-max-width-active: var(--hd-title-max-width-tablet, var(--hd-title-max-width, 1000px));
--hd-meta-max-width-active: var(--hd-meta-max-width-tablet, var(--hd-meta-max-width, 1000px));
--hd-breadcrumb-max-width-active: var(--hd-breadcrumb-max-width-tablet, var(--hd-breadcrumb-max-width, 1000px));
--hd-title-font-size-active: var(--hd-title-font-size-tablet, var(--hd-title-font-size, inherit));
--fc-content-width: var(--hd-content-max-width-active);
}
}

@media (max-width: 1199px) {
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full {
width: min(100%, calc(var(--aspect-ratio, 1) * 75vh)) !important;
max-width: 100% !important;
aspect-ratio: var(--aspect-ratio) !important;
max-height: 75vh !important;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full > picture,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full > a,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full > picture,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full > a {
display: block;
width: 100%;
height: 100%;
}

main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full > img {
width: 100% !important;
height: 100% !important;
max-height: none !important;
object-fit: contain;
}
}

@supports (-webkit-touch-callout: none) {
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."],
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] {
width: fit-content !important;
max-width: 100% !important;
height: auto !important;
max-height: min(82vh, 1200px) !important;
aspect-ratio: auto !important;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a {
display: block;
width: auto !important;
max-width: 100% !important;
height: auto !important;
max-height: inherit;
line-height: 0;
}

main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > img {
width: auto !important;
max-width: 100% !important;
height: auto !important;
max-height: min(82vh, 1200px) !important;
object-fit: contain;
}

@media (max-width: 1199px) {
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."],
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."],
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > img {
max-height: 75vh !important;
}
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."],
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."],
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."],
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > img,
main#postshow-a .infinite-scroll-post .si-hero-media-container [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > picture > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > a > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full.is-portrait-media > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio: 0."] > img,
main#postshow-a .infinite-scroll-post.si-23-visual-inspired [id^="arcs-single-filter"].si-23-visual-media .full-full[style*="--aspect-ratio:0."] > img {
max-height: 72vh !important;
}
}
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable {
--hd-content-max-width-active: var(--hd-content-max-width-mobile, var(--hd-content-max-width-tablet, var(--hd-content-max-width, 1000px)));
--hd-featured-image-max-width-active: var(--hd-featured-image-max-width-mobile, var(--hd-featured-image-max-width-tablet, var(--hd-featured-image-max-width, 1000px)));
--hd-title-max-width-active: var(--hd-title-max-width-mobile, var(--hd-title-max-width-tablet, var(--hd-title-max-width, 1000px)));
--hd-meta-max-width-active: var(--hd-meta-max-width-mobile, var(--hd-meta-max-width-tablet, var(--hd-meta-max-width, 1000px)));
--hd-breadcrumb-max-width-active: var(--hd-breadcrumb-max-width-mobile, var(--hd-breadcrumb-max-width-tablet, var(--hd-breadcrumb-max-width, 1000px)));
--hd-title-font-size-active: var(--hd-title-font-size-mobile, var(--hd-title-font-size-tablet, var(--hd-title-font-size, inherit)));
--fc-content-width: var(--hd-content-max-width-active);
}
}



main#postshow-a .infinite-scroll-post.hd-layout-customizable {
--hd-effective-main-width: min(var(--hd-content-max-width-active, 1000px), 100%);
--hd-ab-auto-main-width: min(calc(var(--hd-ab-container-width, 1280px) - var(--hd-sidebar-width, 280px) - var(--hd-sidebar-gap, 0px)), 100%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab.hd-aw-auto:not(.hd-cw-fullwidth) {
/* A 欄自動：以 AB 總寬扣除 B 欄與欄距，避免被 content_max_width(800) 鎖死。 */
--hd-effective-main-width: var(--hd-ab-auto-main-width);
--hd-content-max-width-active: var(--hd-ab-auto-main-width);
--hd-featured-image-max-width-active: var(--hd-ab-auto-main-width);
--hd-title-max-width-active: var(--hd-ab-auto-main-width);
--hd-meta-max-width-active: var(--hd-ab-auto-main-width);
--hd-breadcrumb-max-width-active: var(--hd-ab-auto-main-width);
/* Note: --fc-content-width is already set to var(--hd-content-max-width-active) in line 996,
   so it will automatically use the correct value set above. Do not override here. */
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto):not(.hd-cw-fullwidth) {
--hd-effective-main-width: min(var(--hd-main-column-width, 1000px), 100%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-full:not(.hd-cw-fullwidth) {
--hd-effective-main-width: min(var(--hd-content-max-width-active, 1000px), 100%);
}

/* Layout 3 in infinite scroll: keep full/ab structure aligned with single-3. */
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout {
width: 100%;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-full .main-layout-wrapper.si-3-main-layout {
max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-full.hd-cw-fullwidth .main-layout-wrapper.si-3-main-layout {
max-width: 100%;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-full .main-layout-wrapper.si-3-main-layout > #postshow-b {
display: none;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-full .main-layout-wrapper.si-3-main-layout > #content-main {
flex: 1 1 100%;
width: 100%;
max-width: none;
padding-left: 0;
padding-right: 0;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout {
display: flex;
align-items: flex-start;
max-width: min(var(--hd-ab-container-width, 1600px), 100%);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-cw-fullwidth .main-layout-wrapper.si-3-main-layout {
max-width: 100%;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout > #content-main {
flex: 1 1 0%;
min-width: 0;
width: auto;
max-width: none;
padding-left: 0;
padding-right: 0;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab:not(.hd-aw-auto):not(.hd-cw-fullwidth) .main-layout-wrapper.si-3-main-layout > #content-main {
flex: 0 1 var(--hd-main-column-width, 1000px);
width: var(--hd-main-column-width, 1000px);
max-width: var(--hd-main-column-width, 1000px);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout > #postshow-b {
flex: 0 0 var(--hd-sidebar-width, 280px);
width: var(--hd-sidebar-width, 280px);
margin-left: var(--hd-sidebar-gap, 0px);
display: block;
}

@media (min-width: 1200px) {
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvd-hide .main-layout-wrapper.si-3-main-layout > #postshow-b {
display: none !important;
}
}

@media (min-width: 769px) and (max-width: 1199px) {
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvt-hide .main-layout-wrapper.si-3-main-layout > #postshow-b {
display: none !important;
}
}

@media (min-width: 769px) and (max-width: 1180px) {
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--hd-section-gap, 16px);
max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 32px));
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout > #content-main {
flex: none;
width: 100%;
max-width: none;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvt-show .main-layout-wrapper.si-3-main-layout > #postshow-b {
display: block !important;
flex: none;
width: 100%;
max-width: min(var(--hd-sidebar-width, 280px), 100%);
margin: 0 auto;
}
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout {
display: block;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab .main-layout-wrapper.si-3-main-layout > #postshow-b {
width: 100%;
margin-left: 0;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvm-hide .main-layout-wrapper.si-3-main-layout > #postshow-b {
display: none !important;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab.hd-bvm-show .main-layout-wrapper.si-3-main-layout > #postshow-b {
display: block !important;
}
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .entry-header {
width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .entry-content {
max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main #post-wrapper [id^="post-"] .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main #post-wrapper [id^="post-"] .social-share-wrapper,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main #post-wrapper [id^="post-"] .post-navigation,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main #post-wrapper [id^="post-"] .author-box-container {
width: min(var(--hd-content-max-width-active, 1000px), 100%);
max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
position: relative;
left: auto;
transform: none;
margin: 0 auto var(--hd-section-gap, 16px);
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .entry-header {
width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .entry-content {
max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .post-navigation,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .author-box-container,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .alm-section-wrapper {
width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
max-width: none;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
}
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"],
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero {
max-width: var(--hd-effective-main-width);
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"],
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth .si-26-top-hero {
max-width: none;
width: 100%;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .entry-header .entry-title,
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .entry-header .entry-title,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 .si-title-top {
font-size: var(--hd-title-font-size-active, inherit);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .entry-content {
max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .author-box-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .author-box-container {
width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
max-width: none;
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .alm-section-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .alm-section-wrapper {
width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
max-width: none;
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .entry-content {
max-width: none;
width: 100%;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .author-box-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a > .author-box-container {
max-width: none;
width: 100%;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .alm-section-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-cw-fullwidth #postshow-a > .alm-section-wrapper {
max-width: none;
width: 100%;
}
main#postshow-a .infinite-scroll-post.hd-layout-customizable #breadcrumb {
    width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    /* max-width: none; */
    margin-left: auto;
    margin-right: auto;
    text-align: justify;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), 100%);
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
max-width: none;
}

/* Featured image width should work in both default and title-below orders. */
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > .landscape-side-by-side__captions {
width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
max-width: 100%;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] {
display: flex;
flex-direction: column;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > * {
order: 100;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .entry-header {
order: 10;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side {
order: 20;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions {
order: 21;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .si-single-top {
order: 30;
margin-top: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > #si-single-content {
order: 40;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

/* Visual order map: breadcrumb / title / meta / image (4 items draggable in backend). */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-1-breadcrumb { --hd-order-breadcrumb: 10; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-2-breadcrumb { --hd-order-breadcrumb: 20; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-3-breadcrumb { --hd-order-breadcrumb: 30; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-4-breadcrumb { --hd-order-breadcrumb: 40; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-1-title { --hd-order-title: 10; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-2-title { --hd-order-title: 20; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-3-title { --hd-order-title: 30; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-4-title { --hd-order-title: 40; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-1-meta { --hd-order-meta: 10; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-2-meta { --hd-order-meta: 20; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-3-meta { --hd-order-meta: 30; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-4-meta { --hd-order-meta: 40; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-1-image { --hd-order-image: 10; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-2-image { --hd-order-image: 20; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-3-image { --hd-order-image: 30; }
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lo-4-image { --hd-order-image: 40; }

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom {
display: flex;
flex-direction: column;
}

/* Prevent unassigned direct children (sentinels/divider/ads) from jumping before/after intended slots. */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > * {
order: 100;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > .scroll-sentinel-top {
order: 1;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > .infinite-scroll-divider {
order: 2;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > .ad-container-top {
order: 3;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > #breadcrumb {
order: var(--hd-order-breadcrumb, 10);
}

/* layout 2-6 keeps hero/meta blocks outside #post-*: pin hero before content wrapper. */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom.si-26-split-inspired > .si-26-top-hero {
order: 20;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > [id^="post-"] {
order: 20;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom.si-26-split-inspired > [id^="post-"] {
order: 30;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom > .main-layout-wrapper.si-3-main-layout {
order: 20;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom > .scroll-sentinel-bottom {
order: 999;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main {
display: flex;
flex-direction: column;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #breadcrumb {
order: var(--hd-order-breadcrumb, 10);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper {
order: 20;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] {
display: flex;
flex-direction: column;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > * {
order: 100;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .entry-header {
order: var(--hd-order-title, 10);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .si-single-top {
order: var(--hd-order-meta, 20);
margin-top: 0;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .post-thumbnail {
order: var(--hd-order-image, 30);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .landscape-side-by-side__captions {
order: calc(var(--hd-order-image, 30) + 1);
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-layout-order-custom .main-layout-wrapper.si-3-main-layout > #content-main > #post-wrapper > [id^="post-"] > .entry-content {
order: 40;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] {
display: flex;
flex-direction: column;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > * {
order: 100;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > .entry-header {
order: var(--hd-order-title, 10);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > #breadcrumb {
order: var(--hd-order-breadcrumb, 10);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > .si-single-top {
order: var(--hd-order-meta, 20);
margin-top: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail {
order: var(--hd-order-image, 30);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions {
order: calc(var(--hd-order-image, 30) + 1);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-custom:not(.si-26-split-inspired) > [id^="post-"] > .entry-content {
order: 40;
}

/* layout 2-6 uses top hero grid; provide explicit order variant */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid {
grid-template-columns: minmax(0, 1fr);
grid-template-areas:
"header"
"media"
"meta";
row-gap: 12px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid > .landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-single-top .si-single-top-a {
gap: var(--hd-field-gap, 10px);
}

/* Remove margin-bottom from all byline elements */
/* Use gap for spacing within si-single-top-a container */
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-single-top .byline {
margin-bottom: 0;
}

/* Only add margin-bottom to direct children of si-single-top (like si-time) */
/* to create spacing between si-time and si-single-top-a */
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-single-top > .byline {
margin-bottom: var(--hd-field-gap, 10px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-card .si-single-top {
background: #f7f9fc;
border: 1px solid #d4dce7;
border-left: 0;
border-radius: 10px;
padding: 12px 16px;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-card .si-single-top .byline {
padding: 6px 0;
margin-bottom: 2px;
border-bottom: 1px dashed #d9dfeb;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-card .si-single-top .si-single-top-a > .byline:last-child {
border-bottom: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-minimal .si-single-top {
border-left: 0;
padding-left: 0;
padding-top: 0;
padding-bottom: 0;
margin-top: 8px;
margin-bottom: 18px;
font-size: 0.95rem;
color: #555;
line-height: 1.45;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-inline .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--hd-field-gap, 10px) 14px;
border-left: 0;
padding: 0;
margin-top: 8px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-inline .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: var(--hd-field-gap, 10px) 14px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-inline .si-single-top .byline {
margin: 0;
padding: 0;
border-bottom: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
column-gap: 0;
border-left: 0;
padding: 0;
margin-top: 8px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
column-gap: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .byline {
display: inline-flex;
align-items: center;
margin: 0;
padding: 0;
border-bottom: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .byline + .byline::before {
content: "•";
margin: 0 10px;
color: #8b95a4;
font-size: 11px;
line-height: 1;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top > .byline + .si-single-top-a::before {
content: "•";
margin: 0 10px;
color: #8b95a4;
font-size: 11px;
line-height: 1;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 4px;
column-gap: 0;
border-left: 0;
padding: 0;
margin-top: 8px;
font-size: 0.93rem;
line-height: 1.35;
color: #4a5566;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 4px;
column-gap: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline {
display: inline-flex;
align-items: center;
margin: 0;
padding: 0;
border-bottom: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline > i {
display: none;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline + .byline::before {
content: "·";
margin: 0 8px;
color: #9aa3b2;
font-size: 12px;
line-height: 1;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top > .byline + .si-single-top-a::before {
content: "·";
margin: 0 8px;
color: #9aa3b2;
font-size: 12px;
line-height: 1;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
border-left: 0;
padding: 0;
margin-top: 8px;
background: transparent;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top > .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .byline {
display: inline-flex;
align-items: center;
margin: 0;
padding: 4px 10px;
border: 1px solid #dbe4f0;
border-radius: 999px;
background: #f5f8fc;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
column-gap: 0;
border: 1px solid #d9e0ea;
border-radius: 8px;
padding: 6px 10px;
margin-top: 8px;
background: #fff;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
column-gap: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline {
display: inline-flex;
align-items: center;
margin: 0;
padding: 2px 10px 2px 0;
border-bottom: 0;
position: relative;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline + .byline {
padding-left: 10px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline + .byline::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 1px;
height: 14px;
background: #d7dee9;
transform: translateY(-50%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top > .byline + .si-single-top-a {
display: inline-flex;
align-items: center;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top > .byline + .si-single-top-a::before {
content: "";
width: 1px;
height: 14px;
background: #d7dee9;
margin: 0 10px 0 0;
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top {
padding: 6px 8px;
row-gap: 4px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline + .byline::before,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top > .byline + .si-single-top-a::before {
display: none;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline {
padding: 2px 8px 2px 0;
}
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
column-gap: 0;
border-top: 1px solid #d9e0ea;
border-bottom: 1px solid #d9e0ea;
border-left: 0;
border-right: 0;
border-radius: 0;
padding: 12px 0;
margin-top: 16px;
background: transparent;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
column-gap: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline {
display: inline-flex;
align-items: center;
margin: 0;
padding: 2px 10px 2px 0;
border-bottom: 0;
position: relative;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline + .byline {
padding-left: 10px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline + .byline::before {
content: "";
position: absolute;
left: 0;
top: 50%;
width: 1px;
height: 14px;
background: #d7dee9;
transform: translateY(-50%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top > .byline + .si-single-top-a {
display: inline-flex;
align-items: center;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top > .byline + .si-single-top-a::before {
content: "";
width: 1px;
height: 14px;
background: #d7dee9;
margin: 0 10px 0 0;
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top {
padding: 6px 8px;
row-gap: 4px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline + .byline::before,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top > .byline + .si-single-top-a::before {
display: none;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline {
padding: 2px 8px 2px 0;
}
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
border-left: 0;
padding: 0;
background: transparent;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top > .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a {
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 8px;
margin: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a {
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .byline {
display: inline-flex;
align-items: center;
margin: 0;
padding: 6px 12px;
border: 1px solid #d7deea;
border-radius: 999px;
background: #fff;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a > .byline:last-child {
margin: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-divider .si-single-top {
border-left: 0;
padding: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-divider .si-single-top .si-single-top-a {
display: block;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-divider .si-single-top .byline {
margin: 0;
padding: 8px 0;
border-bottom: 1px solid #eceff4;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-divider .si-single-top .byline:last-child {
border-bottom: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-minimal .si-single-top .byline > i {
display: none;
}

/* single-3：標題下方大圖模式（全站預設/單篇覆寫共用） */
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] {
display: flex;
flex-direction: column;
}

/* single-3：可調整寬度（標題 / 作者資訊 / 麵包屑） */
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout #breadcrumb {
    width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-layout > [id^="post-"] > .entry-header {
    width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-layout > [id^="post-"] > .si-single-top {
    width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
}

/* Keep unspecified direct children after the main reordered blocks.
   Without this, default order:0 elements can jump above the title. */
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > * {
order: 100;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .entry-header {
order: 10;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .modern-landscape-side-by-side {
order: 20;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .landscape-side-by-side__captions {
order: 21;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .si-single-top {
order: 30;
margin-top: 0;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > #si-single-content {
order: 40;
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .landscape-side-by-side__captions {
    width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
    max-width: none;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: var(--hd-section-gap, 16px);
}

/* AB 欄位下，圖區寬度不得超過 A 欄，避免 vw 規則造成視覺偏移。 */
@media (min-width: 769px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #breadcrumb,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) .si-26-top-hero__grid > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .si-title-top {
width: min(var(--hd-title-max-width-active, 1000px), 100%);
max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) .si-26-top-hero__grid > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), 100%);
max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .post-thumbnail,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #post-wrapper #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #postshow-a #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #post-wrapper .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #postshow-a .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #post-wrapper .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #postshow-a .landscape-side-by-side__captions {
width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
position: relative;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .entry-content {
max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > #si-single-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-cw-fullwidth > [id^="post-"] > .entry-content {
max-width: none;
width: 100%;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .author-box-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .author-box-container {
width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
max-width: none;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .alm-section-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .alm-section-wrapper {
width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
max-width: none;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable #breadcrumb,
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout #breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .entry-header,
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout > [id^="post-"] > .entry-header {
width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .si-single-top,
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout > [id^="post-"] > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-order-title-below:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
margin-bottom: var(--hd-section-gap, 16px);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6.hd-layout-order-title-below .si-26-top-hero__grid > .landscape-side-by-side__captions {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > .landscape-side-by-side__captions {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
}

main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .landscape-side-by-side__captions {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
margin-bottom: var(--hd-section-gap, 16px);
}
}

/* Canonical desktop centering for infinite-scroll injected posts.
   Legacy rules above include left/translate centering and can conflict by order. */
@media (min-width: 769px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable #breadcrumb,
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout #breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .entry-header,
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout > [id^="post-"] > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .si-title-top {
width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable > [id^="post-"] > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-26-top-hero__grid > .si-single-top,
main#postshow-a .infinite-scroll-post.layout-3.si-3-layout > [id^="post-"] > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.si-3-featured-title-below > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-2-6 .si-26-top-hero__grid > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4 #postshow-a > .post-thumbnail {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
position: relative;
left: auto;
transform: none;
margin: 0 auto var(--hd-section-gap, 16px);
}

/* AB mode: clamp all major blocks to A column width to avoid drift/overflow. */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) #breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) .si-26-top-hero__grid > .entry-header,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .si-title-top {
width: min(var(--hd-title-max-width-active, 1000px), 100%);
max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) .si-26-top-hero__grid > .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), 100%);
max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .author-box-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3) > [id^="post-"] > .alm-section-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .post-navigation,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .author-box-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .hd-related-posts-container,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .alm-section-wrapper {
width: min(var(--hd-content-max-width-active, 1000px), 100%);
max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab:not(.hd-layout-key-3):not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > #arcs-single-filter,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-lm-ab #postshow-a > .post-thumbnail {
width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
}
}

/* ========================================================================= */
/* WordPress Block Layout Fallback for Infinite Scroll
/* WordPress 動態生成的 wp-container-* 樣式在 AJAX 載入時可能缺失
/* ========================================================================= */

/* Flex Layout 基礎樣式 */
.infinite-scroll-post .wp-block-group.is-layout-flex,
.infinite-scroll-post .wp-block-columns.is-layout-flex {
display: flex;
gap: var(--wp--style--block-gap, 1.5rem);
}

/* Flex Nowrap */
.infinite-scroll-post .wp-block-group.is-layout-flex.is-nowrap {
flex-wrap: nowrap;
}

/* 垂直對齊 */
.infinite-scroll-post .wp-block-group.is-layout-flex.is-vertical {
flex-direction: column;
}

/* 水平對齊 */
.infinite-scroll-post .wp-block-group.is-layout-flex.is-content-justification-center {
justify-content: center;
}

.infinite-scroll-post .wp-block-group.is-layout-flex.is-content-justification-space-between {
justify-content: space-between;
}

/* Flex 子項目自動縮放 */
.infinite-scroll-post .wp-block-group.is-layout-flex > * {
margin: 0;
}

/* Grid Layout 基礎樣式 */
.infinite-scroll-post .wp-block-group.is-layout-grid {
display: grid;
gap: var(--wp--style--block-gap, 1.5rem);
}

/* 響應式：小螢幕時 Flex 轉為垂直排列 */
@media (max-width: 600px) {
.infinite-scroll-post .wp-block-group.is-layout-flex:not(.is-nowrap) {
flex-wrap: wrap;
}
}

/* ========================================================================= */
/* 分隔線樣式變體 (5 種選擇)
/* ========================================================================= */

/* 樣式 1: 經典 (Classic) - 預設樣式，已在上方定義 */
/* .infinite-scroll-divider 使用原本樣式 */

/* 樣式 2: 淡化 (Fade) - 淡灰色漸層線 */
.divider-style-fade .infinite-scroll-divider::before {
background: linear-gradient(to right, transparent, rgba(0,0,0,0.05) 30%, rgba(0,0,0,0.05) 70%, transparent);
height: 2px;
}
.divider-style-fade .infinite-scroll-divider .divider-text {
background: transparent;
border: none;
color: #ccc;
font-size: 12px;
letter-spacing: 2px;
}

/* 樣式 3: 極簡 (Minimal) - 只有細線，無文字 */
.divider-style-minimal .infinite-scroll-divider {
margin: 60px 0 40px;
}
.divider-style-minimal .infinite-scroll-divider::before {
background: #eee;
height: 1px;
}
.divider-style-minimal .infinite-scroll-divider .divider-text {
display: none;
}

/* 樣式 4: 現代 (Modern) - 圓角標籤風格 */
.divider-style-modern .infinite-scroll-divider {
margin: 70px 0 50px;
}
.divider-style-modern .infinite-scroll-divider::before {
display: none;
}
.divider-style-modern .infinite-scroll-divider .divider-text {
padding: 12px 30px;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: #fff;
font-size: 12px;
font-weight: 600;
letter-spacing: 1px;
border: none;
border-radius: 25px;
box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.divider-style-modern .infinite-scroll-divider .divider-text:hover {
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
}

/* 樣式 5: 隱藏 (Hidden) - 完全不顯示 */
.divider-style-hidden .infinite-scroll-divider {
display: none !important;
}

/* Dark Mode 支援各樣式 */
@media (prefers-color-scheme: dark) {
.divider-style-fade .infinite-scroll-divider::before {
background: linear-gradient(to right, transparent, rgba(255,255,255,0.1) 30%, rgba(255,255,255,0.1) 70%, transparent);
}
.divider-style-fade .infinite-scroll-divider .divider-text {
color: #666;
}

.divider-style-minimal .infinite-scroll-divider::before {
background: #333;
}
}

/* ========================================================================= */
/* 新增載入器樣式 (Spinner, Progress, Dots, Wave)
/* ========================================================================= */

/* 載入器容器基礎樣式 */
.infinite-scroll-loader-container {
display: flex;
justify-content: center;
align-items: center;
padding: 60px 20px;
min-height: 120px;
}

/* ========================================================================= */
/* Spinner 載入器
/* ========================================================================= */

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

.loader-spinner {
border-radius: 50%;
border-style: solid;
animation: spin 0.8s linear infinite;
}

/* Spinner 大小變體 */
.loader-spinner.size-small {
width: 30px;
height: 30px;
border-width: 3px;
}

.loader-spinner.size-medium {
width: 45px;
height: 45px;
border-width: 4px;
}

.loader-spinner.size-large {
width: 60px;
height: 60px;
border-width: 5px;
}

/* ========================================================================= */
/* Progress Bar 載入器
/* ========================================================================= */

@keyframes progress-indeterminate {
0% {
left: -40%;
width: 40%;
}
100% {
left: 100%;
width: 40%;
}
}

.loader-progress {
width: 100%;
max-width: 300px;
overflow: hidden;
border-radius: 10px;
background: rgba(0, 0, 0, 0.1);
}

.loader-progress-bar {
height: 100%;
position: relative;
animation: progress-indeterminate 1.5s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
}

/* Progress Bar 大小變體 */
.loader-progress.size-small {
height: 4px;
max-width: 200px;
}

.loader-progress.size-medium {
height: 6px;
max-width: 300px;
}

.loader-progress.size-large {
height: 8px;
max-width: 400px;
}

/* ========================================================================= */
/* Dots 載入器
/* ========================================================================= */

@keyframes dot-pulse {
0%, 80%, 100% {
transform: scale(0.8);
opacity: 0.5;
}
40% {
transform: scale(1.2);
opacity: 1;
}
}

.loader-dots {
display: flex;
gap: 12px;
align-items: center;
}

.loader-dots .dot {
border-radius: 50%;
animation: dot-pulse 1.4s ease-in-out infinite;
}

.loader-dots .dot:nth-child(1) {
animation-delay: 0s;
}

.loader-dots .dot:nth-child(2) {
animation-delay: 0.2s;
}

.loader-dots .dot:nth-child(3) {
animation-delay: 0.4s;
}

/* Dots 大小變體 */
.loader-dots.size-small .dot {
width: 8px;
height: 8px;
}

.loader-dots.size-medium .dot {
width: 12px;
height: 12px;
}

.loader-dots.size-large .dot {
width: 16px;
height: 16px;
}

/* ========================================================================= */
/* Wave 載入器
/* ========================================================================= */

@keyframes wave {
0%, 40%, 100% {
transform: scaleY(0.4);
}
20% {
transform: scaleY(1);
}
}

.loader-wave {
display: flex;
gap: 6px;
align-items: center;
}

.loader-wave .bar {
width: 4px;
border-radius: 2px;
animation: wave 1.2s ease-in-out infinite;
}

.loader-wave .bar:nth-child(1) {
animation-delay: 0s;
}

.loader-wave .bar:nth-child(2) {
animation-delay: 0.1s;
}

.loader-wave .bar:nth-child(3) {
animation-delay: 0.2s;
}

.loader-wave .bar:nth-child(4) {
animation-delay: 0.3s;
}

.loader-wave .bar:nth-child(5) {
animation-delay: 0.4s;
}

/* Wave 大小變體 */
.loader-wave.size-small .bar {
height: 30px;
width: 3px;
}

.loader-wave.size-medium .bar {
height: 45px;
width: 4px;
}

.loader-wave.size-large .bar {
height: 60px;
width: 5px;
}

/* ========================================================================= */
/* Custom HTML 載入器
/* ========================================================================= */

/* 自訂 HTML 載入器不需要預設樣式，所有樣式由用戶在自訂 HTML 中定義 */

/* ========================================================================= */
/* Dark Mode 支援
/* ========================================================================= */

@media (prefers-color-scheme: dark) {
.loader-progress {
background: rgba(255, 255, 255, 0.1);
}

.infinite-scroll-loader-container {
color: #e2e8f0;
}
}

/* ========================================================================= */
/* 響應式設計
/* ========================================================================= */

@media (max-width: 600px) {
.infinite-scroll-loader-container {
padding: 40px 15px;
min-height: 100px;
}

.loader-progress.size-large {
max-width: 300px;
}

.loader-spinner.size-large {
width: 50px;
height: 50px;
border-width: 4px;
}

.loader-wave.size-large .bar {
height: 50px;
}
}

/* ========================================================================= */
/* 閱讀進度恢復提示
/* ========================================================================= */

.reading-progress-prompt {
position: fixed;
bottom: 20px;
left: 50%;
transform: translateX(-50%) translateY(100px);
z-index: 10000;
opacity: 0;
transition: transform 0.3s ease, opacity 0.3s ease;
pointer-events: none;
}

.reading-progress-prompt.visible {
transform: translateX(-50%) translateY(0);
opacity: 1;
pointer-events: auto;
}

.reading-progress-content {
display: flex;
align-items: center;
gap: 12px;
padding: 14px 20px;
background: linear-gradient(135deg, #2d3748 0%, #1a202c 100%);
color: #fff;
border-radius: 12px;
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
font-size: 14px;
}

.reading-progress-icon {
font-size: 20px;
}

.reading-progress-text {
font-weight: 500;
}

.reading-progress-btn {
border: none;
background: transparent;
cursor: pointer;
font-size: 14px;
padding: 6px 14px;
border-radius: 6px;
transition: all 0.2s ease;
}

.reading-progress-btn.resume {
background: linear-gradient(135deg, #4ade80 0%, #22c55e 100%);
color: #fff;
font-weight: 600;
}

.reading-progress-btn.resume:hover {
background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%);
transform: scale(1.05);
}

.reading-progress-btn.dismiss {
color: #a0a0a0;
font-size: 18px;
padding: 4px 8px;
}

.reading-progress-btn.dismiss:hover {
color: #fff;
background: rgba(255, 255, 255, 0.1);
}

/* 響應式：手機版 */
@media (max-width: 600px) {
.reading-progress-prompt {
left: 10px;
right: 10px;
transform: translateX(0) translateY(100px);
}

.reading-progress-prompt.visible {
transform: translateX(0) translateY(0);
}

.reading-progress-content {
padding: 12px 16px;
gap: 10px;
font-size: 13px;
}

.reading-progress-icon {
font-size: 18px;
}
}

/* Infinite Scroll: Single Display Visibility Classes */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-breadcrumb-off #breadcrumb {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-meta-info-off .si-single-top {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-date-off .si-single-top .si-time {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-author,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-editors,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-photographer,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-author-off .si-single-top .si-source {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-category-off .si-single-top .si-category {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-reading-time-off .si-single-top .si-read-time {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-display-show-views-off .si-single-top .si-views {
display: none !important;
}

/* Meta styles baseline quality: keep content aligned and prevent overflow. */
main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-single-top .byline {
max-width: 100%;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable .si-single-top .meta-content {
max-width: 100%;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-card .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-minimal .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-divider .si-single-top .meta-content {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
gap: 4px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-card .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-minimal .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-divider .si-single-top .si-category .meta-content > span:last-child {
max-width: 100%;
overflow-wrap: anywhere;
}

/* Horizontal meta styles: keep one row whenever possible, wrap only when insufficient space. */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top {
display: flex;
flex-wrap: wrap;
align-items: center;
row-gap: 6px;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-single-top-a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-single-top-a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-single-top-a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-single-top-a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-single-top-a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-single-top-a {
display: inline-flex;
flex-wrap: wrap;
align-items: center;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .byline,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .byline {
display: inline-flex;
align-items: center;
flex: 0 1 auto;
max-width: 100%;
margin: 0;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .meta-content,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .meta-content {
display: inline-flex;
align-items: center;
gap: 4px;
max-width: 100%;
min-width: 0;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .meta-content > span,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .meta-content > span,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .meta-content > span,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .meta-content > span,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .meta-content > span,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .meta-content > span,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .meta-content > a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .meta-content > a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .meta-content > a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .meta-content > a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .meta-content > a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .meta-content > a,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top time,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top time,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top time,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top time,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top time,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top time {
white-space: nowrap;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-author .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-author .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-compact .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-author .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-soft .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-author .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-author .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-horizontal-segmented-borders .si-single-top .si-category .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-author .meta-content > span:last-child,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-meta-style-chips .si-single-top .si-category .meta-content > span:last-child {
display: inline-block;
max-width: 28ch;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}

/* AB 右欄強化樣式（infinite scroll 注入文章）。 */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab.hd-sws-card #postshow-b > * {
background: #fff;
border: 1px solid #dfe5ee;
border-radius: 14px;
box-shadow: 0 10px 24px rgba(19, 35, 62, 0.08);
padding: 12px;
margin-bottom: 14px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab.hd-sws-soft #postshow-b > * {
background: linear-gradient(180deg, #f7f9fc 0%, #f1f4f9 100%);
border: 1px solid #e7ebf2;
border-radius: 12px;
padding: 10px 12px;
margin-bottom: 12px;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab.hd-sws-card #postshow-b .sidebar-title,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-lm-ab.hd-sws-soft #postshow-b .sidebar-title {
margin: 0 0 10px;
font-weight: 700;
}

/* 分享按鈕模式：偏內嵌時隱藏浮動軌；偏浮動時隱藏內嵌區塊。 */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-inline .isb-share-container.isb-float-left,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-inline .isb-share-container.isb-float-right {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .social-share-wrapper {
display: none !important;
}

@media (min-width: 769px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-left,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-right {
display: block !important;
}
}

@media (max-width: 768px) {
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-left,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .isb-share-container.isb-float-right {
display: none !important;
}

main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-layout-key-4.hd-share-float #postshow-a > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-share-float .social-share-wrapper {
display: block !important;
}
}

/* 無限捲動相容：移除空白廣告容器，避免上方出現空段落。 */
main#postshow-a .infinite-scroll-post.hd-layout-customizable.hd-inf-stable .ad-container-top:empty {
display: none !important;
}

/* Instance-safe fragment IDs keep infinite-scroll articles from duplicating legacy single IDs. */
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .theme-breadcrumb {
width: min(var(--hd-breadcrumb-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-breadcrumb-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper > [id^="post-"] > .entry-header {
width: min(var(--hd-title-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-title-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper > [id^="post-"] > .si-single-top {
width: min(var(--hd-meta-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-meta-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper > [id^="post-"] > .si-single-content,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper > [id^="post-"] > .entry-content {
max-width: min(var(--hd-content-max-width-active, 1000px), calc(100vw - 24px));
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper > [id^="post-"] > .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper > [id^="post-"] > .social-share-wrapper,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main .post-wrapper [id^="post-"] .isb-container.isb-share-container:not(.isb-float-left):not(.isb-float-right),
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main .post-wrapper [id^="post-"] .social-share-wrapper,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main .post-wrapper [id^="post-"] .post-navigation,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout #content-main .post-wrapper [id^="post-"] .author-box-container {
width: min(var(--hd-content-max-width-active, 1000px), 100%);
max-width: min(var(--hd-content-max-width-active, 1000px), 100%);
position: static;
left: auto;
transform: none;
margin-left: auto;
margin-right: auto;
}

main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .arcs-single-filter,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .modern-landscape-side-by-side,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .landscape-side-by-side__captions,
main#postshow-a .infinite-scroll-post.layout-3.hd-layout-customizable .main-layout-wrapper.si-3-main-layout > #content-main > .post-wrapper:not(.si-26-split-inspired) > [id^="post-"] > .post-thumbnail {
width: min(var(--hd-featured-image-max-width-active, 1000px), calc(100vw - 24px));
max-width: min(var(--hd-featured-image-max-width-active, 1000px), 100%);
position: relative;
left: auto;
transform: none;
margin: 0 auto var(--hd-section-gap, 16px);
}

/* 無限捲動狀態卡：只做外圍提示，不影響內容區塊本身。 */
.infinite-scroll-status-panel {
position: fixed;
right: 18px;
bottom: 92px;
z-index: 80;
display: flex;
flex-direction: column;
gap: 8px;
width: min(260px, calc(100vw - 32px));
padding: 12px 14px;
border: 1px solid rgba(15, 23, 42, 0.12);
border-radius: 16px;
background: rgba(255, 255, 255, 0.92);
backdrop-filter: blur(12px);
box-shadow: 0 18px 34px rgba(15, 23, 42, 0.14);
}

.infinite-scroll-status-summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
font-size: 13px;
line-height: 1.5;
}

.infinite-scroll-status-loaded {
color: #1f2937;
font-weight: 700;
}

.infinite-scroll-status-mode,
.infinite-scroll-status-current {
color: #5b6678;
font-size: 12px;
}

.infinite-scroll-status-bar {
overflow: hidden;
height: 6px;
margin-top: 10px;
border-radius: 999px;
background: rgba(15, 23, 42, 0.08);
}

.infinite-scroll-status-bar-fill {
display: block;
height: 100%;
width: 0;
border-radius: inherit;
background: linear-gradient(90deg, #2271b1 0%, #4aa3ff 100%);
transition: width 0.25s ease;
}

@media screen and (max-width: 782px) {
.infinite-scroll-status-panel {
right: 12px;
left: 12px;
bottom: 78px;
width: auto;
}
}