html.image-viewer-open{overflow:hidden}
.image-viewer-trigger{cursor:zoom-in}
.image-viewer{box-sizing:border-box;position:fixed;inset:0;width:min(1200px,calc(100% - 48px));max-width:none;height:calc(100dvh - 48px);max-height:none;margin:auto;padding:18px 24px;border:1px solid #ffffff24;border-radius:18px;background:#102a2e;color:#fff;box-shadow:0 24px 90px #0008;overflow:hidden;font:15px/1.5 system-ui,sans-serif}
.image-viewer[open]{display:flex;flex-direction:column;gap:12px}
.image-viewer::backdrop{background:#06191be8;backdrop-filter:blur(7px)}
.image-viewer__bar{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-shrink:0;color:#d5e6e5;min-height:44px}
.image-viewer button{border:1px solid #ffffff45;border-radius:999px;color:#fff;background:#ffffff0d;cursor:pointer;min-height:44px;padding:9px 18px;font:inherit;transition:background .15s}
.image-viewer button:hover{background:#ffffff25}
.image-viewer button:focus-visible{outline:3px solid #e2c48c;outline-offset:3px}
.image-viewer .image-viewer__close{width:44px;height:44px;padding:0;flex-shrink:0;font-size:30px;line-height:1}
.image-viewer figure{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:12px;flex:1;min-height:0;min-width:0;margin:0}
.image-viewer figure img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;opacity:1}
.image-viewer.is-loading figure img{opacity:0}
.image-viewer figcaption{text-align:center;color:#d5e6e5;line-height:1.5;max-height:4.5em;overflow:auto;font-size:14px}
.image-viewer__navigation{display:flex;justify-content:center;gap:14px;flex-shrink:0}
.image-viewer button[hidden]{display:none}
@media(max-width:699px){.image-viewer{width:100%;height:100dvh;border:0;border-radius:0;padding:max(12px,env(safe-area-inset-top)) 14px max(16px,env(safe-area-inset-bottom));gap:10px}.image-viewer__bar{font-size:13px}.image-viewer figcaption{font-size:13px}.image-viewer__navigation button{flex:1;max-width:180px}}
@media(prefers-reduced-motion:reduce){.image-viewer button{transition:none}}