.zoom-trigger { all: unset; position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; cursor: zoom-in; }
.zoom-trigger:focus-visible { outline: 2px solid #c9a96e; outline-offset: -2px; }
.zoom-hint-label { position: absolute; z-index: 2; right: 8px; bottom: 8px; font: 400 10px/1 'DM Sans', sans-serif; letter-spacing: .16em; text-transform: uppercase; color: #e8e2d9; background: rgba(17,16,16,.82); border: 1px solid rgba(201,169,110,.5); padding: 6px 8px; }
.zoom-trigger:hover .zoom-hint-label, .zoom-trigger:focus-visible .zoom-hint-label { color: #c9a96e; }

.zoom-dialog { width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; border: 0; padding: 0; background: #0b0a0a; color: #e8e2d9; display: none; flex-direction: column; font-family: 'DM Sans', sans-serif; }
.zoom-dialog[open] { display: flex; }
.zoom-dialog::backdrop { background: rgba(0,0,0,.9); }
.zoom-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #2e2c2a; }
.zoom-caption { font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 24px; font-weight: 300; }
.zoom-controls { display: flex; align-items: center; gap: 6px; }
.zoom-controls button { min-width: 44px; min-height: 44px; padding: 0 12px; background: transparent; color: #e8e2d9; border: 1px solid #2e2c2a; font: 400 12px 'DM Sans', sans-serif; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.zoom-controls button[data-z="in"], .zoom-controls button[data-z="out"] { font-size: 20px; letter-spacing: 0; }
.zoom-controls button:hover:not(:disabled) { border-color: #c9a96e; color: #c9a96e; }
.zoom-controls button:focus-visible, .zoom-viewport:focus-visible { outline: 2px solid #c9a96e; outline-offset: 2px; }
.zoom-controls button:disabled { opacity: .35; cursor: default; }
.zoom-close { border-color: #c9a96e !important; color: #c9a96e !important; }
.zoom-level { min-width: 48px; text-align: center; font-size: 12px; color: #7a7268; }
.zoom-viewport { flex: 1; min-height: 0; min-width: 0; overflow: auto; display: grid; place-items: center; touch-action: pan-x pan-y pinch-zoom; }
.zoom-viewport.zoomed { place-items: start; cursor: grab; }
.zoom-viewport.zoomed.dragging { cursor: grabbing; }
.zoom-viewport img { display: block; max-width: none; user-select: none; -webkit-user-drag: none; margin: auto; }
.zoom-hint { padding: 8px 16px 12px; font-size: 11px; color: #7a7268; letter-spacing: .06em; text-align: center; }
.zoom-purchase { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; padding: 10px 16px; border-top: 1px solid #2e2c2a; font-size: 12px; line-height: 1.5; }
.zoom-purchase[hidden] { display: none; }
.zoom-purchase a, .zoom-purchase span { display: flex; align-items: center; min-height: 44px; }
.zoom-purchase a { color: #c9a96e; text-underline-offset: 4px; }
.zoom-purchase span { color: #b5aca0; }
.zoom-purchase a:focus-visible { outline: 2px solid #c9a96e; outline-offset: 3px; }
@media (max-width: 640px) { .zoom-caption { font-size: 20px; width: 100%; } .zoom-controls { width: 100%; justify-content: space-between; } }
@media (hover: none) { .zoom-hint { display: none; } }