.zoom-frame{position:relative;display:block}
.zoom-frame>.image-preview-trigger{display:block}
.zoom-badge{position:absolute;right:10px;bottom:10px;width:34px;height:34px;border-radius:50%;background:rgba(20,32,26,.8);color:#fff;display:flex;align-items:center;justify-content:center;pointer-events:none;box-shadow:0 1px 6px rgba(0,0,0,.35);transition:transform .15s ease,background-color .15s ease}
.zoom-frame:hover .zoom-badge,.zoom-frame:focus-within .zoom-badge{transform:scale(1.08);background:rgba(20,32,26,.95)}
.image-preview-trigger{cursor:zoom-in}
.image-preview-trigger:focus-visible{outline:3px solid #426b66;outline-offset:3px}
body.image-preview-open{overflow:hidden}
dialog.image-preview{box-sizing:border-box;width:fit-content;max-width:min(800px,calc(100vw - 32px));max-height:84vh;max-height:84dvh;margin:auto;padding:18px 22px 20px;border:1px solid #d2d9d3;border-radius:10px;background:#fffefa;color:#193c3b;box-shadow:0 12px 45px #112c2b26;overflow:auto}
dialog.image-preview::backdrop{background:#1327267a}
.image-preview-close{display:block;margin:0 0 12px auto;min-height:36px;padding:5px 10px;border:1px solid transparent;border-radius:5px;background:transparent;color:inherit;font:inherit;font-size:14px;cursor:pointer}
.image-preview-close:hover{background:#eaf0e9}
.image-preview-close:focus-visible{outline:2px solid #426b66;outline-offset:2px}
.image-preview-picture{display:block;width:auto;height:auto;max-width:100%;max-height:60vh;max-height:60dvh;object-fit:contain;margin:0 auto;border-radius:3px}
.image-preview-picture[hidden]{display:none}
.image-preview-caption{max-width:68ch;margin:14px auto 0;font-size:13px;line-height:1.5;color:#566662}
.image-preview-status{margin:12px 0 0;font-size:14px}
.image-preview-status:empty{display:none}
@media(max-width:600px){dialog.image-preview{padding:12px 14px 16px}.image-preview-close{min-height:44px}.image-preview-caption{font-size:12px}.zoom-badge{width:38px;height:38px}}
