[data-article-images] .article-image-trigger { cursor: zoom-in; }
[data-article-images] .article-image-trigger:focus-visible { outline: 3px solid var(--link, #075985); outline-offset: 4px; }
.article-image-viewer { box-sizing: border-box; width: calc(100% - 32px); height: calc(100dvh - 32px); max-width: none; max-height: none; padding: 0; border: 0; background: transparent; color: #0c0a09; overflow: hidden; }
.article-image-viewer[open] { display: flex; flex-direction: column; }
.article-image-viewer::backdrop { background: rgb(12 10 9 / 88%); }
.image-viewer-help { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.image-viewer-toolbar { display: flex; align-items: center; gap: 8px; flex: none; padding: 8px 12px; background: #fafaf9; border-radius: 10px; }
.image-viewer-toolbar button { display: inline-flex; flex: none; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 8px 12px; border: 0; border-radius: 6px; background: #f0efed; color: #0c0a09; font: inherit; line-height: 1.3; cursor: pointer; }
.image-viewer-toolbar button:hover { background: #e7e5e4; }
.image-viewer-toolbar button:disabled { opacity: .45; cursor: default; }
.image-viewer-toolbar button:focus-visible, .image-viewer-stage:focus-visible { outline: 3px solid #3ba6f1; outline-offset: -3px; }
.image-viewer-toolbar button span { font-size: 24px; line-height: 1; }
.image-viewer-scale { min-width: 52px; text-align: center; font-size: 14px; font-variant-numeric: tabular-nums; }
.image-viewer-toolbar .image-viewer-close { margin-left: auto; }
.image-viewer-stage { flex: 1; position: relative; min-height: 0; margin-top: 8px; overflow: hidden; touch-action: none; overscroll-behavior: contain; border-radius: 6px; }
.image-viewer-image { position: absolute; top: 50%; left: 50%; max-width: none; max-height: none; margin: 0; user-select: none; -webkit-user-select: none; visibility: hidden; }
.image-viewer-stage[data-ready] .image-viewer-image { visibility: visible; }
.image-viewer-stage[data-pannable] .image-viewer-image { cursor: grab; }
.image-viewer-stage[data-dragging] .image-viewer-image { cursor: grabbing; }
.image-viewer-error { position: absolute; inset: 16px; margin: auto; height: fit-content; text-align: center; color: #fff; font-size: 16px; }
.image-viewer-error a { color: #fff; text-decoration: underline; }
@media(max-width:600px) {
  .article-image-viewer { width: calc(100% - 16px); height: calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); }
  .image-viewer-toolbar { gap: 6px; padding: 8px; }
  .image-viewer-toolbar button { padding: 8px; }
  .image-viewer-toolbar .image-viewer-fit { flex-shrink: 1; min-width: 0; font-size: 12px; max-width: 104px; }
  .image-viewer-scale { min-width: 44px; font-size: 12px; }
}