/* Authored Unbeatable achievement cosmetics.
   This file is injected after the shared cosmetics styles so the supplied
   artwork replaces the legacy purple CSS ring and gradient on profile/public/
   match/Campaign surfaces. The global header owns its frame paint in
   profile-nav.css. */

.cosmetic-profile-preview[data-banner="banner-unbeatable"] .cosmetic-profile-banner,
.cosmetic-mini-preview[data-banner="banner-unbeatable"] .cosmetic-mini-banner{
  background:url('/assets/cosmetics/banners/unbeatable.webp') center / cover no-repeat
}
.public-profile-head:has(.cosmetic-profile-preview[data-banner="banner-unbeatable"])::before{
  background:url('/assets/cosmetics/banners/unbeatable.webp') center / cover no-repeat
}

.cosmetic-profile-preview[data-frame="frame-unbeatable"] .cosmetic-profile-avatar,
.cosmetic-mini-preview[data-frame="frame-unbeatable"] .cosmetic-mini-avatar,
.match-shell-avatar[data-frame="frame-unbeatable"],
.campaign-route-runner[data-frame="frame-unbeatable"]{
  overflow:visible!important;
  border-color:transparent;
  box-shadow:none;
  isolation:isolate
}
.public-player-avatar[data-frame="frame-unbeatable"]{
  overflow:visible!important;
  border-color:transparent;
  box-shadow:none;
  position:relative;
  isolation:auto
}

.cosmetic-profile-preview[data-frame="frame-unbeatable"] .cosmetic-profile-avatar::after,
.cosmetic-mini-preview[data-frame="frame-unbeatable"] .cosmetic-mini-avatar::after,
.match-shell-avatar[data-frame="frame-unbeatable"]::after,
.campaign-route-runner[data-frame="frame-unbeatable"]::after{
  content:"";
  position:absolute;
  inset:-28%;
  z-index:3;
  background:url('/assets/cosmetics/frames/unbeatable.webp') center / contain no-repeat;
  pointer-events:none
}
.public-player-avatar[data-frame="frame-unbeatable"]::after{
  content:"";
  position:absolute;
  inset:-28%;
  z-index:auto;
  background:url('/assets/cosmetics/frames/unbeatable.webp') center / contain no-repeat;
  pointer-events:none
}

.cosmetic-profile-preview[data-frame="frame-unbeatable"] .cosmetic-profile-avatar img,
.cosmetic-mini-preview[data-frame="frame-unbeatable"] .cosmetic-mini-avatar img,
.match-shell-avatar[data-frame="frame-unbeatable"] img,
.campaign-route-runner[data-frame="frame-unbeatable"] img{
  position:relative;
  z-index:1;
  border-radius:50%
}