/* MJADE uses the shared case layout; these rules only apply to the jewelry case. */
/* Archivo Black lacks Vietnamese glyphs. Use one complete face for these entire lines. */
.case-page[data-case=mjade] .chapter-heading h2,
.case-page[data-case=mjade] .case-end>a{font-family:'Archivo',Arial,sans-serif;font-weight:900}
.case-page[data-case=mjade] .chapter-heading h2{letter-spacing:-.025em;word-spacing:.04em;line-height:1.12}
.mjade-home-copy{font-size:15px;line-height:1.8;max-width:38ch;margin-top:30px;color:inherit}
.case-page[data-case=mjade] .case-cover{max-width:1080px;width:calc(100% - 2 * var(--pad));margin-inline:auto;background:transparent}
.case-page[data-case=mjade] .case-cover .case-pair{grid-template-columns:1fr 1fr;gap:16px}
.case-page[data-case=mjade] .case-cover .case-image{margin:0}
.case-page[data-case=mjade] .case-cover a[data-zoom]{aspect-ratio:2/3}
.case-page[data-case=mjade] .case-cover img{height:100%;max-height:none;object-fit:cover}
.case-page[data-case=mjade] .case-table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7;margin:32px 0 0;table-layout:fixed}
.case-page[data-case=mjade] .case-table th,.case-page[data-case=mjade] .case-table td{text-align:left;vertical-align:top;padding:18px 16px;border-bottom:1px solid var(--line);overflow-wrap:break-word}
.case-page[data-case=mjade] .case-table thead{background:#eaded8}
.case-page[data-case=mjade] .case-table th:first-child{width:34%}
.case-page[data-case=mjade] .case-chapters .case-pair{margin-top:30px;gap:18px}
.case-page[data-case=mjade] .case-chapters .case-pair .case-image{margin:0 0 20px}
.case-page[data-case=mjade] #key-visuals>.case-image{max-width:540px;margin-inline:auto}
@media(max-width:760px){.case-page[data-case=mjade] .case-cover .case-pair{gap:10px}.case-page[data-case=mjade] .case-table{font-size:13px}.case-page[data-case=mjade] .case-table th,.case-page[data-case=mjade] .case-table td{padding:14px 10px}.case-page[data-case=mjade] .case-table th:first-child{width:36%}}
@media(max-width:540px){.case-page[data-case=mjade] .case-chapters .case-pair{grid-template-columns:1fr;gap:12px}.case-page[data-case=mjade] .case-cover a[data-zoom]>span{width:30px;height:30px;right:8px;bottom:8px}.case-page[data-case=mjade] .case-cover figcaption{font-size:9px;line-height:1.5}}

/* Preserve source image coordinates and crops, without the old page backgrounds. */
.mjade-canvas{position:relative;width:100%;overflow:hidden;isolation:isolate;margin:32px 0 0}
.mjade-canvas+.mjade-canvas{margin-top:clamp(24px,5vw,72px)}
.mjade-canvas .mjade-placement{position:absolute;margin:0;min-width:0;transform-origin:center}
.mjade-canvas .case-image a[data-zoom]{width:100%;height:100%;background:transparent;overflow:hidden}
.case-page[data-case=mjade] .mjade-canvas img{display:block;position:absolute;max-width:none;max-height:none;aspect-ratio:auto;object-fit:fill;transition:none}
.mjade-canvas .case-image a[data-zoom]:hover img{transform:none}
.mjade-canvas .case-image a[data-zoom]:focus-visible{outline:3px solid var(--pink-ink);outline-offset:-3px}
.mjade-canvas .case-image a[data-zoom]>span{width:28px;height:28px;font-size:14px;right:6px;bottom:6px;opacity:0;transition:opacity .15s;pointer-events:none}
.mjade-canvas .case-image a[data-zoom]:hover>span,.mjade-canvas .case-image a[data-zoom]:focus-visible>span{opacity:1}
.mjade-canvas figcaption{position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
