/* Modal top layer keeps images inside their current phone document. */
dialog.mobile-image-viewer {
  position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;
  margin:0;padding:0;border:0;border-radius:0;overflow:hidden;background:#151515;
  overscroll-behavior:none;color:#fff;box-shadow:none;
}
.mobile-image-viewer::backdrop { background:#151515;backdrop-filter:none; }
.mobile-image-surface { position:absolute;inset:0;overflow:hidden;touch-action:none;user-select:none;cursor:zoom-in; }
.mobile-image-surface[data-zoomed] { cursor:grab; }
.mobile-image-surface[data-zoomed]:active { cursor:grabbing; }
.mobile-image-art { position:absolute;top:50%;left:50%;padding:0;border:0;transform-origin:center;pointer-events:none; }
.mobile-image-art>img,.mobile-image-art>svg,.mobile-image-art>table { display:block;margin:0;max-width:none;max-height:none; }
.mobile-image-art>svg,.mobile-image-art>table { background:#fff; }
.mobile-image-close {
  position:absolute;top:max(10px,env(safe-area-inset-top));right:max(10px,env(safe-area-inset-right));
  display:grid;place-items:center;width:44px;height:44px;min-width:44px;padding:0;border:1px solid #777;
  border-radius:0;background:#262626ed;color:#fff;font:32px/1 Arial,sans-serif;touch-action:manipulation;cursor:pointer;
}
.mobile-image-close:focus-visible { outline:2px solid #fff;outline-offset:3px; }
html:is([data-phone-school],[data-phone-preview],[data-phone-layout],[data-phone-academic]) [data-mobile-image] { cursor:zoom-in; }
