/* coupang-best10 전용 추가 스타일 (base.css + product.css 위에 얹어 사용) */

.crumb {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 24px; background: #1a1a1a; color: #fff; font-size: 13px;
  position: sticky; top: 0; z-index: 40;
}
.crumb a { color: #fff; text-decoration: none; opacity: .85; }
.crumb a:hover { opacity: 1; text-decoration: underline; }
.crumb__rank { font-weight: 800; }
.crumb__rank b { color: #ffb400; }

.rank-strip {
  display: flex; gap: 8px; overflow-x: auto; padding: 12px 20px;
  background: #f7f5f1; border-bottom: 1px solid #e5e1d8;
  -webkit-overflow-scrolling: touch;
}
.rank-strip::-webkit-scrollbar { display: none; }
.rank-strip a {
  flex: none; display: flex; align-items: center; gap: 6px;
  padding: 7px 12px; border-radius: 999px; background: #fff;
  border: 1px solid #e5e1d8; font-size: 12.5px; color: #444; text-decoration: none;
  white-space: nowrap;
}
.rank-strip a b { color: #d9531f; font-weight: 800; }
.rank-strip a.is-current { background: #1a1a1a; border-color: #1a1a1a; color: #fff; }
.rank-strip a.is-current b { color: #ffb400; }

.bench-flag {
  display: inline-flex; align-items: center; gap: 6px;
  background: #fff4e0; color: #a85b00; border: 1px solid #f0d6a8;
  font-size: 12px; font-weight: 700; padding: 6px 12px; border-radius: 8px;
  margin: 0 0 14px;
}

.disclaimer {
  max-width: var(--k-page, 1040px); margin: 0 auto; padding: 18px 24px;
  font-size: 12.5px; line-height: 1.7; color: #7a7468; background: #f7f5f1;
  border: 1px solid #e9e4da; border-radius: 10px;
}
.disclaimer b { color: #444; }

.src-list { max-width: var(--k-page, 1040px); margin: 14px auto 0; padding: 0 24px; }
.src-list li { font-size: 12px; color: #8a8478; margin-bottom: 4px; word-break: break-all; }
.src-list a { color: #8a8478; }

.hub-hero__note {
  max-width: 720px; margin: 18px auto 0; font-size: 13.5px; color: #7a7468;
  text-align: center; line-height: 1.8;
}

.rank-table small.rt-src { display:block; font-size:11px; color:#a39d90; margin-top:2px; }
.rank-table a.ext::after { content: " ↗"; font-size: 11px; opacity: .6; }
