/* Critical avatar/profile image styles — loaded in to prevent full-screen flash */ .user-avatar, .profile-avatar, .profile-ring-container, .profile-ring-inner, .profile-complete, .avatar-circle, .conversation-avatar, .applicant-info .applicant-avatar, .applicant-header > img.applicant-avatar, .header-avatar-visual { overflow: hidden; flex-shrink: 0; } .user-avatar { width: 36px; height: 36px; } .profile-ring-container, .profile-complete { width: 100px; height: 100px; } .profile-ring-inner { width: 80px; height: 80px; } .profile-ring-inner .profile-avatar { width: 50px; height: 50px; border-radius: 50%; } .profile-avatar .avatar-circle { width: 80px; height: 80px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .profile-avatar { position: relative; } .conversation-avatar { position: relative; width: 48px; height: 48px; } .applicant-info .applicant-avatar, .applicant-header > img.applicant-avatar { width: 40px; height: 40px; max-width: 60px; max-height: 60px; } .header-avatar-visual { width: 48px; height: 48px; } img.user-avatar-img, img.profile-picture, .conversation-avatar > img, img.avatar-img, img.applicant-avatar, .profile-avatar img, .header-avatar-visual img { display: block; max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: cover; border-radius: 50%; } /* Hidden until deferred loader assigns src and image finishes loading */ img[data-profile-src]:not(.profile-image-visible) { opacity: 0; visibility: hidden; } img.profile-image-visible { opacity: 1; visibility: visible; transition: opacity 0.2s ease-in; } /* Company logos on applicant/recruiter pages */ .company-logo-container, .application-icon { overflow: hidden; flex-shrink: 0; } .company-logo-container { width: 80px; height: 80px; } .application-icon { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; } img.company-logo, img.company-logo-img { display: block; max-width: 100%; max-height: 100%; width: 100%; height: 100%; object-fit: cover; }