.hh-previewable{cursor:zoom-in}.hh-previewable:focus-visible{outline:2px solid #e6ac76;outline-offset:3px}
html.hh-image-open{overflow:hidden}
dialog.hh-image-viewer[open]{position:fixed;inset:0;margin:0;border:0;border-radius:0;padding:0;width:100vw;height:100dvh;max-width:none;max-height:none;background:radial-gradient(ellipse at 50% 35%,#20272e,#0c1015 80%);color:#f4f5f6;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}
.hh-image-viewer::backdrop{background:#050708ed}
.hh-image-toolbar{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 20px;background:linear-gradient(180deg,#202831,#161d24);border-top:1px solid #ffffff20;box-shadow:0 -8px 28px #0003;z-index:1;flex:none;box-sizing:border-box}
.hh-image-toolbar button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;flex:0 0 auto;width:auto;max-width:none;margin:0;min-width:62px;height:56px;padding:6px 9px;border:1px solid #ffffff17;border-radius:9px;background:linear-gradient(180deg,#ffffff08,#ffffff03);color:#c4ced9;font:500 11px/1.2 system-ui;cursor:pointer;box-sizing:border-box;transition:background .14s,color .14s,border-color .14s}
.hh-image-toolbar button svg{display:block;width:24px;height:24px;flex:none;overflow:visible}.hh-image-toolbar button span{white-space:nowrap}
.hh-image-toolbar button:hover{background:#edb47d14;border-color:#edb47d66;color:#efb782}.hh-image-toolbar button:active{background:#edb47d24}.hh-image-toolbar button:focus-visible{outline:2px solid #efb782;outline-offset:2px}
.hh-image-caption{position:absolute;top:18px;left:20px;padding:7px 12px;border:1px solid #ffffff16;border-radius:20px;background:#10151cc9;color:#c6d1dc;font:12px/1.4 system-ui;font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none}
.hh-image-stage{position:relative;flex:1;min-height:0;min-width:0;overflow:hidden;touch-action:none;user-select:none;cursor:default}.hh-image-stage.is-dragging,.hh-image-stage.is-dragging img{cursor:grabbing}
.hh-image-stage img{position:absolute;top:50%;left:50%;display:block;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;object-fit:contain;user-select:none;-webkit-user-drag:none;transform-origin:center;pointer-events:auto;cursor:grab;transition:none;will-change:transform}
@media(max-width:700px){.hh-image-toolbar{gap:4px;padding:9px 7px;flex-wrap:wrap}.hh-image-toolbar button{min-width:34px;height:40px;padding:6px;border-radius:7px}.hh-image-toolbar button span{display:none}.hh-image-toolbar button svg{width:22px;height:22px}.hh-image-caption{top:10px;left:10px;font-size:11px}}
@media(prefers-reduced-motion:reduce){.hh-image-toolbar button{transition:none}}