[data-image-zoom="1"] .slide { position: relative; cursor: zoom-in; }
.image-zoom-trigger { position: absolute; top: 12px; right: 12px; z-index: 3; width: 44px; height: 44px; border: 1px solid #dce2e8; border-radius: 50%; background: #fff; color: #111317; padding: 0; font-size: 0; line-height: 0; cursor: zoom-in; }
.image-viewer { width: min(96vw, 1400px); max-width: 96vw; height: 94dvh; max-height: 94dvh; padding: 0; border: 0; border-radius: 12px; background: #fff; color: #111317; }
.image-viewer::backdrop { background: rgb(0 0 0 / 85%); }
.image-viewer-toolbar { height: 56px; display: flex; justify-content: flex-end; align-items: center; gap: 8px; padding: 4px 12px; box-sizing: border-box; }
.image-viewer-toolbar button { width: 44px; height: 44px; background: #eef3f8; color: #111317; border: 0; border-radius: 8px; font-size: 28px; cursor: pointer; }
.image-viewer-viewport { width: 100%; height: calc(100% - 56px); overflow: auto; overscroll-behavior: contain; }
.image-viewer-viewport img { display: block; width: 100%; height: 100%; max-width: none; object-fit: contain; }
.image-viewer-viewport.is-magnified img { width: 200%; height: auto; }
.image-viewer-open { overflow: hidden; }
.image-viewer button:focus-visible, .image-zoom-trigger:focus-visible { outline: 3px solid #0081fb; outline-offset: 2px; }

/* Draw the zoom icon independently of font metrics on Android. */
.image-zoom-trigger::before {
  content: "";
  position: absolute;
  width: 22px;
  height: 22px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14 4h6v6M20 4l-7 7M10 20H4v-6M4 20l7-7' fill='none' stroke='%23111317' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  pointer-events: none;
}
.image-viewer-toolbar button { display: flex; align-items: center; justify-content: center; padding: 0; line-height: 1; }