.image-viewer-open{overflow:hidden}
.image-viewer{box-sizing:border-box;width:calc(100% - 32px);max-width:1200px;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);margin:auto;padding:0;border:1px solid #637882;border-radius:12px;background:#153848;color:#fff;box-shadow:0 20px 80px #0008;font-family:inherit}
.image-viewer::backdrop{background:#071c27ed}
.image-viewer[open]{display:flex;flex-direction:column}
.viewer-header{display:flex;align-items:center;gap:20px;padding:10px 14px;border-bottom:1px solid #ffffff30;font-size:15px}
.viewer-counter{margin-left:auto;white-space:nowrap;font-variant-numeric:tabular-nums;color:#f0cb6e}
.image-viewer button{display:grid;place-items:center;flex-shrink:0;width:46px;height:46px;margin:0;padding:0;border:1px solid #ffffff60;border-radius:50%;background:#244e5e;color:#fff;cursor:pointer;touch-action:manipulation}
.image-viewer button:hover{background:#346575}
.image-viewer button:focus-visible{outline:3px solid #eabc4c;outline-offset:3px}
.image-viewer button:disabled{opacity:.35;cursor:default}
.image-viewer button svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.image-viewer .viewer-close{border-color:#eabc4c;background:#eabc4c;color:#153848}
.image-viewer .viewer-close:hover{background:#f3ce72}
.viewer-stage{display:grid;grid-template-columns:46px minmax(0,1fr) 46px;align-items:center;gap:14px;padding:14px;min-height:0}
.viewer-picture{display:flex;align-items:center;justify-content:center;min-width:0;min-height:160px;height:calc(100vh - 248px);height:calc(100dvh - 248px);max-height:710px;touch-action:pan-y}
.viewer-picture img{display:block;width:100%;height:100%;max-width:100%;object-fit:contain}
.viewer-picture img[hidden],.viewer-status[hidden]{display:none}
.viewer-status{max-width:420px;text-align:center;font-size:16px;line-height:1.6}
.viewer-footer{padding:0 20px 16px}
.viewer-footer #viewer-caption{margin:0;max-height:18vh;overflow:auto;font-size:15px;line-height:1.55;color:#fff}
.viewer-help{margin:8px 0 0;font-size:12px;color:#c3d2d9}
@media(max-width:600px){.image-viewer{width:calc(100% - 16px);max-height:calc(100dvh - 16px);border-radius:8px}.viewer-header{gap:10px;padding:8px 10px;font-size:13px}.viewer-stage{position:relative;grid-template-columns:minmax(0,1fr);gap:0;padding:12px 6px}.image-viewer button{width:44px;height:44px}.viewer-stage button{position:absolute;bottom:20px;z-index:1;background:#153848e8}.viewer-prev{left:12px}.viewer-next{right:12px}.viewer-picture{height:calc(100dvh - 255px);min-height:120px}.viewer-footer{padding:0 12px 14px}.viewer-footer #viewer-caption{font-size:14px}.viewer-help{font-size:11px}}
@media(max-height:450px){.viewer-picture{height:calc(100dvh - 175px);min-height:60px}.viewer-footer #viewer-caption{max-height:12vh}.viewer-help{display:none}.viewer-stage{padding-top:6px;padding-bottom:6px}}