img[data-image-open] { cursor:zoom-in; }
img[data-image-open]:focus-visible { outline:2px solid #967036; outline-offset:5px; }
.page-marginalia[data-image-open], .leaf-edge-mark[data-image-open] { pointer-events:auto; }
.leaf-edge-mark[data-image-open] { z-index:2; }
.image-viewer { width:min(1280px,calc(100vw - 24px)); height:calc(100dvh - 24px); max-width:none; max-height:none; padding:0; border:1px solid #967036; border-radius:5px; overflow:hidden; background:#eee1c5; color:#382b1c; box-shadow:0 20px 90px #0009; }
.image-viewer::backdrop { background:#070812d9; backdrop-filter:blur(5px); }
.image-viewer-inner { height:100%; display:grid; grid-template-rows:auto auto minmax(0,1fr); }
.image-viewer-header { display:flex; gap:16px; align-items:center; padding:12px 16px 4px; }
.image-viewer-header p { flex:1; margin:0; font:16px/1.4 Georgia,serif; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.image-viewer button { border:1px solid #95714366; border-radius:4px; background:#fff8e6; color:#382b1c; min-width:44px; min-height:44px; padding:7px 12px; font:14px/1.2 system-ui,sans-serif; cursor:pointer; }
.image-viewer button:disabled { opacity:.35; cursor:default; }
.image-viewer [data-image-close] { font-size:26px; padding:3px; flex:none; }
.image-viewer-tools { display:flex; align-items:center; flex-wrap:wrap; gap:6px; padding:8px 16px 12px; border-bottom:1px solid #95714344; font:13px/1.2 system-ui,sans-serif; }
.image-viewer-tools output { min-width:44px; text-align:center; font-variant-numeric:tabular-nums; }
.image-viewer-tools a { margin-left:auto; color:inherit; padding:12px 0; text-underline-offset:3px; }
.image-viewer-stage { min-height:0; overflow:auto; overscroll-behavior:contain; touch-action:pan-x pan-y pinch-zoom; }
.image-viewer-canvas { display:flex; align-items:center; justify-content:center; width:max-content; min-width:100%; min-height:100%; }
.image-viewer-canvas img { display:block; flex:none; max-width:none; max-height:none; margin:24px; object-fit:contain; opacity:1; mix-blend-mode:normal; cursor:zoom-in; }
.image-viewer :focus-visible { outline:2px solid #316768; outline-offset:3px; }
@media(max-width:500px) { .image-viewer-header { padding:10px 10px 4px; gap:8px; } .image-viewer-tools { padding:6px 10px 10px; } .image-viewer-tools a { font-size:12px; } }