:root{--detail-ink:#251c17;--detail-red:#8e342b;--detail-gold:#b88a42;--detail-paper:#f3ecdd}.detail-main{margin-top:70px;background:var(--detail-paper);color:var(--detail-ink)}.detail-hero{position:relative;height:min(78vh,760px);min-height:520px;overflow:hidden;background:#211713}.detail-hero>img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.8,.2,1),filter .6s}.detail-hero:hover>img{transform:scale(1.035);filter:saturate(1.08)}.detail-hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(22,13,9,.76),rgba(22,13,9,.17) 58%,rgba(22,13,9,.08)),linear-gradient(0deg,rgba(22,13,9,.55),transparent 48%)}.detail-overlay{position:absolute;left:max(5vw,36px);bottom:clamp(50px,9vw,120px);width:min(720px,80vw);color:#fff}.detail-source,.detail-kicker{margin:0 0 12px;color:var(--detail-red);font-weight:800;letter-spacing:.13em;text-transform:uppercase}.detail-overlay .detail-source{color:#e6bf70}.detail-overlay h1{margin:0;font-family:"STKaiti","KaiTi",serif;font-size:clamp(40px,6vw,82px);font-weight:500;line-height:1.1;text-shadow:0 8px 30px rgba(0,0,0,.35)}.detail-lead{max-width:650px;margin:20px 0 0;color:rgba(255,255,255,.86);font-size:16px;line-height:1.9}.hero-zoom{margin-top:24px;padding:11px 17px;border:1px solid rgba(255,255,255,.45);border-radius:999px;background:rgba(255,255,255,.12);color:#fff;backdrop-filter:blur(8px);cursor:pointer}.detail-content{width:min(1120px,calc(100% - 42px));margin:auto;padding:42px 0 80px}.back-link{display:inline-flex;gap:8px;align-items:center;margin-bottom:42px;color:#704329;text-decoration:none;font-weight:700}.detail-intro{display:grid;grid-template-columns:minmax(260px,.78fr) minmax(0,1.22fr);gap:clamp(40px,8vw,110px);align-items:start;padding:30px 0 76px;border-bottom:1px solid rgba(123,73,39,.22)}.detail-intro h2,.section-heading h2,.detail-reading h2{margin:0;font-family:"STKaiti","KaiTi",serif;font-size:clamp(30px,4vw,52px);font-weight:500}.detail-description{padding:8px 0 8px 28px;border-left:1px solid rgba(142,52,43,.38)}.detail-description p,.detail-reading p{margin:0 0 18px;color:#554b43;font-size:16px;line-height:2}.detail-video-section,.detail-gallery,.detail-reading{padding:76px 0}.section-heading{display:grid;grid-template-columns:1fr auto;align-items:end;margin-bottom:28px}.section-heading .detail-kicker{grid-column:1/-1}.section-heading span{color:#88796c;font-size:13px}.detail-video{overflow:hidden;border-radius:3px 46px 3px 46px;background:#1e1713;box-shadow:0 28px 64px rgba(44,27,18,.18)}.detail-video video,.detail-video iframe{display:block;width:100%;height:min(62vw,660px);border:0;object-fit:cover}.gallery-shell{position:relative}.gallery-grid{display:grid;grid-auto-flow:column;grid-auto-columns:clamp(270px,42vw,520px);gap:22px;overflow-x:auto;padding:8px 4px 26px;scroll-snap-type:x mandatory;scrollbar-width:thin;touch-action:pan-x}.gallery-grid.dragging{cursor:grabbing;scroll-snap-type:none}.gallery-item{position:relative;margin:0;scroll-snap-align:start;overflow:hidden;background:#ded1bc;box-shadow:0 16px 38px rgba(54,33,21,.12)}.gallery-shape-0,.gallery-shape-3{height:520px}.gallery-shape-1{height:420px;margin-top:70px}.gallery-shape-2{height:470px;margin-top:20px}.gallery-shape-4{height:390px;margin-top:95px}.gallery-item img{width:100%;height:100%;object-fit:cover;cursor:zoom-in;transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .5s}.gallery-item:hover img{transform:scale(1.055);filter:saturate(1.12) contrast(1.03)}.gallery-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:42px 20px 18px;background:linear-gradient(transparent,rgba(22,14,10,.78));color:#fff;transform:translateY(12px);opacity:.2;transition:.35s}.gallery-item:hover figcaption{opacity:1;transform:none}.gallery-item figcaption span{margin-right:12px;color:#e6bc69;font-family:Georgia,serif}.gallery-nav{position:absolute;z-index:2;top:48%;width:46px;height:46px;border:0;border-radius:50%;background:rgba(38,25,18,.84);color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.18);cursor:pointer}.gallery-nav.prev{left:-22px}.gallery-nav.next{right:-22px}.detail-reading{display:grid;grid-template-columns:260px 1fr;gap:70px;border-top:1px solid rgba(123,73,39,.22)}.detail-reading .detail-kicker,.detail-reading h2{grid-column:1}.detail-reading #readingContent{grid-column:2;grid-row:1/4}.reading-paragraph:nth-child(2n){margin-left:7%;padding-left:24px;border-left:1px solid rgba(142,52,43,.28)}.detail-actions{display:flex;gap:12px;flex-wrap:wrap}.detail-actions a{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:#2b201a;color:#fff;text-decoration:none}.detail-actions a+a{background:var(--detail-red)}.image-viewer{position:fixed;inset:0;z-index:5000;display:none;grid-template-rows:auto 1fr auto;background:rgba(15,11,9,.96);color:#fff}.image-viewer.active{display:grid}.viewer-toolbar{display:flex;justify-content:space-between;gap:14px;padding:15px 22px;background:rgba(29,25,23,.86)}.viewer-toolbar button{padding:9px 13px;border:1px solid rgba(230,191,112,.35);border-radius:999px;background:rgba(255,255,255,.07);color:#fff;cursor:pointer}.viewer-tools{display:flex;gap:8px}.viewer-stage{position:relative;overflow:hidden;cursor:grab;touch-action:none}.viewer-stage img{position:absolute;top:50%;left:50%;max-width:min(90vw,1500px);max-height:calc(100vh - 150px);user-select:none;transform-origin:center;will-change:transform}.viewer-hint{margin:0;padding:12px;text-align:center;color:rgba(255,255,255,.7)}body.viewer-open{overflow:hidden}
@media(max-width:820px){.detail-hero{height:66vh;min-height:440px}.detail-intro,.detail-reading{grid-template-columns:1fr;gap:24px}.detail-reading .detail-kicker,.detail-reading h2,.detail-reading #readingContent{grid-column:1;grid-row:auto}.section-heading{display:block}.section-heading span{display:block;margin-top:8px}.gallery-grid{grid-auto-columns:78vw}.gallery-item,.gallery-shape-0,.gallery-shape-1,.gallery-shape-2,.gallery-shape-3,.gallery-shape-4{height:460px;margin-top:0}.gallery-nav{display:none}}
@media(max-width:560px){.detail-overlay{left:22px;bottom:38px;width:calc(100% - 44px)}.detail-content{width:calc(100% - 28px);padding-top:28px}.detail-intro,.detail-video-section,.detail-gallery,.detail-reading{padding:48px 0}.detail-description{padding-left:18px}.gallery-grid{grid-auto-columns:86vw;gap:14px}.gallery-item,.gallery-shape-0,.gallery-shape-1,.gallery-shape-2,.gallery-shape-3,.gallery-shape-4{height:390px}.viewer-toolbar{align-items:flex-start;flex-direction:column}.viewer-tools{width:100%;overflow-x:auto}}

/* Structured detail layout: main artwork first, supporting gallery and video below. */
.detail-hero-compact{height:280px;min-height:280px}.detail-hero-compact .detail-overlay{bottom:34px}.detail-hero-compact .detail-overlay h1{font-size:clamp(30px,4vw,54px)}.detail-hero-compact .detail-lead{display:none}.detail-intro{grid-template-columns:minmax(360px,1.05fr) minmax(320px,.95fr);gap:clamp(34px,6vw,82px);align-items:stretch;padding-top:18px}.detail-main-media{position:relative;min-height:560px;overflow:hidden;background:#d8cbb7;box-shadow:0 24px 60px rgba(49,30,19,.14)}.detail-main-media img{width:100%;height:100%;min-height:560px;object-fit:cover;cursor:zoom-in;transition:transform .7s ease}.detail-main-media:hover img{transform:scale(1.025)}.detail-main-media button{position:absolute;right:18px;bottom:18px;padding:10px 14px;border:0;border-radius:999px;background:rgba(31,22,17,.78);color:#fff;cursor:pointer}.detail-intro-copy{display:flex;flex-direction:column;justify-content:center}.detail-intro-copy h2{margin-bottom:24px}.detail-description{padding:0;border:0;background:none}.detail-description p{white-space:normal}.detail-gallery{padding-bottom:64px}.gallery-grid{grid-auto-columns:clamp(250px,29vw,350px);gap:18px}.gallery-item,.gallery-shape-0,.gallery-shape-1,.gallery-shape-2,.gallery-shape-3,.gallery-shape-4{height:280px;margin-top:0;border-radius:3px 24px 3px 24px}.gallery-item figcaption{opacity:.86;transform:none;padding-top:32px}.detail-video-section{padding-top:58px;border-top:1px solid rgba(123,73,39,.18)}body[data-detail-layout="media-right"] .detail-main-media{order:2}body[data-detail-layout="feature"] .detail-intro{grid-template-columns:1fr}body[data-detail-layout="feature"] .detail-main-media{min-height:620px}body[data-detail-layout="feature"] .detail-main-media img{min-height:620px}body[data-detail-layout="feature"] .detail-intro-copy{padding:16px min(8vw,90px) 0}.detail-reading{display:none}
@media(max-width:820px){.detail-hero-compact{height:230px;min-height:230px}.detail-intro{grid-template-columns:1fr}.detail-main-media,body[data-detail-layout="feature"] .detail-main-media{min-height:480px}.detail-main-media img,body[data-detail-layout="feature"] .detail-main-media img{min-height:480px}body[data-detail-layout="media-right"] .detail-main-media{order:0}.gallery-grid{grid-auto-columns:70vw}.gallery-item,.gallery-shape-0,.gallery-shape-1,.gallery-shape-2,.gallery-shape-3,.gallery-shape-4{height:270px}}
@media(max-width:560px){.detail-main-media,body[data-detail-layout="feature"] .detail-main-media{min-height:400px}.detail-main-media img,body[data-detail-layout="feature"] .detail-main-media img{min-height:400px}.gallery-grid{grid-auto-columns:82vw}.gallery-item,.gallery-shape-0,.gallery-shape-1,.gallery-shape-2,.gallery-shape-3,.gallery-shape-4{height:240px}}

/* Main image keeps its original ratio inside a consistent rectangular art frame. */
.detail-main-media{display:grid;place-items:center;padding:28px;min-height:560px;background:linear-gradient(145deg,#e8deca,#d9c9ad);box-shadow:0 24px 60px rgba(49,30,19,.14)}
.detail-main-image-frame{position:relative;display:grid;place-items:center;width:100%;height:100%;min-height:504px;padding:12px;border:1px solid rgba(174,126,47,.72);background:rgba(250,245,233,.5)}
.detail-main-image-frame::after{content:'';position:absolute;inset:6px;border:1px solid rgba(191,151,78,.34);pointer-events:none}
.detail-main-media .detail-main-image-frame img{display:block;width:auto;height:auto;max-width:100%;max-height:500px;min-height:0;object-fit:contain;cursor:zoom-in;transition:transform .55s ease,filter .4s ease}
.detail-main-media:hover .detail-main-image-frame img{transform:scale(1.018);filter:saturate(1.04)}
.detail-main-media button{right:40px;bottom:40px;display:inline-flex;align-items:center;gap:7px;opacity:0;transform:translateY(9px);transition:opacity .28s ease,transform .28s ease,background .28s ease}
.detail-main-media:hover button,.detail-main-media:focus-within button{opacity:1;transform:none}.detail-main-media button:hover{background:rgba(131,53,40,.92)}
body[data-detail-layout="feature"] .detail-main-image-frame{min-height:564px}body[data-detail-layout="feature"] .detail-main-media .detail-main-image-frame img{max-height:560px}
@media(max-width:820px){.detail-main-media{padding:20px}.detail-main-image-frame{min-height:438px}.detail-main-media .detail-main-image-frame img{max-height:434px}.detail-main-media button{right:32px;bottom:32px;opacity:.82;transform:none}}
@media(max-width:560px){.detail-main-media{padding:14px}.detail-main-image-frame{min-height:368px;padding:8px}.detail-main-media .detail-main-image-frame img{max-height:364px}.detail-main-media button{right:24px;bottom:24px;padding:8px 11px;font-size:12px}}

/* Supporting images use one clean rectangular presentation. */
.detail-gallery .gallery-item,
.detail-gallery .gallery-shape-0,
.detail-gallery .gallery-shape-1,
.detail-gallery .gallery-shape-2,
.detail-gallery .gallery-shape-3,
.detail-gallery .gallery-shape-4 {
    height: 280px;
    margin-top: 0;
    border: 1px solid rgba(177,132,57,.3);
    border-radius: 0;
    background: #e1d6c3;
}

.detail-gallery .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

@media(max-width:820px) {
    .detail-gallery .gallery-item { height: 270px; }
}

@media(max-width:560px) {
    .detail-gallery .gallery-item { height: 240px; }
}

/* Refined artwork presentation: no pale mat, with a gold line inside the image. */
.detail-main-media {
    display: grid;
    place-items: center;
    min-height: 0;
    padding: 0;
    overflow: visible;
    background: transparent;
}

.detail-main-image-frame {
    position: relative;
    display: block;
    width: 100%;
    min-height: 0;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: transparent;
}

.detail-main-image-frame::after {
    content: '';
    position: absolute;
    z-index: 2;
    inset: 10px;
    border: 1px solid rgba(215,174,91,.72);
    box-shadow: 0 0 0 1px rgba(69,42,23,.13);
    pointer-events: none;
}

.detail-main-media .detail-main-image-frame img {
    display: block;
    width: 100%;
    height: auto;
    max-width: none;
    max-height: 680px;
    min-height: 0;
    object-fit: cover;
}

.detail-main-media button {
    right: 22px;
    bottom: 22px;
    z-index: 3;
    opacity: 0;
    pointer-events: none;
}

.detail-main-media:hover button,
.detail-main-media:focus-within button {
    opacity: 1;
    transform: none;
}

/* Reading hierarchy for AI-assisted and long-form detail content. */
.detail-description .reading-paragraph { position: relative; margin-bottom: 1.35em; color: #554a43; font-family: "STSong", "SimSun", serif; font-size: 17px; line-height: 2.05; text-align: justify; }
.detail-description .reading-paragraph:first-child { color: #30251f; font-size: 19px; line-height: 1.95; }
.detail-description .reading-paragraph:first-child::first-letter { float: left; margin: 10px 10px 0 0; color: var(--detail-red); font-family: "STKaiti", "KaiTi", serif; font-size: 54px; line-height: .72; }
.detail-description .reading-paragraph:nth-child(3n+2) { padding-left: 22px; border-left: 2px solid rgba(142,52,43,.3); }
.detail-description .reading-paragraph:nth-child(3n) { padding: 15px 18px; background: rgba(184,138,66,.08); }
.detail-intro-copy h2 { color: var(--detail-title-color,var(--detail-ink)); font-size: var(--detail-title-size,clamp(30px,4vw,52px)); font-weight: var(--detail-title-weight,500); letter-spacing: var(--detail-title-spacing,0); text-align: var(--detail-title-align,left); }
.detail-content-subtitle { margin: -8px 0 22px; color: var(--detail-subtitle-color,var(--detail-red)); font-family: "STSong","SimSun",serif; font-size: var(--detail-subtitle-size,17px); font-weight: var(--detail-subtitle-weight,400); line-height: 1.75; text-align: var(--detail-subtitle-align,left); }
.detail-description .reading-paragraph { color: var(--detail-body-color,#554a43); font-size: var(--detail-body-size,17px); line-height: var(--detail-body-line,2.05); letter-spacing: var(--detail-body-spacing,0); }
.detail-title-decoration { display:block; margin:0 0 18px; }
.detail-title-decoration-line { width:var(--decor-width,48px); height:3px; background:linear-gradient(90deg,var(--decor-color,#a64b3b),rgba(184,138,66,.28)); }
.detail-title-decoration-seal { width:min(var(--decor-width,48px),70px); aspect-ratio:1; border:2px solid var(--decor-color,#a64b3b); opacity:.72; }
.detail-title-decoration-image { width:var(--decor-width,48px); max-height:110px; object-fit:contain; }
@media(max-width:560px){.detail-description .reading-paragraph{font-size:16px;text-align:left}.detail-description .reading-paragraph:first-child{font-size:17px}}

body[data-detail-layout="feature"] .detail-main-image-frame { min-height: 0; }
body[data-detail-layout="feature"] .detail-main-media .detail-main-image-frame img { max-height: 760px; }

.detail-gallery .gallery-item figcaption {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
}

.detail-gallery .gallery-shell::before,
.detail-gallery .gallery-shell::after {
    content: '';
    position: absolute;
    z-index: 2;
    top: 0;
    bottom: 22px;
    width: clamp(34px, 6vw, 78px);
    pointer-events: none;
}

.detail-gallery .gallery-shell::before {
    left: 0;
    background: linear-gradient(90deg, #f3ecdd 4%, rgba(243,236,221,.78) 38%, transparent);
}

.detail-gallery .gallery-shell::after {
    right: 0;
    background: linear-gradient(270deg, #f3ecdd 4%, rgba(243,236,221,.78) 38%, transparent);
}

.detail-gallery .gallery-nav {
    z-index: 3;
}

.detail-gallery .gallery-item:hover figcaption,
.detail-gallery .gallery-item:focus-within figcaption {
    opacity: 1;
    transform: translateY(0);
}

@media(max-width:820px) {
    .detail-main-media { padding: 0; }
    .detail-main-image-frame { min-height: 0; }
    .detail-main-media .detail-main-image-frame img { max-height: 620px; }
    .detail-main-media button { right: 18px; bottom: 18px; opacity: .84; pointer-events: auto; transform: none; }
    .detail-gallery .gallery-item figcaption { opacity: .88; transform: none; }
    .detail-gallery .gallery-shell::before,
    .detail-gallery .gallery-shell::after { width: 36px; }
}

@media(max-width:560px) {
    .detail-main-media { padding: 0; }
    .detail-main-image-frame { min-height: 0; padding: 0; }
    .detail-main-media .detail-main-image-frame img { max-height: 520px; }
    .detail-main-media button { right: 16px; bottom: 16px; }
}

/* Consistent rounded rectangles for all artwork media. */
.viewer-stage.dragging { cursor: grabbing; }
.viewer-stage img { -webkit-user-drag: none; user-select: none; touch-action: none; cursor: inherit; }
.viewer-page-nav{position:absolute;z-index:4;top:50%;display:grid;place-items:center;width:52px;height:72px;padding:0;border:1px solid rgba(230,191,112,.42);border-radius:8px;background:rgba(28,21,18,.78);color:#fff;font-size:30px;transform:translateY(-50%);cursor:pointer;backdrop-filter:blur(8px);transition:background .2s ease,transform .2s ease}.viewer-page-nav:hover{background:rgba(142,52,43,.92)}.viewer-page-prev{left:18px}.viewer-page-next{right:18px}.viewer-counter{position:absolute;z-index:4;left:50%;bottom:16px;min-width:64px;padding:6px 10px;border-radius:999px;background:rgba(28,21,18,.72);color:#fff;font-size:12px;text-align:center;transform:translateX(-50%);pointer-events:none}.viewer-page-nav[hidden]{display:none}

.detail-main-image-frame {
    border-radius: 16px;
    height: auto;
    height: min(62vh, 620px);
    overflow: hidden;
    background: #e8deca;
}

.detail-main-image-frame::after {
    border-radius: 10px;
}

.detail-gallery .gallery-item,
.detail-gallery .gallery-shape-0,
.detail-gallery .gallery-shape-1,
.detail-gallery .gallery-shape-2,
.detail-gallery .gallery-shape-3,
.detail-gallery .gallery-shape-4 {
    border-radius: 14px;
}

.detail-gallery .gallery-item img {
    border-radius: inherit;
}

/* Keep uploaded artwork proportional and let the frame follow the image height. */
.detail-main-media .detail-main-image-frame img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    transition: object-position .35s ease, transform .35s ease;
}

.detail-main-image-frame:hover img {
    object-fit: contain;
    background: #e8deca;
}

.detail-main-image-frame.is-image-zoomed,
.detail-main-image-frame.is-image-zoomed img {
    cursor: grab;
}

.detail-main-image-frame.is-image-zoomed img { object-fit: contain; }
.detail-main-image-frame.is-image-zoomed:active img { cursor: grabbing; }

@media(max-width:820px){.detail-main-image-frame{height:min(60vh,520px)}}
@media(max-width:560px){.detail-main-image-frame{height:400px}}
@media(max-width:560px){.viewer-page-nav{width:42px;height:58px;font-size:24px}.viewer-page-prev{left:8px}.viewer-page-next{right:8px}}

.detail-video,
.detail-video video,
.detail-video iframe {
    border-radius: 16px;
}

/* Complete detail-page mappings for every admin layout option. */
body[data-detail-layout="card"] .detail-intro { grid-template-columns: 1fr; width: min(860px,100%); margin-inline: auto; }
body[data-detail-layout="card"] .detail-main-image-frame { height: min(68vh,680px); }
body[data-detail-layout="card"] .detail-intro-copy { padding: 24px 28px 0; }
body[data-detail-layout="waterfall"] .detail-intro { grid-template-columns: minmax(300px,.78fr) minmax(340px,1.22fr); align-items: start; }
body[data-detail-layout="waterfall"] .detail-main-image-frame { height: min(74vh,760px); }
body[data-detail-layout="waterfall"] .detail-gallery .gallery-item:nth-child(even) { margin-top: 58px; }
body[data-detail-layout="waterfall"] .detail-gallery .gallery-item:nth-child(3n) { height: 360px; }
body[data-detail-layout="text-only"] .detail-intro { display: block; width: min(820px,100%); margin-inline: auto; }
body[data-detail-layout="text-only"] .detail-main-media { display: none; }
body[data-detail-layout="text-only"] .detail-intro-copy { padding: 40px clamp(20px,6vw,72px); border-block: 1px solid rgba(123,73,39,.22); }
body[data-detail-layout="text-only"] .detail-intro-copy h2 { font-size: clamp(38px,6vw,68px); }
@media(max-width:820px){body[data-detail-layout="waterfall"] .detail-intro{grid-template-columns:1fr}body[data-detail-layout="waterfall"] .detail-gallery .gallery-item:nth-child(even){margin-top:0}}

/* Optional website reference supplied by the matching backend content record. */
.detail-website-link{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:14px;align-items:center;margin-top:26px;padding:16px 0;border-top:1px solid rgba(123,73,39,.22);border-bottom:1px solid rgba(123,73,39,.22);color:var(--detail-ink);text-decoration:none;transition:border-color .25s ease,color .25s ease}
.detail-website-link[hidden]{display:none}
.detail-website-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#2b201a;color:#fff;font-size:19px}
.detail-website-copy{display:grid;min-width:0;gap:3px}
.detail-website-copy small{color:#8d796c;font-size:12px}
.detail-website-copy strong{overflow:hidden;font-size:15px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.detail-website-action{display:inline-flex;align-items:center;gap:6px;color:var(--detail-red);font-size:14px;font-weight:800;white-space:nowrap}
.detail-website-link:hover,.detail-website-link:focus-visible{border-color:rgba(142,52,43,.58);color:var(--detail-red);outline:none}
@media(max-width:560px){.detail-website-link{grid-template-columns:38px minmax(0,1fr);gap:11px}.detail-website-icon{width:38px;height:38px}.detail-website-action{grid-column:2;justify-self:start}}