/* PROFILE-INSTANT-SKELETON-V1 */

#tab-player .profile-skeleton-v1{
  width:100%;
}

#tab-player .pskel-block{
  position:relative;
  overflow:hidden;

  background:
    rgba(255,255,255,.045);

  border-radius:5px;
}

#tab-player .pskel-block::after{
  content:"";

  position:absolute;
  inset:0;

  transform:translateX(-100%);

  background:
    linear-gradient(
      90deg,
      transparent,
      rgba(255,255,255,.055),
      transparent
    );

  animation:
    pskel-shimmer 1.35s ease-in-out infinite;
}

@keyframes pskel-shimmer{
  100%{
    transform:translateX(100%);
  }
}


/* breadcrumb */
#tab-player .pskel-breadcrumb{
  height:18px;

  display:flex;
  align-items:center;
  gap:9px;

  margin-bottom:18px;
}

#tab-player .pskel-breadcrumb .pskel-block:nth-child(1){
  width:112px;
  height:10px;
}

#tab-player .pskel-breadcrumb .pskel-block:nth-child(2){
  width:48px;
  height:10px;
}

#tab-player .pskel-breadcrumb .pskel-block:nth-child(3){
  width:105px;
  height:10px;
}


/* hero */
#tab-player .pskel-hero{
  min-height:235px;

  display:grid;
  grid-template-columns:minmax(0,1fr) 290px;
  gap:30px;
  align-items:center;

  padding:30px;
  margin-bottom:14px;

  border:1px solid var(--border);

  background:
    radial-gradient(
      circle at 78% 0%,
      rgba(0,229,255,.035),
      transparent 34%
    ),
    linear-gradient(
      135deg,
      #0c1119,
      #080d14 65%,
      #08131a
    );
}

#tab-player .pskel-identity{
  display:flex;
  align-items:center;
  gap:22px;
}

#tab-player .pskel-avatar-wrap{
  width:112px;
  flex:0 0 112px;
}

#tab-player .pskel-avatar{
  width:112px;
  height:112px;

  border-radius:2px;
}

#tab-player .pskel-social{
  width:66px;
  height:28px;

  margin:8px auto 0;

  border-radius:16px;
}

#tab-player .pskel-main{
  width:min(430px,100%);
}

#tab-player .pskel-name{
  width:220px;
  max-width:75%;
  height:31px;

  margin-bottom:13px;
}

#tab-player .pskel-steamid{
  width:150px;
  height:10px;

  margin-bottom:20px;
}

#tab-player .pskel-meta{
  display:grid;
  gap:10px;
}

#tab-player .pskel-meta .pskel-block{
  width:190px;
  height:10px;
}

#tab-player .pskel-meta .pskel-block:nth-child(2){
  width:230px;
}

#tab-player .pskel-meta .pskel-block:nth-child(3){
  width:205px;
}

#tab-player .pskel-rating{
  min-height:178px;
  height:auto;

  padding:20px 22px;

  border:1px solid rgba(255,255,255,.05);

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

#tab-player .pskel-rating .pskel-block:nth-child(1){
  width:86px;
  height:9px;

  margin-bottom:14px;
}

#tab-player .pskel-rating .pskel-block:nth-child(2){
  width:104px;
  height:38px;

  margin-bottom:16px;
}

#tab-player .pskel-rating .pskel-block:nth-child(3){
  width:100%;
  height:7px;

  margin-bottom:16px;
}

#tab-player .pskel-rating-bottom{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}

#tab-player .pskel-rating-bottom .pskel-block{
  width:100%;
  height:29px;
}


/* large profile sections */
#tab-player .pskel-row{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:14px;

  margin-bottom:14px;
}

#tab-player .pskel-card{
  min-height:154px;

  padding:20px;

  border:1px solid var(--border);

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

#tab-player .pskel-card-title{
  width:130px;
  height:11px;

  margin-bottom:22px;
}

#tab-player .pskel-card-line{
  width:100%;
  height:9px;

  margin-bottom:13px;
}

#tab-player .pskel-card-line.short{
  width:61%;
}

#tab-player .pskel-chart{
  min-height:250px;

  padding:20px;

  margin-bottom:14px;

  border:1px solid var(--border);

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

#tab-player .pskel-chart .pskel-card-title{
  width:170px;
}

#tab-player .pskel-chart-area{
  width:100%;
  height:168px;

  margin-top:22px;

  border-radius:3px;
}

#tab-player .pskel-tabs{
  min-height:54px;

  display:flex;
  align-items:center;
  gap:22px;

  padding:0 18px;

  border:1px solid var(--border);

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

#tab-player .pskel-tabs .pskel-block{
  width:80px;
  height:10px;
}

#tab-player .pskel-tabs .pskel-block:nth-child(2){
  width:95px;
}


/* reserve social/account geometry after real render */
#tab-player .profile-social-row-v1{
  min-height:35px;
}

#tab-player #profile-account-connect-v1:not(:empty){
  min-height:54px;
}


@media(max-width:1000px){
  #tab-player .pskel-hero{
    grid-template-columns:1fr;
  }

  #tab-player .pskel-rating{
    min-height:150px;
  }
}

@media(max-width:700px){
  #tab-player .pskel-hero{
    padding:20px;
  }

  #tab-player .pskel-identity{
    align-items:flex-start;
  }

  #tab-player .pskel-avatar-wrap{
    width:86px;
    flex-basis:86px;
  }

  #tab-player .pskel-avatar{
    width:86px;
    height:86px;
  }

  #tab-player .pskel-row{
    grid-template-columns:1fr;
  }
}

@media(prefers-reduced-motion:reduce){
  #tab-player .pskel-block::after{
    animation:none;
  }
}