.gallery-card{cursor:pointer;text-align:center;font:inherit;color:inherit;appearance:none}
.gallery-card>span{display:block;margin-top:12px;line-height:1.4;font-size:14px;color:#ead4ad}
.gallery-card:focus-visible{outline:2px solid #dcc294;outline-offset:5px}
html{scrollbar-gutter:stable}
body.card-viewer-open{position:fixed;top:var(--gallery-scroll-top);width:var(--gallery-body-width);overflow:hidden}
.card-viewer{box-sizing:border-box;inset:0;top:var(--viewer-top,0px);width:100%;height:var(--viewer-height,100dvh);max-width:none;max-height:none;padding:0;margin:0;border:0;border-radius:0;color:#f5edff;background:transparent;box-shadow:none;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
.card-viewer::backdrop{background:#09051280;backdrop-filter:blur(8px)}
.card-viewer-controls{position:fixed;top:calc(10px + env(safe-area-inset-top));right:calc(14px + env(safe-area-inset-right));z-index:3}
.card-viewer-close{display:grid;place-items:center;width:60px;height:60px;padding:0;border:0;border-radius:12px;background:transparent;color:#f5e5c7;cursor:pointer;filter:drop-shadow(0 2px 5px #0009);transition:background .18s ease,color .18s ease}
.card-viewer-close svg{display:block;width:36px;height:36px}
.card-viewer-close:hover{background:#eee0ff12;color:#fff}
.card-viewer-content{box-sizing:border-box;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(120px,1fr) auto;gap:16px;width:min(800px,100%);height:100%;margin:0 auto;padding:10px 24px}
.card-viewer-art{display:flex;align-items:flex-start;justify-content:center;min-height:0;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-out;justify-self:center;position:relative;z-index:1}
.card-viewer-art img{display:block;width:auto;height:auto;max-width:100%;max-height:100%;margin:0 auto;border-radius:16px;object-fit:contain;object-position:center top;filter:drop-shadow(0 10px 20px #0005)}
.card-viewer-description{position:relative;isolation:isolate;min-width:0;text-align:center;padding:0 0 4px}
.card-viewer-description:before{content:"";position:absolute;z-index:-1;inset:-60px -80px 0;pointer-events:none;background:radial-gradient(ellipse at center,#0c0716eb 25%,#0c0716b3 50%,transparent 74%);backdrop-filter:blur(24px);mask-image:radial-gradient(ellipse at center,#000 35%,transparent 75%)}
.card-viewer-description .eyebrow{font-size:12px;color:#e4ca96}
.card-viewer-description h2{font-size:clamp(26px,3vw,34px);font-weight:500;line-height:1.15;margin:6px 0 8px;overflow-wrap:anywhere}
.card-viewer-description p{font-size:17px;line-height:1.6;color:#eee5f5;margin:0;text-wrap:pretty}
.card-viewer button:focus-visible{outline:2px solid #ecc777;outline-offset:-3px;border-radius:8px}
@media(max-width:650px){
 html{scrollbar-gutter:auto}
 .card-viewer-controls{top:calc(8px + env(safe-area-inset-top));right:calc(8px + env(safe-area-inset-right))}
 .card-viewer-close{width:48px;height:48px;background:#160e2340;backdrop-filter:blur(8px)}
 .card-viewer-close svg{width:28px;height:28px}
 /* Leave breathing room for Garamond descenders and the browser's bottom UI.
    The image gives up height before the description; short screens can scroll. */
 .card-viewer-content{gap:12px;padding:calc(10px + env(safe-area-inset-top)) 10px calc(24px + env(safe-area-inset-bottom))}
 .card-viewer-description{padding:0 8px;text-align:left}
 .card-viewer-description h2{font-size:26px}
 .card-viewer-description p{font-size:16px;line-height:1.5}
 .card-viewer-description:before{inset:-50px -40px 0}
}
.card-viewer[open]{animation:viewer-fade-in 380ms ease-out both}
.card-viewer[open]::backdrop{animation:viewer-fade-in 380ms ease-out both}
.card-viewer[open] .card-viewer-content{transform-origin:50% 25%;animation:viewer-rise-in 420ms cubic-bezier(.2,.7,.2,1) both}
.card-viewer.is-closing,.card-viewer.is-closing::backdrop{animation:viewer-fade-out 220ms ease-in both}
.card-viewer.is-closing .card-viewer-content{animation:viewer-rise-out 220ms ease-in both;pointer-events:none}
@keyframes viewer-fade-in{from{opacity:0}to{opacity:1}}
@keyframes viewer-fade-out{from{opacity:1}to{opacity:0}}
@keyframes viewer-rise-in{from{opacity:0;transform:translateY(18px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes viewer-rise-out{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(10px) scale(.985)}}
/* Gecko can lose the SVG gold bevel beneath a retained transform/opacity
   animation layer. Move only the artwork and release layers after entrance;
   keep the title's approved gold filter and Chromium animations unchanged. */
@supports (-moz-appearance:none){
 .card-viewer[open],.card-viewer[open]::backdrop{animation-fill-mode:backwards}
 .card-viewer[open] .card-viewer-content{animation:none}
 .card-viewer[open] .card-viewer-art{transform-origin:50% 25%;animation:viewer-rise-in 420ms cubic-bezier(.2,.7,.2,1) backwards}
 .card-viewer.is-closing .card-viewer-art{animation:viewer-rise-out 220ms ease-in both}
}
@media(prefers-reduced-motion:reduce){.card-viewer[open],.card-viewer[open]::backdrop,.card-viewer[open] .card-viewer-content{animation:none}}
html[data-motion=off] .card-viewer[open],html[data-motion=off] .card-viewer[open]::backdrop,html[data-motion=off] .card-viewer[open] .card-viewer-content{animation:none}
@media(prefers-reduced-motion:reduce){.card-viewer[open] .card-viewer-art{animation:none}}
html[data-motion=off] .card-viewer[open] .card-viewer-art{animation:none}