.portfolio-image-viewer{width:100%;min-width:0}.portfolio-zoom-toolbar{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;margin-bottom:12px;display:flex}.portfolio-zoom-toolbar input{width:112px;accent-color:var(--accent)}.portfolio-zoom-toolbar output{width:45px;color:var(--muted);font:12px var(--font-sans);font-variant-numeric:tabular-nums;text-align:center}.portfolio-zoom-tool{border:1px solid var(--border);width:36px;height:36px;color:var(--text);cursor:pointer;background:0 0;border-radius:50%;flex:0 0 36px;place-items:center;padding:0;display:grid;position:relative}.portfolio-zoom-tool:hover,.portfolio-zoom-tool[aria-pressed=true]{background:var(--accent-soft)}.portfolio-zoom-tool:disabled{opacity:.3;cursor:default}.portfolio-zoom-tool>span{border:1px solid var(--border);background:var(--bg);width:max-content;max-width:160px;color:var(--text);font:12px var(--font-sans);opacity:0;visibility:hidden;pointer-events:none;z-index:2;border-radius:4px;padding:7px 10px;position:absolute;bottom:calc(100% + 8px);right:0}.portfolio-zoom-tool:hover>span,.portfolio-zoom-tool:focus-visible>span{opacity:1;visibility:visible}.portfolio-zoom-viewport{overscroll-behavior:contain;border:1px solid var(--border);background:var(--bg-strong);cursor:grab;border-radius:4px;width:100%;height:min(64dvh,800px);position:relative;overflow:auto}.portfolio-zoom-viewport.is-dragging{cursor:grabbing;-webkit-user-select:none;user-select:none}.portfolio-image-viewer .portfolio-zoom-surface{box-sizing:border-box;place-items:center;width:max-content;min-width:100%;min-height:100%;padding:24px;display:grid}.portfolio-zoom-surface>img{object-fit:contain;flex:none;max-width:none;max-height:none;margin:0;display:block}@media (max-width:700px){.portfolio-zoom-toolbar{gap:6px}.portfolio-zoom-toolbar input{width:72px}.portfolio-zoom-toolbar output{width:38px}.portfolio-zoom-tool{flex-basis:32px;width:32px;height:32px}.portfolio-zoom-viewport{height:56dvh}}