/* mca/hero.css — 로비 첫 칸 프로필 카드.
   카지노·스포츠 카드와 같은 규격(.lobby-link-card)을 쓰고, 배경만 사진 대신 업체 테마색 그라데이션.
   색은 /api/config 의 theme.accent(--mca-acc)를 쓴다 - 브랜드색을 코드에 박지 않는다. */

.hero-vip { display: flex; }
.hero-vip > .hero-profile-card { flex: 1; min-width: 0; }

/* VIP 진행도 목업은 이 카드가 대신한다(진행률 산출 소스가 아직 없음) */
.hero-vip .vip-progress-card,
.hero-vip .vip-progress-card.is-ready { display: none !important; }

.hero-profile-card {
  background-image: linear-gradient(135deg,
    color-mix(in srgb, var(--mca-acc, var(--accent-green)) 26%, var(--panel-bg)) 0%,
    var(--panel-bg) 62%);
  background-color: var(--panel-bg);
}
.hero-profile-card::before { background: linear-gradient(180deg, rgba(0, 0, 0, .05) 0%, rgba(0, 0, 0, .55) 100%); }

.hero-profile-card .hp-ico {
  position: absolute; top: 16px; right: 16px; z-index: 2;
  width: 46px; height: 46px; color: var(--mca-acc, var(--accent-green)); opacity: .9;
}
.hero-profile-card .hp-ico svg { width: 100%; height: 100%; }

.hero-profile-card .hp-sub {
  margin-top: 4px; font-size: 13px; color: var(--text-grey);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.hero-profile-card .hp-grade {
  margin-top: 6px; display: inline-block; font-size: 11.5px; font-weight: 700;
  color: var(--mca-acc, var(--accent-green));
  border: 1px solid var(--border-color); border-radius: 20px; padding: 3px 9px;
}