/* =========================================================
   GILDONGSEKKI MVP PAGE V2
========================================================= */

.mvp-page{
  min-height:70vh;
}


/* =========================================================
   RANKING WRAP
========================================================= */

.mvp-ranking-shell{
  width:
    min(1120px,calc(100% - 40px));

  margin:
    34px auto 78px;

  padding:
    38px 34px 32px;

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

  border-radius:
    28px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.055),
      rgba(255,255,255,.025)
    );

  box-shadow:
    0 24px 70px
    rgba(0,0,0,.16);

  overflow:hidden;
}


.mvp-ranking-head{
  text-align:center;

  margin-bottom:34px;
}


.mvp-ranking-head small{
  display:block;

  margin-bottom:8px;

  font-size:11px;
  font-weight:900;

  letter-spacing:.20em;

  opacity:.52;
}


.mvp-ranking-head h2{
  margin:0;

  font-size:
    clamp(27px,3.3vw,42px);

  line-height:1.2;
}


.mvp-ranking-head p{
  margin:
    13px auto 0;

  max-width:580px;

  font-size:14px;
  line-height:1.75;

  opacity:.62;
}


/* =========================================================
   LOADING / ERROR
========================================================= */

.mvp-loading{
  min-height:260px;

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

  text-align:center;

  font-size:14px;

  opacity:.58;
}


.mvp-loading.is-error{
  color:#ff8f98;
  opacity:.9;
}


/* =========================================================
   TOP 3
========================================================= */

.mvp-podium{
  display:grid;

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

  gap:16px;

  align-items:end;

  margin-bottom:18px;
}


.mvp-podium-card{
  position:relative;

  min-width:0;

  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;

  padding:
    30px 18px 25px;

  text-align:center;

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

  border-radius:22px;

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

  overflow:hidden;
}


.mvp-podium-card::before{
  content:"";

  position:absolute;

  inset:0;

  pointer-events:none;

  opacity:.55;
}


.mvp-podium-card.mvp-rank-1{
  min-height:248px;

  transform:
    translateY(-10px);

  border-color:
    rgba(255,215,102,.42);

  background:
    linear-gradient(
      180deg,
      rgba(255,215,102,.13),
      rgba(255,255,255,.035)
    );

  box-shadow:
    0 18px 44px
    rgba(0,0,0,.18);
}


.mvp-podium-card.mvp-rank-2{
  min-height:216px;

  border-color:
    rgba(215,224,240,.26);

  background:
    linear-gradient(
      180deg,
      rgba(215,224,240,.085),
      rgba(255,255,255,.03)
    );
}


.mvp-podium-card.mvp-rank-3{
  min-height:206px;

  border-color:
    rgba(218,151,108,.27);

  background:
    linear-gradient(
      180deg,
      rgba(218,151,108,.085),
      rgba(255,255,255,.03)
    );
}


.mvp-podium-rank{
  width:58px;
  height:58px;

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

  margin-bottom:13px;

  border-radius:50%;

  font-size:26px;
  font-weight:950;

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

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


.mvp-rank-1 .mvp-podium-rank{
  width:70px;
  height:70px;

  font-size:32px;

  color:#fff3bc;

  background:
    rgba(255,215,102,.13);

  border-color:
    rgba(255,215,102,.34);
}


.mvp-rank-2 .mvp-podium-rank{
  color:#e6ebf5;
}


.mvp-rank-3 .mvp-podium-rank{
  color:#e2b394;
}


.mvp-podium-crown{
  margin-bottom:8px;

  font-size:10px;
  font-weight:950;

  letter-spacing:.16em;

  opacity:.48;
}


.mvp-supporter-name{
  display:block;

  max-width:100%;

  overflow:hidden;

  text-overflow:ellipsis;

  white-space:nowrap;

  font-size:18px;
  font-weight:900;

  line-height:1.4;
}


.mvp-rank-1 .mvp-supporter-name{
  font-size:21px;
}


/* =========================================================
   SUPPORTER META
========================================================= */

.mvp-supporter-meta{
  min-width:0;

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

  gap:8px;

  margin-top:8px;

  font-size:11px;

  opacity:.53;
}


.mvp-supporter-meta span{
  min-width:0;
}


.mvp-supporter-id{
  overflow:hidden;

  text-overflow:ellipsis;

  white-space:nowrap;
}


.mvp-supporter-members::before{
  content:"";

  display:inline-block;

  width:3px;
  height:3px;

  margin:
    0 7px 2px 0;

  border-radius:50%;

  background:
    currentColor;
}


/* =========================================================
   4 ~ 10
========================================================= */

.mvp-rank-list{
  display:flex;
  flex-direction:column;

  gap:8px;
}


.mvp-rank-row{
  min-width:0;

  display:grid;

  grid-template-columns:
    52px minmax(0,1fr) auto;

  align-items:center;

  gap:16px;

  min-height:76px;

  padding:
    10px 18px;

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

  border-radius:17px;

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

  transition:
    transform .16s ease,
    background .16s ease,
    border-color .16s ease;
}


.mvp-rank-row:hover{
  transform:
    translateY(-1px);

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

  border-color:
    rgba(255,255,255,.13);
}


.mvp-rank-number{
  width:42px;
  height:42px;

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

  border-radius:50%;

  font-size:14px;
  font-weight:950;

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


.mvp-rank-info{
  min-width:0;
}


.mvp-rank-info
.mvp-supporter-meta{
  justify-content:flex-start;

  margin-top:4px;
}


.mvp-rank-badge{
  flex:0 0 auto;

  padding:
    7px 10px;

  border-radius:999px;

  font-size:10px;
  font-weight:900;

  letter-spacing:.08em;

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

  opacity:.52;
}


/* =========================================================
   FOOT
========================================================= */

.mvp-ranking-foot{
  margin-top:22px;

  text-align:center;

  font-size:11px;
  line-height:1.7;

  opacity:.42;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:760px){

  .mvp-ranking-shell{
    width:
      calc(100% - 24px);

    margin:
      18px auto 48px;

    padding:
      26px 14px 22px;

    border-radius:22px;
  }


  .mvp-ranking-head{
    margin-bottom:28px;
  }


  .mvp-ranking-head p{
    font-size:13px;
  }


  .mvp-podium{
    grid-template-columns:
      repeat(3,minmax(0,1fr));

    gap:7px;

    margin-bottom:14px;
  }


  .mvp-podium-card{
    min-height:172px;

    padding:
      20px 7px 17px;

    border-radius:15px;
  }


  .mvp-podium-card.mvp-rank-1{
    min-height:194px;

    transform:
      translateY(-7px);
  }


  .mvp-podium-card.mvp-rank-2,
  .mvp-podium-card.mvp-rank-3{
    min-height:168px;
  }


  .mvp-podium-rank{
    width:45px;
    height:45px;

    margin-bottom:9px;

    font-size:20px;
  }


  .mvp-rank-1 .mvp-podium-rank{
    width:54px;
    height:54px;

    font-size:25px;
  }


  .mvp-podium-crown{
    font-size:8px;
  }


  .mvp-supporter-name{
    font-size:13px;
  }


  .mvp-rank-1
  .mvp-supporter-name{
    font-size:14px;
  }


  .mvp-podium-card
  .mvp-supporter-meta{
    display:block;

    width:100%;

    margin-top:6px;

    font-size:9px;
  }


  .mvp-podium-card
  .mvp-supporter-members{
    display:block;

    margin-top:3px;
  }


  .mvp-podium-card
  .mvp-supporter-members::before{
    display:none;
  }


  .mvp-rank-row{
    grid-template-columns:
      42px minmax(0,1fr);

    gap:10px;

    min-height:70px;

    padding:
      9px 11px;
  }


  .mvp-rank-number{
    width:36px;
    height:36px;

    font-size:13px;
  }


  .mvp-rank-info
  .mvp-supporter-name{
    font-size:14px;
  }


  .mvp-rank-info
  .mvp-supporter-meta{
    font-size:9px;

    gap:5px;
  }


  .mvp-rank-badge{
    display:none;
  }

}


@media(max-width:430px){

  .mvp-podium{
    gap:5px;
  }


  .mvp-podium-card{
    padding-left:4px;
    padding-right:4px;
  }


  .mvp-supporter-id{
    max-width:88px;
  }

}


/* =========================================================
   MVP V3 - SITE CARD / PROFILE / TOP BORDER
========================================================= */

/*
 * 외곽은 사이트 공통 gs-depth-content-card가 담당.
 * MVP 고유 외곽 디자인은 제거한다.
 */
.mvp-ranking-shell.gs-depth-content-card{
  position:relative;
}


/* 후원 멤버 정보 / 중복 TOP 배지 숨김 */

.mvp-supporter-members,
.mvp-rank-badge{
  display:none !important;
}


/* =========================================================
   TOP 3 CARD
========================================================= */

.mvp-podium-card{
  background:
    linear-gradient(
      145deg,
      #ffffff 0%,
      #fffdf8 100%
    );

  border:
    1px solid
    rgba(173,150,103,.20);

  box-shadow:
    0 12px 28px
    rgba(65,57,41,.07);
}


/* 1위 GOLD */

.mvp-podium-card.mvp-rank-1{
  border:
    2px solid
    rgba(190,145,42,.78) !important;

  background:
    linear-gradient(
      145deg,
      #fffdf5,
      #fff7df
    ) !important;

  box-shadow:
    0 18px 38px
      rgba(151,112,25,.16),

    inset 0 0 0 4px
      rgba(255,244,204,.72) !important;
}


/* 2위 SILVER */

.mvp-podium-card.mvp-rank-2{
  border:
    2px solid
    rgba(157,166,180,.68) !important;

  background:
    linear-gradient(
      145deg,
      #ffffff,
      #f3f5f8
    ) !important;

  box-shadow:
    inset 0 0 0 4px
    rgba(231,235,241,.72) !important;
}


/* 3위 BRONZE */

.mvp-podium-card.mvp-rank-3{
  border:
    2px solid
    rgba(176,112,73,.70) !important;

  background:
    linear-gradient(
      145deg,
      #fffdfb,
      #f8ebe2
    ) !important;

  box-shadow:
    inset 0 0 0 4px
    rgba(242,218,202,.72) !important;
}


/* 내부 이중 프레임 */

.mvp-podium-card.mvp-rank-1::after,
.mvp-podium-card.mvp-rank-2::after,
.mvp-podium-card.mvp-rank-3::after{
  content:"";

  position:absolute;

  inset:7px;

  border-radius:
    16px;

  pointer-events:none;
}


.mvp-podium-card.mvp-rank-1::after{
  border:
    1px solid
    rgba(190,145,42,.30);
}

.mvp-podium-card.mvp-rank-2::after{
  border:
    1px solid
    rgba(157,166,180,.28);
}

.mvp-podium-card.mvp-rank-3::after{
  border:
    1px solid
    rgba(176,112,73,.28);
}


/* =========================================================
   PROFILE
========================================================= */

.mvp-profile-avatar{
  position:relative;

  z-index:2;

  width:72px;
  height:72px;

  flex:0 0 auto;

  display:flex;

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

  overflow:hidden;

  border-radius:50%;

  margin:
    0 0 12px;

  border:
    3px solid #fff;

  background:#f0ede7;

  box-shadow:
    0 5px 18px
    rgba(52,45,34,.14);

  text-decoration:none;

  color:#63594b;

  font-size:22px;
  font-weight:900;
}


.mvp-profile-avatar img{
  width:100%;
  height:100%;

  display:block;

  object-fit:cover;
}


.mvp-rank-1
.mvp-profile-avatar{
  width:88px;
  height:88px;

  border-color:#fff8dc;

  box-shadow:
    0 0 0 2px
      rgba(190,145,42,.48),

    0 8px 22px
      rgba(128,91,17,.16);
}


.mvp-rank-2
.mvp-profile-avatar{
  box-shadow:
    0 0 0 2px
      rgba(157,166,180,.42),

    0 6px 18px
      rgba(60,65,75,.12);
}


.mvp-rank-3
.mvp-profile-avatar{
  box-shadow:
    0 0 0 2px
      rgba(176,112,73,.42),

    0 6px 18px
      rgba(90,54,34,.12);
}


/* =========================================================
   4 ~ 10
========================================================= */

.mvp-rank-row{
  grid-template-columns:
    52px 48px
    minmax(0,1fr)
    auto !important;

  background:#fff;

  border:
    1px solid
    rgba(173,150,103,.18);

  box-shadow:
    0 5px 16px
    rgba(65,57,41,.04);
}


.mvp-rank-row
.mvp-profile-avatar{
  width:44px;
  height:44px;

  margin:0;

  border-width:2px;

  font-size:15px;
}


/* =========================================================
   STATION LINK
========================================================= */

.mvp-station-link{
  position:relative;

  z-index:3;

  display:inline-flex;

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

  min-width:68px;
  height:34px;

  padding:
    0 14px;

  border:
    1px solid
    rgba(173,150,103,.32);

  border-radius:999px;

  background:
    linear-gradient(
      145deg,
      #fffdf8,
      #f5ecdc
    );

  color:#514737;

  font-size:12px;
  font-weight:800;

  text-decoration:none;

  transition:
    transform .15s ease,
    box-shadow .15s ease;
}


.mvp-station-link:hover{
  transform:
    translateY(-1px);

  box-shadow:
    0 5px 13px
    rgba(85,66,34,.12);
}


.mvp-podium-card
.mvp-station-link{
  margin-top:17px;
}


/* =========================================================
   MOBILE
========================================================= */

@media(max-width:760px){

  .mvp-rank-row{
    grid-template-columns:
      36px 40px
      minmax(0,1fr)
      auto !important;

    gap:8px;
  }


  .mvp-rank-row
  .mvp-profile-avatar{
    width:38px;
    height:38px;
  }


  .mvp-station-link{
    min-width:54px;
    height:30px;

    padding:
      0 9px;

    font-size:10px;
  }


  .mvp-podium-card
  .mvp-profile-avatar{
    width:56px;
    height:56px;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{
    width:66px;
    height:66px;
  }

}


/* =========================================================
   MVP V4 - COMMON PAGE WIDTH ALIGNMENT
   기존 서브페이지와 동일한 section > functional-wrap 구조.
   외곽 폭은 functional-wrap이 담당하고
   gs-depth-content-card는 부모 폭을 그대로 사용한다.
========================================================= */

.mvp-ranking-section{
  box-sizing:border-box;

  padding:
    28px 0 48px;
}


.mvp-ranking-section > .functional-wrap{
  box-sizing:border-box;

  width:
    min(1180px,calc(100% - 48px)) !important;

  max-width:
    1180px !important;

  margin:
    0 auto !important;
}


.mvp-ranking-shell.gs-depth-content-card{
  width:100% !important;

  max-width:none !important;

  margin:
    0 auto !important;
}


@media(max-width:760px){

  .mvp-ranking-section{
    padding:
      18px 0 34px;
  }

}



/* =========================================================
   MVP V6 - DESKTOP DENSITY
   페이지 규격 정리 후 랭킹 콘텐츠 크기 축소.
   색상 / 프레임 / 데이터 구조는 변경하지 않는다.
========================================================= */

@media(min-width:761px){

  /* 공통 카드 외형은 유지하고 MVP 내부 여백만 축소 */
  .mvp-ranking-shell.gs-depth-content-card{
    padding:
      clamp(28px,2.4vw,34px) !important;
  }


  /* 상단 제목 영역 */
  .mvp-ranking-head{
    margin-bottom:
      24px;
  }

  .mvp-ranking-head h2{
    font-size:
      clamp(25px,2.6vw,34px);
  }

  .mvp-ranking-head p{
    margin-top:
      10px;

    line-height:
      1.65;
  }


  /* TOP 3 전체 */
  .mvp-podium{
    gap:
      14px;

    margin-bottom:
      14px;
  }


  /* 2위 / 3위 기준 높이 */
  .mvp-podium-card,
  .mvp-podium-card.mvp-rank-2,
  .mvp-podium-card.mvp-rank-3{
    min-height:
      198px !important;

    padding:
      22px 16px 18px !important;
  }


  /* 1위만 약간 더 크게 */
  .mvp-podium-card.mvp-rank-1{
    min-height:
      220px !important;

    padding:
      22px 16px 18px !important;

    transform:
      translateY(-8px);
  }


  /* 방송국 버튼과 프로필 사이 간격 축소 */
  .mvp-podium-card
  .mvp-station-link{
    margin-top:
      12px;
  }


  /* 4 ~ 10위 */
  .mvp-rank-list{
    gap:
      8px;
  }

  .mvp-rank-row{
    grid-template-columns:
      46px 46px
      minmax(0,1fr)
      auto !important;

    gap:
      10px !important;

    min-height:
      66px !important;

    padding:
      8px 12px !important;
  }


  .mvp-rank-number{
    width:
      36px;

    height:
      36px;

    font-size:
      13px;
  }


  .mvp-ranking-foot{
    margin-top:
      16px;
  }

}



/* =========================================================
   MVP V7 - RENDER STATE / FINAL DATA STRUCTURE
========================================================= */

.mvp-loading[hidden],
.mvp-podium[hidden],
.mvp-rank-list[hidden],
.mvp-ranking-foot[hidden]{
  display:none !important;
}


.mvp-loading{
  min-height:100px;
}


.mvp-profile-fallback{
  display:flex;
  width:100%;
  height:100%;

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

  font:inherit;
  color:inherit;
}




/* =========================================================
   MVP V9 - HONOR PODIUM
   TOP3 고급 명예 프레임
========================================================= */

@media(min-width:761px){

  /* TOP3 전체 영역 */
  .mvp-podium{
    position:relative;
    align-items:end;

    gap:18px;

    margin-top:10px;
    margin-bottom:22px;

    padding:
      20px 6px 6px;
  }


  /* 공통 TOP3 카드 */
  .mvp-podium-card{
    isolation:isolate;

    min-height:228px !important;

    padding:
      30px 20px 22px !important;

    border-radius:
      20px !important;

    overflow:visible;

    transition:
      transform .2s ease,
      box-shadow .2s ease;
  }


  /*
   * 외곽 금속 프레임
   */
  .mvp-podium-card::before{
    content:"";

    position:absolute;

    z-index:-2;

    inset:-5px;

    border-radius:24px;

    pointer-events:none;

    opacity:1;
  }


  /*
   * 내부 장식선
   */
  .mvp-podium-card::after{
    content:"";

    position:absolute;

    z-index:-1;

    inset:8px;

    border-radius:14px;

    pointer-events:none;
  }


  /* =====================================================
     1위
  ===================================================== */

  .mvp-podium-card.mvp-rank-1{
    min-height:254px !important;

    transform:
      translateY(-14px);

    border:
      1px solid
      rgba(157,111,19,.78) !important;

    background:
      radial-gradient(
        circle at 50% 12%,
        rgba(255,247,205,.95) 0,
        rgba(255,247,205,0) 31%
      ),
      linear-gradient(
        160deg,
        #fffef8 0%,
        #fff9e7 44%,
        #f9edc7 100%
      ) !important;

    box-shadow:
      0 23px 42px
        rgba(126,91,19,.17),

      0 8px 18px
        rgba(84,61,13,.09),

      inset 0 1px 0
        rgba(255,255,255,.98) !important;
  }


  .mvp-podium-card.mvp-rank-1::before{
    background:
      linear-gradient(
        135deg,
        #6e4b0f 0%,
        #c28e27 13%,
        #f4d77c 29%,
        #9c6c16 47%,
        #f6df91 64%,
        #b47e20 82%,
        #6d490e 100%
      );

    box-shadow:
      0 0 0 1px
        rgba(102,69,12,.30),

      0 10px 28px
        rgba(166,118,22,.16);
  }


  .mvp-podium-card.mvp-rank-1::after{
    border:
      1px solid
      rgba(174,128,33,.48);

    box-shadow:
      inset 0 0 0 3px
        rgba(255,249,222,.72);
  }


  /* 1위 순위 메달 */
  .mvp-rank-1
  .mvp-podium-rank{
    position:relative;

    width:62px;
    height:62px;

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

    margin:
      -54px auto 17px;

    border:
      1px solid
      rgba(105,71,11,.70);

    border-radius:50%;

    background:
      radial-gradient(
        circle at 34% 28%,
        #fff8d6 0 13%,
        #efd276 32%,
        #b27c1d 66%,
        #754b09 100%
      );

    box-shadow:
      0 0 0 5px #fffaf0,
      0 0 0 7px rgba(178,124,29,.48),
      0 8px 18px rgba(102,70,13,.20);

    color:#fffdf2;

    font-family:Georgia,serif;
    font-size:27px;
    font-weight:700;

    text-shadow:
      0 1px 2px rgba(71,45,6,.40);
  }


  /* =====================================================
     2위
  ===================================================== */

  .mvp-podium-card.mvp-rank-2{
    border:
      1px solid
      rgba(126,135,149,.70) !important;

    background:
      radial-gradient(
        circle at 50% 10%,
        rgba(242,246,251,.95) 0,
        rgba(242,246,251,0) 30%
      ),
      linear-gradient(
        155deg,
        #ffffff 0%,
        #f6f7f8 50%,
        #e9edf1 100%
      ) !important;

    box-shadow:
      0 17px 34px
        rgba(77,87,101,.12),

      inset 0 1px 0
        rgba(255,255,255,.98) !important;
  }


  .mvp-podium-card.mvp-rank-2::before{
    background:
      linear-gradient(
        135deg,
        #747d89 0%,
        #cdd3db 18%,
        #f4f6f8 34%,
        #959eaa 52%,
        #e2e6eb 70%,
        #838d99 100%
      );
  }


  .mvp-podium-card.mvp-rank-2::after{
    border:
      1px solid
      rgba(135,145,158,.40);

    box-shadow:
      inset 0 0 0 3px
        rgba(255,255,255,.75);
  }


  .mvp-rank-2
  .mvp-podium-rank{
    width:54px;
    height:54px;

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

    margin:
      -42px auto 17px;

    border-radius:50%;

    background:
      radial-gradient(
        circle at 34% 27%,
        #ffffff 0 13%,
        #dbe0e5 35%,
        #9ca6b2 69%,
        #69727e 100%
      );

    box-shadow:
      0 0 0 5px #fff,
      0 0 0 7px rgba(139,149,160,.40),
      0 7px 16px rgba(74,84,96,.16);

    color:#fff;

    font-family:Georgia,serif;
    font-size:23px;
    font-weight:700;
  }


  /* =====================================================
     3위
  ===================================================== */

  .mvp-podium-card.mvp-rank-3{
    border:
      1px solid
      rgba(155,93,57,.68) !important;

    background:
      radial-gradient(
        circle at 50% 10%,
        rgba(255,239,229,.88) 0,
        rgba(255,239,229,0) 30%
      ),
      linear-gradient(
        155deg,
        #fffdfb 0%,
        #f9eee7 50%,
        #efd9cb 100%
      ) !important;

    box-shadow:
      0 17px 34px
        rgba(112,67,43,.12),

      inset 0 1px 0
        rgba(255,255,255,.98) !important;
  }


  .mvp-podium-card.mvp-rank-3::before{
    background:
      linear-gradient(
        135deg,
        #844c2e 0%,
        #c98c68 19%,
        #f1c8ad 35%,
        #a86845 53%,
        #dfac8c 71%,
        #82492b 100%
      );
  }


  .mvp-podium-card.mvp-rank-3::after{
    border:
      1px solid
      rgba(167,101,63,.38);

    box-shadow:
      inset 0 0 0 3px
        rgba(255,248,243,.75);
  }


  .mvp-rank-3
  .mvp-podium-rank{
    width:54px;
    height:54px;

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

    margin:
      -42px auto 17px;

    border-radius:50%;

    background:
      radial-gradient(
        circle at 34% 27%,
        #ffe5d5 0 13%,
        #d79d79 35%,
        #a45f3d 69%,
        #713b24 100%
      );

    box-shadow:
      0 0 0 5px #fffaf7,
      0 0 0 7px rgba(166,100,62,.38),
      0 7px 16px rgba(102,57,34,.16);

    color:#fffaf6;

    font-family:Georgia,serif;
    font-size:23px;
    font-weight:700;
  }


  /* =====================================================
     프로필
  ===================================================== */

  .mvp-podium-card
  .mvp-profile-avatar{
    width:76px;
    height:76px;

    margin-bottom:13px;

    border-width:4px;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{
    width:92px;
    height:92px;

    border-color:#fff9dc;

    box-shadow:
      0 0 0 2px rgba(166,116,22,.48),
      0 9px 22px rgba(102,70,13,.17);
  }


  /* =====================================================
     텍스트
  ===================================================== */

  .mvp-podium-crown{
    margin-bottom:7px;

    font-size:10px;
    font-weight:900;

    letter-spacing:.18em;
  }


  .mvp-rank-1
  .mvp-podium-crown{
    color:#9a6b14;
  }


  .mvp-rank-2
  .mvp-podium-crown{
    color:#7b8591;
  }


  .mvp-rank-3
  .mvp-podium-crown{
    color:#a56644;
  }


  .mvp-podium-card
  .mvp-supporter-name{
    position:relative;
    z-index:2;

    font-size:17px;
    font-weight:900;

    color:#28362d;
  }


  .mvp-rank-1
  .mvp-supporter-name{
    font-size:19px;
  }


  .mvp-podium-card
  .mvp-supporter-id{
    font-size:11px;

    opacity:.58;
  }


  .mvp-podium-card
  .mvp-station-link{
    margin-top:13px;

    min-width:72px;
    height:32px;

    padding:
      0 14px;

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

    backdrop-filter:
      blur(3px);
  }

}



/* =========================================================
   MVP V10 - BRIGHT LUXURY PODIUM
   금속은 프레임/메달에 집중하고 내부는 밝게 유지
========================================================= */

@media(min-width:761px){

  /* =====================================================
     공통
  ===================================================== */

  .mvp-podium-card{
    color:#28362d;

    overflow:visible;

    box-shadow:
      0 16px 36px rgba(65,57,41,.09) !important;
  }


  /* =====================================================
     1위 - CHAMPAGNE GOLD
  ===================================================== */

  .mvp-podium-card.mvp-rank-1{
    background:
      radial-gradient(
        circle at 50% 8%,
        rgba(255,238,176,.30) 0%,
        rgba(255,238,176,0) 34%
      ),
      linear-gradient(
        155deg,
        #fffef9 0%,
        #fffaf0 53%,
        #fbf1d9 100%
      ) !important;

    border:
      1px solid
      rgba(159,111,22,.72) !important;

    box-shadow:
      0 22px 44px rgba(128,91,17,.14),
      0 6px 16px rgba(83,60,15,.07),
      inset 0 1px 0 rgba(255,255,255,.98) !important;
  }


  .mvp-podium-card.mvp-rank-1::before{
    background:
      linear-gradient(
        135deg,
        #76500e 0%,
        #bd8620 14%,
        #f0d274 28%,
        #fff0b0 38%,
        #a97418 52%,
        #f6dc82 67%,
        #b87e1d 84%,
        #70490c 100%
      ) !important;
  }


  .mvp-podium-card.mvp-rank-1::after{
    border:
      1px solid
      rgba(186,139,44,.42) !important;

    box-shadow:
      inset 0 0 0 2px rgba(255,248,219,.72) !important;
  }


  /* =====================================================
     2위 - PLATINUM
  ===================================================== */

  .mvp-podium-card.mvp-rank-2{
    background:
      radial-gradient(
        circle at 50% 8%,
        rgba(219,226,235,.25) 0%,
        rgba(219,226,235,0) 34%
      ),
      linear-gradient(
        155deg,
        #ffffff 0%,
        #fbfcfd 55%,
        #f2f4f6 100%
      ) !important;

    border:
      1px solid
      rgba(128,138,150,.58) !important;

    box-shadow:
      0 16px 34px rgba(66,76,90,.10),
      inset 0 1px 0 rgba(255,255,255,.98) !important;
  }


  .mvp-podium-card.mvp-rank-2::before{
    background:
      linear-gradient(
        135deg,
        #7c858f 0%,
        #b8c0ca 18%,
        #eef1f4 33%,
        #ffffff 40%,
        #9ea7b2 57%,
        #dce1e6 74%,
        #7b848f 100%
      ) !important;
  }


  .mvp-podium-card.mvp-rank-2::after{
    border:
      1px solid
      rgba(139,149,161,.34) !important;

    box-shadow:
      inset 0 0 0 2px rgba(255,255,255,.80) !important;
  }


  /* =====================================================
     3위 - ROSE BRONZE
  ===================================================== */

  .mvp-podium-card.mvp-rank-3{
    background:
      radial-gradient(
        circle at 50% 8%,
        rgba(232,185,157,.22) 0%,
        rgba(232,185,157,0) 34%
      ),
      linear-gradient(
        155deg,
        #fffdfb 0%,
        #fdf8f4 54%,
        #f7ece5 100%
      ) !important;

    border:
      1px solid
      rgba(168,104,67,.58) !important;

    box-shadow:
      0 16px 34px rgba(112,68,44,.09),
      inset 0 1px 0 rgba(255,255,255,.98) !important;
  }


  .mvp-podium-card.mvp-rank-3::before{
    background:
      linear-gradient(
        135deg,
        #8b5030 0%,
        #c48763 18%,
        #efc6ab 33%,
        #ffe2d0 41%,
        #ad6b47 58%,
        #dba586 75%,
        #82492b 100%
      ) !important;
  }


  .mvp-podium-card.mvp-rank-3::after{
    border:
      1px solid
      rgba(170,104,66,.32) !important;

    box-shadow:
      inset 0 0 0 2px rgba(255,249,245,.80) !important;
  }


  /* =====================================================
     텍스트 대비 정상화
  ===================================================== */

  .mvp-podium-card
  .mvp-supporter-name{
    color:#26352c !important;

    text-shadow:none !important;
  }


  .mvp-podium-card
  .mvp-supporter-id{
    color:#5e685f !important;

    opacity:.72 !important;
  }


  .mvp-podium-card
  .mvp-podium-crown{
    opacity:1 !important;
  }


  .mvp-rank-1
  .mvp-podium-crown{
    color:#9c6d17 !important;
  }


  .mvp-rank-2
  .mvp-podium-crown{
    color:#78828d !important;
  }


  .mvp-rank-3
  .mvp-podium-crown{
    color:#a26949 !important;
  }


  /* 방송국 버튼도 내부와 어울리게 밝게 */
  .mvp-podium-card
  .mvp-station-link{
    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,.96),
        rgba(249,245,235,.96)
      ) !important;

    color:#514737 !important;

    border-color:
      rgba(163,143,105,.30) !important;

    box-shadow:
      0 3px 8px rgba(74,61,39,.06);
  }


  /* 프로필 원은 카드 면과 분리 */
  .mvp-podium-card
  .mvp-profile-avatar{
    background:#f4f2ed;

    border-color:#ffffff !important;

    box-shadow:
      0 0 0 2px rgba(143,132,110,.16),
      0 7px 17px rgba(58,51,39,.11) !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{
    box-shadow:
      0 0 0 2px rgba(177,126,25,.42),
      0 8px 20px rgba(103,73,14,.14) !important;
  }

}



/* =========================================================
   MVP V11 - MOBILE PODIUM
   모바일: 1위 단독 + 2/3위 2열
========================================================= */

@media(max-width:760px){

  /* 제목도 모바일 폭에서 한 줄 유지 */
  .mvp-ranking-head{
    margin-bottom:22px !important;
  }


  .mvp-ranking-head h2{
    font-size:26px !important;

    line-height:1.18 !important;

    white-space:nowrap;
  }


  .mvp-ranking-head p{
    margin-top:10px !important;

    font-size:12px !important;

    line-height:1.6 !important;
  }


  /* =====================================================
     1위 위 / 2,3위 아래
  ===================================================== */

  .mvp-podium{
    display:grid !important;

    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    gap:
      12px 10px !important;

    align-items:stretch !important;

    margin:
      0 0 16px !important;

    padding:
      6px 0 0 !important;
  }


  .mvp-podium-card{
    width:100% !important;

    min-width:0 !important;

    min-height:188px !important;

    padding:
      18px 10px 16px !important;

    border-radius:
      18px !important;

    transform:none !important;
  }


  /* 1위 */
  .mvp-podium-card.mvp-rank-1{
    order:1;

    grid-column:
      1 / -1;

    justify-self:center;

    width:
      min(100%,290px) !important;

    min-height:
      218px !important;

    padding:
      20px 18px 17px !important;

    transform:none !important;
  }


  /* 2위 */
  .mvp-podium-card.mvp-rank-2{
    order:2;

    grid-column:1;

    min-height:
      188px !important;
  }


  /* 3위 */
  .mvp-podium-card.mvp-rank-3{
    order:3;

    grid-column:2;

    min-height:
      188px !important;
  }


  /* =====================================================
     순위 메달
  ===================================================== */

  .mvp-podium-rank{
    width:44px !important;
    height:44px !important;

    margin:
      0 auto 10px !important;

    font-size:
      19px !important;
  }


  .mvp-rank-1
  .mvp-podium-rank{
    width:54px !important;
    height:54px !important;

    font-size:
      24px !important;
  }


  /* =====================================================
     프로필
  ===================================================== */

  .mvp-podium-card
  .mvp-profile-avatar{
    width:58px !important;
    height:58px !important;

    margin:
      0 auto 10px !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{
    width:76px !important;
    height:76px !important;
  }


  /* =====================================================
     텍스트
  ===================================================== */

  .mvp-podium-crown{
    margin-bottom:
      6px !important;

    font-size:
      8px !important;
  }


  .mvp-podium-card
  .mvp-supporter-name{
    width:100%;

    overflow:hidden;

    font-size:
      13px !important;

    line-height:
      1.25 !important;

    white-space:nowrap;

    text-overflow:ellipsis;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-supporter-name{
    font-size:
      16px !important;
  }


  .mvp-podium-card
  .mvp-supporter-meta{
    width:100% !important;

    margin-top:
      6px !important;
  }


  .mvp-podium-card
  .mvp-supporter-id{
    display:block;

    max-width:100% !important;

    overflow:hidden;

    font-size:
      10px !important;

    white-space:nowrap;

    text-overflow:ellipsis;
  }


  /* =====================================================
     방송국
  ===================================================== */

  .mvp-podium-card
  .mvp-station-link{
    min-width:64px !important;

    height:32px !important;

    margin-top:
      11px !important;

    padding:
      0 12px !important;

    font-size:
      11px !important;
  }

}


@media(max-width:390px){

  .mvp-ranking-head h2{
    font-size:
      23px !important;
  }


  .mvp-podium{
    gap:
      10px 8px !important;
  }


  .mvp-podium-card.mvp-rank-1{
    width:
      min(100%,270px) !important;
  }


  .mvp-podium-card.mvp-rank-2,
  .mvp-podium-card.mvp-rank-3{
    padding-left:
      7px !important;

    padding-right:
      7px !important;
  }

}



/* =========================================================
   MVP V15 - MOBILE PODIUM FINAL
   1위 단독 / 2,3위 2열
========================================================= */

@media(max-width:760px){

  /* 전체 TOP3 */
  .mvp-podium{
    display:grid !important;

    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    gap:
      12px 10px !important;

    align-items:stretch !important;

    margin:
      0 0 18px !important;

    padding:
      4px 0 0 !important;
  }


  /* 공통 카드 */
  .mvp-podium-card{
    width:100% !important;

    min-width:0 !important;
    min-height:164px !important;

    padding:
      16px 9px 14px !important;

    border-radius:
      17px !important;

    transform:none !important;
  }


  /* =====================================================
     1위
  ===================================================== */

  .mvp-podium-card.mvp-rank-1{
    order:1;

    grid-column:
      1 / -1;

    justify-self:center;

    width:
      min(100%,300px) !important;

    min-height:
      198px !important;

    padding:
      18px 16px 16px !important;

    transform:none !important;
  }


  /* =====================================================
     2위
  ===================================================== */

  .mvp-podium-card.mvp-rank-2{
    order:2;

    grid-column:1;

    min-height:
      164px !important;
  }


  /* =====================================================
     3위
  ===================================================== */

  .mvp-podium-card.mvp-rank-3{
    order:3;

    grid-column:2;

    min-height:
      164px !important;
  }


  /* =====================================================
     순위 숫자
  ===================================================== */

  .mvp-podium-card
  .mvp-podium-rank{
    width:40px !important;
    height:40px !important;

    margin:
      0 auto 8px !important;

    font-size:
      18px !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-podium-rank{
    width:50px !important;
    height:50px !important;

    margin-bottom:
      10px !important;

    font-size:
      23px !important;
  }


  /* =====================================================
     프로필
  ===================================================== */

  .mvp-podium-card
  .mvp-profile-avatar{
    width:54px !important;
    height:54px !important;

    margin:
      0 auto 9px !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{
    width:72px !important;
    height:72px !important;

    margin-bottom:
      10px !important;
  }


  /* =====================================================
     TOP / MVP 텍스트
  ===================================================== */

  .mvp-podium-card
  .mvp-podium-crown{
    margin-bottom:
      5px !important;

    font-size:
      8px !important;

    line-height:
      1 !important;
  }


  /* =====================================================
     닉네임
  ===================================================== */

  .mvp-podium-card
  .mvp-supporter-name{
    display:block;

    width:100%;

    overflow:hidden;

    font-size:
      12px !important;

    line-height:
      1.25 !important;

    white-space:nowrap;

    text-overflow:ellipsis;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-supporter-name{
    font-size:
      16px !important;
  }


  /* =====================================================
     아이디
  ===================================================== */

  .mvp-podium-card
  .mvp-supporter-meta{
    width:100% !important;

    margin-top:
      4px !important;
  }


  .mvp-podium-card
  .mvp-supporter-id{
    display:block;

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

    overflow:hidden;

    font-size:
      9px !important;

    line-height:
      1.2 !important;

    white-space:nowrap;

    text-overflow:ellipsis;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-supporter-id{
    font-size:
      10px !important;
  }


  /* =====================================================
     방송국 버튼
  ===================================================== */

  .mvp-podium-card
  .mvp-station-link{
    min-width:60px !important;
    height:29px !important;

    margin-top:
      9px !important;

    padding:
      0 10px !important;

    font-size:
      10px !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-station-link{
    min-width:68px !important;
    height:31px !important;

    font-size:
      11px !important;
  }

}


/* 아주 작은 휴대폰 */

@media(max-width:390px){

  .mvp-podium{
    gap:
      10px 8px !important;
  }


  .mvp-podium-card.mvp-rank-1{
    width:
      min(100%,280px) !important;
  }


  .mvp-podium-card.mvp-rank-2,
  .mvp-podium-card.mvp-rank-3{
    padding-left:
      6px !important;

    padding-right:
      6px !important;
  }


  .mvp-podium-card
  .mvp-supporter-name{
    font-size:
      11px !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-supporter-name{
    font-size:
      15px !important;
  }

}



/* =========================================================
   MVP V16 - MOBILE CLEAN PODIUM
   카드 프레임 제거 / 프로필 링으로만 순위 강조
========================================================= */

@media(max-width:760px){

  /* =====================================================
     TOP3 전체
  ===================================================== */

  .mvp-podium{
    display:grid !important;

    grid-template-columns:
      repeat(2,minmax(0,1fr)) !important;

    align-items:start !important;

    gap:
      20px 18px !important;

    margin:
      4px 0 22px !important;

    padding:
      4px 8px 18px !important;

    border-bottom:
      1px solid rgba(80,74,58,.12) !important;
  }


  /* =====================================================
     기존 카드 디자인 완전 제거
  ===================================================== */

  .mvp-podium-card,
  .mvp-podium-card.mvp-rank-1,
  .mvp-podium-card.mvp-rank-2,
  .mvp-podium-card.mvp-rank-3{

    position:relative !important;

    display:flex !important;

    flex-direction:column !important;

    align-items:center !important;
    justify-content:flex-start !important;

    width:100% !important;

    min-width:0 !important;
    max-width:none !important;

    min-height:0 !important;
    height:auto !important;

    margin:0 !important;

    padding:
      4px 2px !important;

    border:0 !important;

    border-radius:0 !important;

    background:none !important;
    background-color:transparent !important;
    background-image:none !important;

    box-shadow:none !important;

    outline:0 !important;

    transform:none !important;

    overflow:visible !important;
  }


  .mvp-podium-card::before,
  .mvp-podium-card::after{

    content:none !important;

    display:none !important;
  }


  /* =====================================================
     순서
  ===================================================== */

  .mvp-podium-card.mvp-rank-1{
    order:1;

    grid-column:
      1 / -1;

    justify-self:center;

    width:
      min(100%,300px) !important;

    padding-bottom:
      4px !important;
  }


  .mvp-podium-card.mvp-rank-2{
    order:2;

    grid-column:1;
  }


  .mvp-podium-card.mvp-rank-3{
    order:3;

    grid-column:2;
  }


  /* =====================================================
     순위 숫자
  ===================================================== */

  .mvp-podium-card
  .mvp-podium-rank{

    display:flex !important;

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

    width:27px !important;
    height:27px !important;

    min-width:27px !important;
    min-height:27px !important;

    margin:
      0 auto 8px !important;

    padding:0 !important;

    border-radius:50% !important;

    font-size:
      13px !important;

    font-weight:
      900 !important;

    line-height:1 !important;

    box-shadow:none !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-podium-rank{

    width:31px !important;
    height:31px !important;

    min-width:31px !important;
    min-height:31px !important;

    margin-bottom:
      10px !important;

    font-size:
      15px !important;

    color:#80661f !important;

    border:
      1px solid rgba(194,157,61,.55) !important;

    background:
      rgba(249,238,197,.72) !important;
  }


  .mvp-podium-card.mvp-rank-2
  .mvp-podium-rank{

    color:#707782 !important;

    border:
      1px solid rgba(149,158,171,.5) !important;

    background:
      rgba(232,235,240,.72) !important;
  }


  .mvp-podium-card.mvp-rank-3
  .mvp-podium-rank{

    color:#9b6448 !important;

    border:
      1px solid rgba(190,137,103,.50) !important;

    background:
      rgba(244,226,215,.76) !important;
  }


  /* =====================================================
     프로필
  ===================================================== */

  .mvp-podium-card
  .mvp-profile-avatar{

    position:relative !important;

    display:flex !important;

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

    width:76px !important;
    height:76px !important;

    min-width:76px !important;
    min-height:76px !important;

    margin:
      0 auto 9px !important;

    padding:3px !important;

    border-radius:50% !important;

    background:#fff !important;

    overflow:hidden !important;

    box-sizing:border-box !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{

    width:96px !important;
    height:96px !important;

    min-width:96px !important;
    min-height:96px !important;

    padding:4px !important;

    border:
      3px solid #d6b75e !important;

    box-shadow:
      0 4px 16px rgba(157,126,47,.18) !important;
  }


  .mvp-podium-card.mvp-rank-2
  .mvp-profile-avatar{

    border:
      3px solid #b9c0ca !important;

    box-shadow:
      0 3px 12px rgba(117,128,145,.14) !important;
  }


  .mvp-podium-card.mvp-rank-3
  .mvp-profile-avatar{

    border:
      3px solid #d1a185 !important;

    box-shadow:
      0 3px 12px rgba(153,103,75,.14) !important;
  }


  .mvp-podium-card
  .mvp-profile-avatar img{

    display:block !important;

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

    border-radius:50% !important;

    object-fit:cover !important;
  }


  /* =====================================================
     MVP / TOP2 / TOP3
  ===================================================== */

  .mvp-podium-card
  .mvp-podium-crown{

    display:block !important;

    margin:
      0 0 6px !important;

    padding:0 !important;

    color:
      #8c8678 !important;

    font-size:
      9px !important;

    font-weight:
      900 !important;

    line-height:1 !important;

    letter-spacing:
      .14em !important;

    background:none !important;

    border:0 !important;

    box-shadow:none !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-podium-crown{

    color:
      #9c8041 !important;
  }


  /* =====================================================
     닉네임
  ===================================================== */

  .mvp-podium-card
  .mvp-supporter-name{

    display:block !important;

    width:100% !important;

    margin:0 !important;

    overflow:hidden !important;

    color:#252922 !important;

    font-size:
      13px !important;

    font-weight:
      800 !important;

    line-height:
      1.3 !important;

    text-align:center !important;

    white-space:nowrap !important;

    text-overflow:ellipsis !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-supporter-name{

    font-size:
      16px !important;
  }


  /* =====================================================
     ID
  ===================================================== */

  .mvp-podium-card
  .mvp-supporter-meta{

    width:100% !important;

    margin:
      5px 0 0 !important;

    text-align:center !important;
  }


  .mvp-podium-card
  .mvp-supporter-id{

    display:block !important;

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

    overflow:hidden !important;

    color:
      #9c9a91 !important;

    font-size:
      9px !important;

    line-height:
      1.25 !important;

    text-align:center !important;

    white-space:nowrap !important;

    text-overflow:ellipsis !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-supporter-id{

    font-size:
      10px !important;
  }


  /* =====================================================
     방송국
  ===================================================== */

  .mvp-podium-card
  .mvp-station-link{

    display:inline-flex !important;

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

    width:auto !important;

    min-width:64px !important;
    height:29px !important;

    margin-top:
      9px !important;

    padding:
      0 12px !important;

    border:
      1px solid rgba(108,100,78,.18) !important;

    border-radius:
      999px !important;

    background:
      rgba(255,252,243,.88) !important;

    color:#474437 !important;

    font-size:
      10px !important;

    font-weight:
      800 !important;

    box-shadow:none !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-station-link{

    min-width:
      72px !important;

    height:
      31px !important;

    font-size:
      11px !important;
  }

}


/* =========================================================
   NARROW PHONE
========================================================= */

@media(max-width:390px){

  .mvp-podium{

    gap:
      18px 12px !important;

    padding-left:
      2px !important;

    padding-right:
      2px !important;
  }


  .mvp-podium-card
  .mvp-profile-avatar{

    width:70px !important;
    height:70px !important;

    min-width:70px !important;
    min-height:70px !important;
  }


  .mvp-podium-card.mvp-rank-1
  .mvp-profile-avatar{

    width:90px !important;
    height:90px !important;

    min-width:90px !important;
    min-height:90px !important;
  }

}



/* =========================================================
   MVP V17 - MOBILE WIDTH / RANK LIST
   화면 폭 적극 사용 + 닉네임 영역 확보
========================================================= */

@media(max-width:760px){

  /* =====================================================
     OUTER WIDTH
  ===================================================== */

  .mvp-ranking-section{
    padding:
      14px 0 30px !important;
  }


  .mvp-ranking-section
  > .functional-wrap{
    width:
      calc(100% - 20px) !important;

    max-width:none !important;

    margin:
      0 auto !important;
  }


  /*
   * 공통 gs-depth-content-card의 큰 좌우 패딩 제거
   */
  .mvp-ranking-shell.gs-depth-content-card{
    width:100% !important;

    max-width:none !important;

    margin:
      0 auto !important;

    padding:
      22px 12px 26px !important;

    box-sizing:
      border-box !important;
  }


  /* =====================================================
     4 ~ 10위 LIST
  ===================================================== */

  .mvp-rank-list{
    width:100% !important;

    gap:
      8px !important;
  }


  .mvp-rank-row{
    display:grid !important;

    grid-template-columns:
      30px
      44px
      minmax(0,1fr)
      64px !important;

    align-items:center !important;

    column-gap:
      8px !important;

    width:100% !important;

    min-width:0 !important;
    min-height:68px !important;

    margin:0 !important;

    padding:
      8px 10px !important;

    box-sizing:
      border-box !important;
  }


  /* =====================================================
     RANK NUMBER
  ===================================================== */

  .mvp-rank-row
  .mvp-rank-number{
    display:flex !important;

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

    width:30px !important;
    height:30px !important;

    min-width:30px !important;

    margin:0 !important;

    font-size:
      13px !important;
  }


  /* =====================================================
     AVATAR
  ===================================================== */

  .mvp-rank-row
  .mvp-profile-avatar{
    width:44px !important;
    height:44px !important;

    min-width:44px !important;
    min-height:44px !important;

    margin:0 !important;
  }


  /* =====================================================
     INFO
     남는 폭을 전부 닉네임에 사용
  ===================================================== */

  .mvp-rank-row
  .mvp-rank-info{
    display:flex !important;

    flex-direction:column !important;

    justify-content:center !important;

    width:100% !important;

    min-width:0 !important;
    max-width:none !important;

    margin:0 !important;

    overflow:hidden !important;
  }


  .mvp-rank-row
  .mvp-supporter-name{
    display:block !important;

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

    min-width:0 !important;

    margin:0 !important;

    overflow:hidden !important;

    color:#273128 !important;

    font-size:
      14px !important;

    font-weight:
      800 !important;

    line-height:
      1.25 !important;

    white-space:
      nowrap !important;

    text-overflow:
      ellipsis !important;
  }


  .mvp-rank-row
  .mvp-supporter-meta{
    display:block !important;

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

    min-width:0 !important;

    margin:
      4px 0 0 !important;

    overflow:hidden !important;
  }


  .mvp-rank-row
  .mvp-supporter-id{
    display:block !important;

    width:100% !important;

    overflow:hidden !important;

    font-size:
      10px !important;

    line-height:
      1.2 !important;

    white-space:
      nowrap !important;

    text-overflow:
      ellipsis !important;
  }


  /* =====================================================
     STATION BUTTON
     고정폭을 줄여 닉네임에 돌려준다
  ===================================================== */

  .mvp-rank-row
  .mvp-station-link{
    display:flex !important;

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

    width:64px !important;
    min-width:64px !important;

    height:34px !important;

    margin:0 !important;

    padding:
      0 6px !important;

    box-sizing:
      border-box !important;

    font-size:
      10px !important;

    white-space:
      nowrap !important;
  }

}


/* =========================================================
   NARROW PHONE
========================================================= */

@media(max-width:390px){

  .mvp-ranking-section
  > .functional-wrap{
    width:
      calc(100% - 12px) !important;
  }


  .mvp-ranking-shell.gs-depth-content-card{
    padding:
      20px 8px 24px !important;
  }


  .mvp-rank-row{
    grid-template-columns:
      28px
      42px
      minmax(0,1fr)
      58px !important;

    column-gap:
      6px !important;

    padding:
      7px 8px !important;
  }


  .mvp-rank-row
  .mvp-rank-number{
    width:28px !important;
    height:28px !important;

    min-width:28px !important;
  }


  .mvp-rank-row
  .mvp-profile-avatar{
    width:42px !important;
    height:42px !important;

    min-width:42px !important;
    min-height:42px !important;
  }


  .mvp-rank-row
  .mvp-station-link{
    width:58px !important;
    min-width:58px !important;

    padding:
      0 4px !important;

    font-size:
      9px !important;
  }


  .mvp-rank-row
  .mvp-supporter-name{
    font-size:
      13px !important;
  }

}



/* =========================================================
   MVP DESKTOP HEADING GAP V18
   상단 제목 묶음만 위로 이동해 1위 배지와 여백 확보
========================================================= */

@media (min-width: 761px) {

  .mvp-ranking-head {
    transform: translateY(-18px);
  }

}


/* =========================================================
   MVP SNAPSHOT STATE V1
========================================================= */

.mvp-loading[hidden] {
  display:none !important;
}

.mvp-loading.is-snapshot-state {
  display:flex;
  align-items:center;
  justify-content:center;

  min-height:180px;
  margin:8px 0 4px;

  padding:32px 24px;

  text-align:center;
  line-height:1.75;
  font-size:15px;
  font-weight:700;

  border-radius:22px;

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

  border:
    1px solid rgba(111,84,61,.12);

  box-shadow:
    0 16px 40px rgba(62,43,26,.06);
}

@media (max-width:760px) {

  .mvp-loading.is-snapshot-state {
    min-height:150px;
    padding:26px 18px;
    font-size:14px;
    border-radius:18px;
  }

}
