/* Screenshot viewer shared only by the two instruction pages. */
.image-viewer{padding:0;border:1px solid #dce3ea;border-radius:8px;width:min(760px,96vw);max-width:96vw;height:92vh;height:92dvh;max-height:92vh;max-height:92dvh;margin:auto;color:var(--ink);background:#e8edf2;overflow:hidden;box-shadow:0 18px 70px rgb(4 14 31 / .3)}
.image-viewer[open]{display:flex;flex-direction:column}
.image-viewer::backdrop{background:rgb(4 14 31 / .8)}
.image-viewer-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:none;padding:12px 18px;border-bottom:1px solid var(--line);background:white}
.image-viewer-header h2{margin:0;font:600 15px/1.6 var(--sans);overflow-wrap:anywhere}
.image-viewer-close{display:flex;align-items:center;justify-content:center;gap:8px;flex:none;min-height:44px;padding:8px 12px;border:1px solid #cbd6e1;border-radius:4px;color:var(--ink);background:white;font-size:13px}
.image-viewer-close svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.image-viewer-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;padding:20px}
.image-viewer-scroll img{display:block;width:100%;max-width:680px;height:auto;margin:auto;background:white}
body.image-viewer-open{position:fixed;left:0;right:0;width:100%;overflow:hidden}
@media(max-width:760px){.image-viewer{width:100vw;max-width:100vw;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;border:0;border-radius:0}.image-viewer-header{gap:12px;padding:10px 12px;padding-top:max(10px,env(safe-area-inset-top))}.image-viewer-header h2{font-size:13px}.image-viewer-scroll{padding:12px 10px max(12px,env(safe-area-inset-bottom));scrollbar-gutter:auto}}
