/* ══════════════════════════════════════
 *  GROWTH PAGE (Sprint 5)
 * ══════════════════════════════════════ */

/* ── 백분위 요약 카드 3종 ── */
.growth-pct-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 12px; margin-bottom: 18px;
}
.growth-pct-card {
  background: var(--card); border-radius: 18px; padding: 16px 12px;
  box-shadow: var(--card-shadow); text-align: center;
}
.growth-pct-icon  { font-size: 1.4rem; margin-bottom: 4px; }
.growth-pct-label { font-size: .68rem; font-weight: 800; color: var(--txl); text-transform: uppercase; letter-spacing: .03em; }
.growth-pct-value { font-size: 1.02rem; font-weight: 900; color: var(--tx); margin-top: 4px; }
.growth-pct-badge {
  margin-top: 6px; font-size: .66rem; font-weight: 800;
  color: var(--pkd); background: var(--pkl);
  padding: 3px 8px; border-radius: 10px; display: inline-block;
}
.growth-pct-empty {
  grid-column: 1 / -1; cursor: pointer; padding: 22px 16px;
  border: 2px dashed #DDB0CC; background: linear-gradient(135deg, #FFF0F5, #F5EEFF);
}
.growth-gender-note {
  grid-column: 1 / -1; font-size: .68rem; color: var(--txl); font-weight: 700;
  text-align: center; margin-top: -6px;
}

/* ── 차트 카드 ── */
.growth-chart-card {
  background: var(--card); border-radius: 20px; padding: 18px;
  box-shadow: var(--card-shadow); margin-bottom: 18px;
}
.growth-disclaimer {
  margin-top: 12px; font-size: .68rem; color: var(--txl); font-weight: 700;
  line-height: 1.6; background: #F8F4FA; border-radius: 10px; padding: 8px 11px;
  font-family: 'OmyuPretty', 'Apple SD Gothic Neo', 'Noto Sans KR', sans-serif; /* v0.0.6: 정보 글 폰트 통일 */
}

/* ── Sprint 29: 성장 예측 카드 ── */
.growth-predict-card {
  background: var(--card); border-radius: 20px; padding: 18px;
  box-shadow: var(--card-shadow); margin-bottom: 18px;
}
.growth-predict-title { font-size: .88rem; font-weight: 700; color: var(--pkd); margin-bottom: 10px; }
.growth-predict-rows { display: flex; flex-direction: column; gap: 8px; }
.growth-predict-row {
  display: flex; justify-content: space-between; align-items: center;
  font-size: .82rem; font-weight: 700; color: var(--tx);
  background: var(--pkl); border-radius: 12px; padding: 9px 13px;
}
.growth-predict-value { font-weight: 800; color: var(--pkd); }
.growth-predict-value small { font-weight: 700; color: var(--txl); }

/* ── 기록 목록 ── */
.growth-record-item {
  display: flex; align-items: center; gap: 10px;
  padding: 11px 14px; background: #FAFAFA; border-radius: 13px;
  margin-bottom: 7px; border: 1.5px solid transparent;
}

/* ── 반응형 ── */
@media (max-width: 640px) {
  .growth-pct-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .growth-pct-card { padding: 12px 6px; }
  .growth-pct-value { font-size: .88rem; }
}
