/*
 * mvp_align rev.7 R1/R4-d — 게스트 정적 데모 화면 전용 스타일
 * (basketball/demo/my.html, basketball/demo/analysis_report.html).
 * 기존 --bb-* / --rtp-* / --an-* 토큰만 사용 — 핸드오프 styles.css 직접 복사 금지.
 */

/* ── 게스트 데모 탭바 ─────────────────────────────────────────────────
   ⚠️ 실화면(my_profile.html)의 탭은 `<a>` 지만 데모는 서버 분기가 없어 `<button>` 이다.
   `.rtp-tab` 은 `<a>` 기준으로 쓰여 있어 버튼 UA 기본값(회색 배경 + outset 테두리 +
   시스템 폰트)이 그대로 남았다 → 데모만 "회색 네모 3개"로 보였다(사용자 스크린샷 2).
   같은 화면으로 보이려면 여기서 UA 기본값을 지워야 한다. */
#rtp-demo-tabs-root button.rtp-tab {
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
  border: 0;
  background: none;
  font-family: var(--rtp-font-num);
  cursor: pointer;
}

/* ── 공통: "예시 데이터" 안내 행 ───────────────────────────────────────
   핸드오프 02-my-guest.png 는 주황 칩이 아니라 **한 줄짜리 회색 캡션**이다.
   칩이면 폭을 먹어 402px 에서 두 줄로 접혔다(사용자 스크린샷 2). */
.rtp-demo-note {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  padding: var(--bb-space-3) var(--bb-space-3) var(--bb-space-2);
}
.rtp-demo-note--flush { padding: var(--bb-space-3) var(--bb-space-3) var(--bb-space-2); }
.rtp-demo-note .bb-badge {
  padding: 0;
  font-size: 13px;
  font-weight: 800;
  color: var(--bb-ink-sub);
  background: none;
  border: 0;
}
.rtp-demo-note__sub {
  font-size: 13px;
  font-weight: 600;
  color: var(--bb-ink-muted);
}

/* 히어로 안 시즌 표기 — 실화면은 `.rtp-year-plain`(my_profile.html:115) 을 쓴다. */
.rtp-demo-year { margin-top: 12px; }
.rtp-demo-note__sub--card {
  display: block;
  margin: 4px 0 0;
  font-weight: 500;
  color: var(--bb-ink-sub);
  line-height: 1.5;
}

/* ── MY 데모: 경기 카드 상대팀 색 (실화면 _gamecard_expandable.html 과 동일 톤) ── */
.rtp-gamecard__team--op { color: var(--rtp-ink-2); }

/* ── STATS 패널(R4-d 자체 설계) ──────────────────────────────────────── */
.rtp-demo-season-count {
  font-family: var(--rtp-font-num);
  font-size: 11px;
  font-weight: 600;
  color: var(--rtp-ink-3);
}
.rtp-demo-chart-card {
  margin-top: 16px;
  padding: 16px 14px 6px;
  background: var(--rtp-white);
  border: 1px solid var(--rtp-line);
  border-radius: 14px;
}
.rtp-demo-chart-card__head { margin-bottom: 14px; }
.rtp-demo-chart-card__title { font-size: 13px; font-weight: 800; color: var(--rtp-ink); }
.rtp-demo-chart-bars {
  display: flex;
  align-items: flex-end;
  gap: 10px;
  height: 120px;
}
.rtp-demo-chart-bar {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  height: 100%;
}
.rtp-demo-chart-bar__val {
  font-family: var(--rtp-font-num);
  font-size: 12px;
  font-weight: 800;
  color: var(--rtp-ink);
}
.rtp-demo-chart-bar__track {
  display: flex;
  align-items: flex-end;
  flex: 1;
  width: 100%;
  max-width: 28px;
}
.rtp-demo-chart-bar__fill {
  display: block;
  width: 100%;
  height: 6%;
  min-height: 4px;
  border-radius: 6px 6px 2px 2px;
  background: var(--rtp-orange);
}
.rtp-demo-chart-bar__date {
  font-family: var(--rtp-font-num);
  font-size: 9.5px;
  font-weight: 600;
  color: var(--rtp-ink-3);
}

.bb-signup-card[data-demo-stats-signup] { margin-top: 16px; }

/* ── 분석 리포트 데모: VS SERIES 카드 좌/우 배치(레퍼런스 an-series-card 인라인 스타일 대체) ── */
.an-series-card__left { flex: 1; }
.an-series-card__right { text-align: right; }
.an-head--tight { margin-bottom: 0; }