/* Deliberately no rules for the page, source photos, or other dialogs. */
#hwg-message-photo-viewer {
  position:fixed; inset:0; box-sizing:border-box; margin:auto; padding:0;
  width:min(1100px,96vw); height:min(900px,94vh); height:min(900px,94dvh);
  max-width:96vw; max-height:94dvh; border:1px solid #59645d; border-radius:16px;
  background:#121a15; color:#fff; font:16px/1.4 Arial,sans-serif;
  box-shadow:0 18px 70px #0008; overflow:hidden; overscroll-behavior:contain;
}
#hwg-message-photo-viewer::backdrop { background:rgba(0,0,0,.82); }
#hwg-message-photo-viewer[open] { display:flex; flex-direction:column; }
#hwg-message-photo-viewer .hwg-pv-toolbar {
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap;
  gap:8px; padding:10px; flex:none; background:#18281e; color:#fff;
}
#hwg-message-photo-viewer .hwg-pv-controls { display:flex; align-items:center; gap:6px; }
#hwg-message-photo-viewer .hwg-pv-button {
  box-sizing:border-box; display:inline-flex; justify-content:center; align-items:center;
  min-width:44px; min-height:44px; padding:8px 12px; margin:0; border:1px solid #73847a;
  border-radius:9px; background:#243d2d; color:#fff; -webkit-text-fill-color:#fff;
  font:600 16px/1.2 Arial,sans-serif; letter-spacing:normal; text-transform:none;
  text-decoration:none; box-shadow:none; cursor:pointer; opacity:1;
}
#hwg-message-photo-viewer .hwg-pv-button:hover,
#hwg-message-photo-viewer .hwg-pv-button:focus-visible { background:#36573f; color:#fff; -webkit-text-fill-color:#fff; outline:2px solid #b4f38c; outline-offset:1px; }
#hwg-message-photo-viewer .hwg-pv-stage { position:relative; flex:1; min-height:0; overflow:hidden; touch-action:none; user-select:none; -webkit-user-select:none; cursor:grab; }
#hwg-message-photo-viewer .hwg-pv-stage:active { cursor:grabbing; }
#hwg-message-photo-viewer .hwg-pv-image { position:absolute; left:50%; top:50%; display:block; max-width:none; max-height:none; margin:0; padding:0; border:0; border-radius:0; object-fit:contain; transform-origin:center; pointer-events:none; user-select:none; -webkit-user-drag:none; }
#hwg-message-photo-viewer .hwg-pv-image[hidden] { display:none; }
#hwg-message-photo-viewer .hwg-pv-help { margin:0; padding:8px 12px; color:#e0e9e3; background:#18281e; font:13px/1.4 Arial,sans-serif; text-align:center; }
#hwg-message-photo-viewer .hwg-pv-status { position:absolute; inset:40% 12px auto; margin:0; color:#fff; font:16px/1.4 Arial,sans-serif; text-align:center; pointer-events:none; }
@media (max-width:600px) {
  #hwg-message-photo-viewer { width:100%; max-width:100%; height:100dvh; max-height:100dvh; border-radius:0; }
  #hwg-message-photo-viewer .hwg-pv-toolbar { padding-top:max(10px,env(safe-area-inset-top)); }
  #hwg-message-photo-viewer .hwg-pv-help { padding-bottom:max(10px,env(safe-area-inset-bottom)); }
}
#hwg-message-photo-viewer .hwg-pv-counter { font-weight:600; }
#hwg-message-photo-viewer .hwg-pv-button[hidden] { display:none; }
#hwg-message-photo-viewer .hwg-pv-nav { position:absolute; top:50%; z-index:2; width:48px; height:64px; margin-top:-32px; padding:0; font-size:32px; line-height:1; background:rgba(16,28,21,.72); }
#hwg-message-photo-viewer .hwg-pv-previous { left:10px; }
#hwg-message-photo-viewer .hwg-pv-next { right:10px; }
#hwg-message-photo-viewer .hwg-pv-nav:disabled { opacity:.3; cursor:default; }
/* Phones pinch and swipe, so the toolbar keeps one row and the photo gets the space. */
@media (pointer:coarse) {
  #hwg-message-photo-viewer .hwg-pv-zoom, #hwg-message-photo-viewer .hwg-pv-help { display:none; }
  #hwg-message-photo-viewer .hwg-pv-nav { width:40px; height:56px; margin-top:-28px; font-size:26px; }
  #hwg-message-photo-viewer .hwg-pv-previous { left:4px; }
  #hwg-message-photo-viewer .hwg-pv-next { right:4px; }
}