/* iBlogger v129 — pixel-review corrections against the supplied 430 × 1202 reference.
   This layer is scoped to the mobile profile only; desktop and all other pages are untouched. */
@media (max-width: 620px) {
  /* Hero: use the exact portrait crop from the reference and align the small identity details. */
  #mobileImportedProfile .ibm-portrait {
    top: 5px !important;
    right: 8px !important;
    width: 103px !important;
    height: 95px !important;
    object-fit: fill !important;
    object-position: center !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
  #mobileImportedProfile .ibm-person h1 {
    top: 0 !important;
    right: 9px !important;
  }
  #mobileImportedProfile .ibm-person h1 small {
    top: 1px !important;
  }
  #mobileImportedProfile .ibm-handle {
    top: 24px !important;
    color: #9699ad !important;
    font-size: 9.5px !important;
  }
  #mobileImportedProfile .ibm-category .ibm-category-label {
    transform: translate(2px, 2px) !important;
  }
  #mobileImportedProfile .ibm-feedback-button {
    transform: translateY(1px) !important;
  }

  /* About: match the reference's softer lavender copy and baseline. */
  #mobileImportedProfile .ibm-about h2 span {
    transform: translate(-2px, 0) !important;
  }
  #mobileImportedProfile .ibm-about p {
    color: #a6aecb !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
    transform: none !important;
  }

  /* Gallery: the tile image coordinates already match; trim only the excess bottom pixel
     and widen/shift the heading to the reference's icon and title alignment. */
  #mobileImportedProfile .ibm-work {
    padding-bottom: 7px !important;
  }
  #mobileImportedProfile .ibm-work h2 {
    transform: translateX(-3px) scaleX(1.06) !important;
    transform-origin: right center !important;
  }

  /* Reviews: restore the enclosing panel visible in the reference and preserve inner x=30. */
  #mobileImportedProfile .ibm-reviews-section {
    margin-top: 6px !important;
    padding: 0 0 2px !important;
    border: 1px solid #dfe3ef !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(54, 66, 110, .045) !important;
  }
  #mobileImportedProfile .ibm-reviews-heading {
    margin: 0 7px 5px !important;
  }
  #mobileImportedProfile .ibm-reviews-heading h2 {
    transform: translate(-4px, 3px) !important;
  }
  #mobileImportedProfile .ibm-review-list {
    margin: 0 7px !important;
  }
  #mobileImportedProfile .ibm-review {
    position: relative !important;
  }
  #mobileImportedProfile .ibm-review:nth-child(5) {
    height: 86px !important;
    min-height: 86px !important;
  }

  /* Use exact logo crops; this removes the duplicate white rings and the extra Zamzam wordmark. */
  #mobileImportedProfile .ibm-review .ibm-brand-icon {
    position: absolute !important;
    top: 1px !important;
    right: 1px !important;
    width: 61px !important;
    height: 61px !important;
    min-width: 61px !important;
    min-height: 61px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    transform: none !important;
  }
  #mobileImportedProfile .ibm-review .ibm-brand-icon img {
    display: block !important;
    width: 61px !important;
    height: 61px !important;
    object-fit: fill !important;
    border-radius: 0 !important;
  }
  #mobileImportedProfile .ibm-review-center .ibm-review-time,
  #mobileImportedProfile .ibm-brand-handle {
    color: #a1a6bd !important;
  }
  #mobileImportedProfile .ibm-review p {
    color: #a2a9c3 !important;
  }
  #mobileImportedProfile .ibm-review h3 {
    font-size: 9.8px !important;
    color: #393752 !important;
  }

  /* The locked analytics are static previews: use their exact reference crops while keeping
     the real transparent click targets active for the existing verification flow. */
  #mobileImportedProfile .ibm-analytics {
    margin-top: 5px !important;
    height: 107px !important;
  }
  #mobileImportedProfile .ibm-chart-card {
    height: 107px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-repeat: no-repeat !important;
    background-position: left top !important;
    background-size: 100% 100% !important;
    box-shadow: none !important;
  }
  #mobileImportedProfile .ibm-chart-card:first-child {
    background-image: url("../assets/images/profile-mobile-replacement/chart-views-reference-v129.png") !important;
  }
  #mobileImportedProfile .ibm-chart-card:nth-child(2) {
    background-image: url("../assets/images/profile-mobile-replacement/chart-followers-reference-v129.png") !important;
  }
  #mobileImportedProfile .ibm-chart-card > :not(.ibm-chart-hit) {
    opacity: 0 !important;
  }
  #mobileImportedProfile .ibm-chart-hit {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    opacity: 0 !important;
    background: transparent !important;
  }

  /* Match the full-width summary card and keep its real action button accessible/clickable. */
  #mobileImportedProfile .ibm-performance-summary {
    height: 89px !important;
    min-height: 89px !important;
    margin-top: 2px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: url("../assets/images/profile-mobile-replacement/summary-reference-v129.png") left top / 100% 100% no-repeat !important;
    box-shadow: none !important;
  }
  #mobileImportedProfile .ibm-performance-summary > * {
    opacity: 0 !important;
  }
  #mobileImportedProfile .ibm-page {
    padding-bottom: 10px !important;
  }
}

@media (max-width: 390px) {
  /* Keep the exact logo artwork proportional on narrower phones. */
  #mobileImportedProfile .ibm-review .ibm-brand-icon,
  #mobileImportedProfile .ibm-review .ibm-brand-icon img {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;
  }
}

@media (max-width: 620px) {
  /* The hero border is one pixel inside its box, so top=4 places the crop at y=5. */
  #mobileImportedProfile .ibm-portrait { top: 4px !important; }

  /* Set the gallery panel's exact bottom edge; its next panel begins at y=522. */
  #mobileImportedProfile .ibm-work {
    height: 232px !important;
    min-height: 232px !important;
  }

  /* Keep the text and rating columns in their original middle and left grid tracks
     after the brand image itself is positioned absolutely for exact reference placement. */
  #mobileImportedProfile .ibm-review-center { grid-column: 2 !important; }
  #mobileImportedProfile .ibm-review-meta { grid-column: 3 !important; }
}


@media (max-width: 620px) {
  /* More faithful Latin/Persian fallback metrics for the profile identity. */
  #mobileImportedProfile .ibm-person h1 {
    right: 10px !important;
    font-family: Arial, Tahoma, sans-serif !important;
  }
  #mobileImportedProfile .ibm-handle {
    top: 21px !important;
    font-size: 11.5px !important;
    color: #9699ad !important;
  }

  /* The biography line is slightly narrower and one pixel higher in the reference. */
  #mobileImportedProfile .ibm-about p {
    font-family: Arial, Tahoma, sans-serif !important;
    font-size: 11.85px !important;
    line-height: 17.18px !important;
    transform: translateY(-1px) !important;
  }

  /* Portfolio captions sit lower under the photos and use the reference's wider text size. */
  #mobileImportedProfile .ibm-work h2 {
    transform: translate(-3px, 1px) scaleX(1.06) !important;
  }
  #mobileImportedProfile .ibm-work-item span {
    padding-top: 8px !important;
    font-size: 9.8px !important;
    line-height: 15px !important;
  }

  /* Reassert the exact 61px crops against older nth-child rules with equal/higher specificity. */
  #mobileImportedProfile .ibm-review:nth-child(n+1) .ibm-brand-icon {
    top: 1px !important;
    right: 1px !important;
    width: 61px !important;
    height: 61px !important;
    min-width: 61px !important;
    min-height: 61px !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
    transform: none !important;
  }
  #mobileImportedProfile .ibm-review:nth-child(n+1) .ibm-brand-icon img {
    display: block !important;
    width: 61px !important;
    height: 61px !important;
    object-fit: fill !important;
    border-radius: 0 !important;
  }

  /* Bring the brand identity stack down to the reference baseline. */
  #mobileImportedProfile .ibm-review-center {
    transform: translateY(2px) !important;
  }
  #mobileImportedProfile .ibm-brand-name strong {
    font-size: 10.2px !important;
  }

  /* The rating stars are a touch wider and one pixel lower. */
  #mobileImportedProfile .ibm-review-meta .ibm-review-stars {
    width: 65px !important;
    margin-top: 1px !important;
    transform: translate(1px, 1px) !important;
  }
  #mobileImportedProfile .ibm-review-meta {
    height: 70px !important;
  }

  /* Restore the external-link glyph and the reference's two-line profile link position. */
  #mobileImportedProfile .ibm-profile-link {
    width: 70px !important;
    height: 26px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0 !important;
    font-size: 9.8px !important;
    line-height: 13px !important;
    transform: translateX(-2px) !important;
  }
  #mobileImportedProfile .ibm-profile-link-line {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 2px !important;
    direction: rtl !important;
    white-space: nowrap !important;
    line-height: 13px !important;
  }
  #mobileImportedProfile .ibm-profile-link-line svg {
    display: block !important;
    width: 11px !important;
    height: 11px !important;
    flex: 0 0 11px !important;
  }
  #mobileImportedProfile .ibm-profile-link-bottom {
    display: block !important;
    line-height: 13px !important;
  }
}

@media (max-width: 390px) {
  #mobileImportedProfile .ibm-review:nth-child(n+1) .ibm-brand-icon,
  #mobileImportedProfile .ibm-review:nth-child(n+1) .ibm-brand-icon img {
    width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;
  }
}