/* Taste-compatibility badge (logged-in viewer on someone else's profile). Loaded by /social/taste.js. */
.tb { display: flex; align-items: center; gap: 10px; position: relative; box-sizing: border-box;
  padding: 7px 14px 7px 12px; border-radius: 999px; border: 1px solid rgba(201,160,99,.45);
  background: linear-gradient(100deg, rgba(201,160,99,.18), rgba(201,160,99,.06)); color: #e9dcc6; font: 500 13px/1.25 var(--sans); }
.tb-meter { flex: none; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
  background: conic-gradient(var(--amber) calc(var(--p) * 1%), rgba(236,228,214,.12) 0); }
.tb-meter::before { content: ''; grid-area: 1/1; width: 26px; height: 26px; border-radius: 50%; background: #17140f; }
.tb-meter b { grid-area: 1/1; font: 600 10.5px/1 var(--sans); color: #f0d7aa; letter-spacing: -.02em; }
.tb-txt { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tb-txt strong { color: #f0d7aa; font-weight: 700; }
.tb-txt .tb-sep { color: rgba(236,228,214,.35); margin: 0 4px; }
.tb-txt .tb-lbl { color: rgba(236,228,214,.6); }
.tb-info { flex: none; appearance: none; border: 0; background: none; color: rgba(201,160,99,.75); padding: 2px; cursor: pointer; display: grid; place-items: center; }
.tb-info svg { width: 15px; height: 15px; }
.tb-tip { position: absolute; z-index: 20; top: calc(100% + 8px); right: 8px; max-width: 260px; padding: 8px 11px; border-radius: 10px;
  background: #1d1a15; border: 1px solid rgba(201,160,99,.35); color: #e9dcc6; font-size: 12px; box-shadow: 0 8px 24px rgba(0,0,0,.45); }
.tb-tip[hidden] { display: none; }
/* desktop: centered above the Ouvindo agora / Última faixa block */
.tb-wrap { display: flex; justify-content: center; margin: 18px 0 14px; }
.tb-wrap .tb { max-width: 100%; }
/* mobile: own full-width row inside the header, right under the Seguir | Compartilhar row */
@media (max-width: 719px) {
  html.mh .profile > .tb { grid-column: 1 / -1; grid-row: 4; margin-top: 10px; border-radius: 14px; padding: 7px 10px; }
  html.mh .profile.shrunk > .tb { display: none; }
  .tb-txt { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}
