/* Photo zoom (photo-zoom.js): the hover preview and the lightbox for article photos. Flat colours, no shadows. */
img.pz-photo{cursor:zoom-in}
img.pz-photo:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.pz-preview{position:fixed;inset:0;z-index:60;display:flex;align-items:center;justify-content:center;
  background:rgba(17,17,17,.6);pointer-events:none}
.pz-preview[hidden]{display:none}
.pz-preview img{display:block;max-width:70vw;max-height:70vh;width:auto;height:auto;background:#fff;
  border:1px solid rgba(255,255,255,.5);border-radius:6px}

.pz-box{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;
  border:0;background:#111;color:#fff;overflow:hidden}
.pz-box::backdrop{background:#111}
html.pz-open{overflow:hidden}
.pz-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:56px 16px 16px;
  box-sizing:border-box;touch-action:none;cursor:zoom-out;user-select:none;-webkit-user-select:none}
.pz-full{display:block;max-width:100%;max-height:100%;width:auto;height:auto;transform-origin:center center}
.pz-btn{position:absolute;z-index:1;font:inherit;font-size:15px;line-height:1;color:#fff;background:#111;
  border:1px solid rgba(255,255,255,.4);border-radius:6px;cursor:pointer}
.pz-btn:hover{border-color:#fff}
.pz-btn:focus-visible{outline:2px solid #fff;outline-offset:2px}
.pz-close{top:12px;right:12px;padding:9px 14px}
.pz-prev,.pz-next{top:50%;width:44px;height:44px;margin-top:-22px;font-size:28px}
.pz-prev{left:12px}
.pz-next{right:12px}
.pz-single .pz-prev,.pz-single .pz-next{display:none}
@media (min-width:700px){.pz-box:not(.pz-single) .pz-stage{padding-left:68px;padding-right:68px}}

@media (prefers-reduced-motion:no-preference){
  .pz-box[open],.pz-preview:not([hidden]){animation:pz-in .15s ease-out}
  @keyframes pz-in{from{opacity:0}to{opacity:1}}
}
