/* All four edge labels share one quiet, delayed-following inverse layer. */
.story-edge-label{display:none}
@media(min-width:901px) and (hover:hover) and (pointer:fine){
 .story-edge-label{position:fixed;z-index:2203;left:0;top:0;display:block;width:max-content;max-width:min(240px,24vw);margin:0;color:#fff;mix-blend-mode:difference;pointer-events:none;opacity:0;font:300 12px/1.35 var(--font-support);text-align:left;transition:opacity .36s ease;will-change:transform}
 .story-edge-label.is-visible{opacity:1;transition-duration:.2s}
 .story-edge-label.is-previous{text-align:left}
 .story-edge-label.is-next{text-align:right}
 .story-media__item img[data-image-focus]{cursor:zoom-in}
 .story-media__item img[data-image-focus]:focus-visible{outline:1px solid currentColor;outline-offset:6px}
}
/* The dialog is just a top-layer host. Its matte and bitmap animate separately;
   it must not inherit the site's circular popup reveal or width constraints. */
html body dialog.project-image-viewer{
 position:fixed;inset:0;box-sizing:border-box;width:100vw;height:100dvh;max-width:none;max-height:none;
 margin:0;padding:0;border:0;border-radius:0;background:transparent!important;color:#fff;overflow:hidden;
 box-shadow:none;transform:none;animation:none;clip-path:none;
}
html body .project-image-viewer::backdrop{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.project-image-viewer__matte{position:absolute;inset:0;background:rgb(16 18 17 / .96);opacity:1}
.project-image-viewer__frame{position:absolute;inset:0;pointer-events:none;will-change:clip-path}
.project-image-viewer__image{position:absolute;display:block;max-width:none!important;max-height:none!important;margin:0!important;object-fit:fill!important;transform-origin:0 0;will-change:transform;pointer-events:none}
.project-image-viewer__close{
 position:absolute;z-index:2;top:12px;right:24px;min-width:64px;min-height:44px;margin:0;padding:12px;
 border:0!important;background:transparent!important;color:#fff;font:300 12px/1.3 var(--font-support);letter-spacing:.02em;cursor:pointer;
}
.project-image-viewer__close:focus-visible{outline:1px solid #fff;outline-offset:-4px}
html.project-image-focused,html.project-image-focused body{overflow:hidden!important}
html.project-image-focused .story-edge-label{opacity:0!important}
@media(prefers-reduced-motion:reduce){.story-edge-label{transition:none;will-change:auto}.project-image-viewer__frame,.project-image-viewer__image{will-change:auto}}