.profile-image-row {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 8px 0 12px;
    }

.profile-preview {
      width: 72px;
      height: 72px;
      border-radius: 999px;
      background: #2b2b2b;
      display: grid;
      place-items: center;
      font-weight: 700;
      flex-shrink: 0;
      position: relative;
    }

.profile-preview img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 999px;
    }

.avatar-icon {
      position: absolute;
      width: 27px;
      height: 27px;
      border-radius: 999px;
      display: grid;
      place-items: center;
      z-index: 10;
    }

.profile-preview .avatar-cam {
      bottom: -5px;
      right: -5px;
      background: #1a5fb4;
      color: var(--text-primary);
      cursor: pointer;
    }

.profile-preview .avatar-remove {
      top: -5px;
      right: -5px;
      background: #753030;
      color: #e55;
      cursor: pointer;
    }

/* Banner preview (edit profile) */
    .banner-preview {
      width: 100%;
      height: 100px;
      border-radius: 10px;
      background: #1a1a1a;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      border: 1px dashed #444;
    }

.banner-preview img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

.banner-preview-label {
      color: #666;
      font-size: 12px;
    }

/* Profile hero banner (account tab + public profile) */

.banner-upload-row {
      position: relative;
    }

.banner-upload-row .avatar-remove {
      top: -5px;
      right: -5px;
      background: #753030;
      color: #e55;
      cursor: pointer;
    }