/*
 * FACEIT-like identity polish.
 * This intentionally overrides V4/V5 where needed.
 */

#tab-player .profile-main{
  justify-content:center;
}

#tab-player .profile-name{
  margin-bottom:0;
}


/* discreet, selectable SteamID */

#tab-player .profile-steamid-copy{
  margin-top:2px;

  color:#66717e;

  font-size:11px;
  font-weight:400;
  line-height:1.25;

  letter-spacing:.01em;

  cursor:text;

  user-select:text;
  -webkit-user-select:text;
}


/* tighter metadata */

#tab-player .profile-meta-stack{
  gap:2px;
  margin-top:7px;
}

#tab-player .profile-meta-row{
  min-height:0;

  gap:5px;

  font-size:12px;
  font-weight:400;
  line-height:1.35;
}

#tab-player .profile-meta-label{
  color:#818c98;
  font-weight:400;
}

#tab-player .profile-meta-value{
  color:#c6ced7;
  font-weight:450;
}


/* FACEIT-like 24x16 flag */

#tab-player .profile-location-line{
  display:flex;

  align-items:center;

  gap:8px;

  min-height:18px;
  margin-top:2px;

  color:#c8d0d8;

  font-size:12px;
  font-weight:450;
  line-height:16px;
}

#tab-player .profile-flag-faceit{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  width:24px;
  height:16px;

  min-width:24px;
  min-height:16px;

  overflow:hidden;

  border-radius:4px;

  box-shadow:
    0 0 0 1px rgba(255,255,255,.07);

  flex:0 0 24px;
}

#tab-player .profile-flag-faceit > img{
  display:block !important;

  width:100% !important;
  height:100% !important;

  min-width:100% !important;
  max-width:none !important;

  object-fit:cover !important;
  object-position:center !important;

  margin:0 !important;
  padding:0 !important;

  border:0 !important;
  border-radius:0 !important;
}


/* exact filled Steam glyph — no inherited SVG stroke */

#tab-player .profile-steam-brand{
  display:inline-flex;

  align-items:center;
  justify-content:center;

  width:24px;
  height:24px;

  margin-top:4px;
  padding:0;

  color:#858f9b;

  background:none !important;
  border:0 !important;
  border-radius:0 !important;

  text-decoration:none;

  transition:color .15s ease;
}

#tab-player .profile-steam-brand:hover{
  color:#dce3ea;

  background:none !important;

  transform:none;
}

#tab-player .profile-steam-brand svg{
  display:block;

  width:24px !important;
  height:24px !important;

  fill:none !important;
  stroke:none !important;

  overflow:visible;
}

#tab-player .profile-steam-brand svg path{
  fill:currentColor !important;
  stroke:none !important;
}


/* LEVEL / POINTS / SYNC */

#tab-player .profile-rating{
  display:grid !important;

  grid-template-columns:
    repeat(3,minmax(155px,1fr));

  gap:10px;

  align-items:stretch;
}

#tab-player .profile-rating-card{
  min-width:0;
}

#tab-player .profile-points-progress{
  width:100%;
  margin-top:12px;
}

#tab-player .profile-card-progress-track{
  width:100%;
  height:4px;

  overflow:hidden;

  border-radius:999px;

  background:rgba(255,255,255,.075);
}

#tab-player .profile-card-progress-fill{
  height:100%;

  border-radius:inherit;

  transition:width .25s ease;
}

#tab-player .profile-progress-copy{
  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:12px;

  margin-top:6px;

  color:#66727f;

  font-size:10px;
  font-weight:400;
  line-height:1.2;

  font-variant-numeric:tabular-nums;
}

#tab-player .profile-sync-value{
  margin-top:6px;

  color:#e1e7ed;

  font-size:29px;
  font-weight:600;
  line-height:1;

  font-variant-numeric:tabular-nums;
}

#tab-player .profile-sync-value span{
  margin-left:2px;

  color:#7e8995;

  font-size:15px;
  font-weight:400;
}

#tab-player .profile-sync-track{
  margin-top:17px;
}

#tab-player .profile-sync-fill{
  background:var(--accent);
}


/* the old league indicator must never return */

#tab-player .profile-league-line,
#tab-player .profile-league-dot{
  display:none !important;
}


@media(max-width:720px){

  #tab-player .profile-rating{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  #tab-player .profile-sync-card{
    grid-column:1 / -1;
  }
}


@media(max-width:480px){

  #tab-player .profile-rating{
    grid-template-columns:1fr;
  }

  #tab-player .profile-sync-card{
    grid-column:auto;
  }
}