.article-image-dialog {
  box-sizing: border-box;
  width: min(1120px, calc(100vw - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 16px;
  border: 1px solid #dce3e9;
  border-radius: 12px;
  color: #23333f;
  background: #fff;
}
.article-image-dialog::backdrop { background: rgb(6 14 24 / 80%); }
.article-image-close {
  display: block;
  margin: 0 0 12px auto;
  min-height: 44px;
  padding: 10px 16px;
  border: 0;
  border-radius: 22px;
  color: #fff;
  background: #292d33;
  font: inherit;
  cursor: pointer;
}
.article-image-scroll { max-height: calc(100dvh - 150px); overflow: auto; overscroll-behavior: contain; }
.article-image-scroll img { display: block; width: 100%; min-width: 700px; max-width: none; height: auto; }
.article-image-hint { margin: 10px 0 0; font-size: 13px; line-height: 1.5; color: #576b79; }
.article-image-close:focus-visible, .article-image-scroll:focus-visible { outline: 3px solid #6099d8; outline-offset: 3px; }
@media (min-width:761px) { .article-image-hint { display: none; } }
@media (max-width:760px) {
  .article-image-dialog { padding: 12px; border-color: #2d4665; color: #edf4ff; background: #0b1830; }
  .article-image-close { background: #326caf; }
  .article-image-hint { color: #b7c9df; }
}