/* Preview and displayed avatars share one bounded image box. Legacy portraits
   must not enlarge an intrinsic Grid track or receive a second center crop. */
:root { --avatar-photo-radius: 28%; }
.app-shell .avatar.has-photo,
.app-shell #profileButton.has-photo,
.app-shell .channel-icon.has-photo,
.app-shell .chat-avatar.has-photo,
.app-shell .details-avatar.has-photo,
.avatar.has-photo,
.profile-avatar-large.has-photo,
.member .avatar.has-photo,
.member-option .avatar.has-photo,
#avatarPicker {
  position: relative;
  aspect-ratio: 1;
  border: 0;
  padding: 0;
  border-radius: var(--avatar-photo-radius);
  background-origin: border-box;
  background-clip: border-box;
  background-position: 50% 50%;
  background-size: contain;
  background-repeat: no-repeat;
  overflow: hidden;
}
#avatarPicker { grid-template: minmax(0, 1fr) / minmax(0, 1fr); }
.has-photo > img.avatar-photo,
#profilePreviewImage {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: 50% 50%;
  border-radius: inherit;
  pointer-events: none;
}
/* The entire canvas is exported. An inset circle suggested a different crop. */
.avatar-crop-stage { border-radius: var(--avatar-photo-radius); }
.avatar-crop-mask { inset: 0; border-radius: var(--avatar-photo-radius); }