.wt-blog-image { max-width: 100%; height: auto; }
.wt-blog-image-zoom { cursor: zoom-in; }
.wt-blog-image-zoom:focus-visible { outline: 3px solid #528cce; outline-offset: 4px; }
dialog.wt-blog-image-dialog {
    box-sizing: border-box; position: fixed; inset: 0; z-index: 2147483000;
    width: min(1400px, calc(100% - 32px)); height: calc(100% - 32px); height: calc(100dvh - 32px);
    max-width: none; max-height: none; margin: auto; padding: 0; overflow: hidden;
    border: 1px solid #617082; border-radius: 12px; background: #101923; color: #fff;
    box-shadow: 0 20px 90px #0009; font: 15px/1.4 system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
dialog.wt-blog-image-dialog:not([open]) { display: none; }
dialog.wt-blog-image-dialog[open] { display: flex; flex-direction: column; }
.wt-blog-image-dialog::backdrop { background: #06111ddb; }
.wt-blog-image-dialog .wt-blog-image-toolbar {
    display: flex; align-items: center; flex: none; gap: 10px; min-height: 62px; padding: 10px 16px;
    border-bottom: 1px solid #41505f; background: #1b2938;
}
.wt-blog-image-dialog #wt-blog-image-title { flex: 1; font-weight: 650; }
.wt-blog-image-dialog button {
    appearance: none; display: inline-block; box-sizing: border-box; width: auto; min-height: 42px;
    margin: 0; padding: 8px 13px; border: 1px solid #687b8e; border-radius: 8px;
    background: #283e54; color: #fff; font: inherit; cursor: pointer;
}
.wt-blog-image-dialog button:hover { background: #3d5975; }
.wt-blog-image-dialog button:focus-visible { outline: 3px solid #a1cafa; outline-offset: 3px; }
.wt-blog-image-dialog button:disabled { opacity: .6; cursor: default; }
.wt-blog-image-dialog .wt-blog-image-status { flex: none; padding: 10px 16px; color: #e1eaf4; }
.wt-blog-image-dialog .wt-blog-image-status:empty { display: none; }
.wt-blog-image-dialog .wt-blog-image-stage { flex: 1; min-height: 0; overflow: auto; padding: 12px; overscroll-behavior: contain; }
.wt-blog-image-dialog .wt-blog-image-stage img {
    display: block; width: auto; height: auto; max-width: 100%; max-height: 100%;
    margin: auto; padding: 0; border: 0; object-fit: contain;
}
.wt-blog-image-dialog.is-actual-size .wt-blog-image-stage img { max-width: none; max-height: none; }
@media (max-width: 600px) {
    dialog.wt-blog-image-dialog { width: 100%; height: 100%; height: 100dvh; border-radius: 0; border: 0; }
    .wt-blog-image-dialog .wt-blog-image-toolbar { gap: 7px; padding: max(10px, env(safe-area-inset-top)) 10px 10px; }
    .wt-blog-image-dialog #wt-blog-image-title { font-size: 13px; }
    .wt-blog-image-dialog button { padding: 8px 10px; font-size: 13px; }
    .wt-blog-image-dialog .wt-blog-image-stage { padding: 8px 8px max(8px, env(safe-area-inset-bottom)); }
}