/* Placar do ramo: estilo próprio, igual na página inicial e no painel */
.pl {
  --pl-tinta: #1A1F36; --pl-tinta-2: #3A3F55; --pl-fraco: #6B6F80; --pl-linha: #E6E4DC; --pl-papel: #FFFFFF; --pl-suave: #F1F0EA;
  --pl-azul: #0D1530; --pl-azul-2: #3B4A8C; --pl-azul-3: #8592C4; --pl-grifo: #FFE45C; --pl-verde: #1E8A52; --pl-verde-fundo: #E4F3EA;
  position: relative; background: var(--pl-papel); color: var(--pl-tinta); border: 1px solid var(--pl-linha); border-radius: 18px;
  padding: 26px 28px 22px; box-shadow: 0 1px 2px rgba(26, 31, 54, .04), 0 18px 40px -26px rgba(26, 31, 54, .3);
}
:root[data-theme="dark"] .pl {
  --pl-tinta: #ECEDF2; --pl-tinta-2: #C5C8D4; --pl-fraco: #8E92A3; --pl-linha: #2A2E3A; --pl-papel: #1A1D26; --pl-suave: #22252F;
  --pl-azul: #9BB0FF; --pl-azul-2: #6B82E0; --pl-azul-3: #42539A; --pl-grifo: rgba(255, 222, 85, .45); --pl-verde: #5CD093; --pl-verde-fundo: #163222;
}
.pl h2, .pl h3, .pl p { margin: 0; }
.pl-sobre { display: flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 600; color: var(--pl-fraco); margin-bottom: 10px !important; }
.pl-ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--pl-grifo); box-shadow: 0 0 0 3px color-mix(in srgb, var(--pl-grifo) 35%, transparent); }
.pl-titulo { font-size: 25px; font-weight: 760; letter-spacing: -.035em; line-height: 1.25; max-width: 760px; text-wrap: pretty; }
.pl-titulo mark { color: inherit; background: linear-gradient(100deg, transparent .12em, var(--pl-grifo) .12em, var(--pl-grifo) calc(100% - .08em), transparent calc(100% - .08em)) no-repeat 0 88% / 100% 42%; padding: 0 2px; animation: pl-grifar 1s .25s cubic-bezier(.2, .8, .2, 1) both; }
@keyframes pl-grifar { from { background-size: 0 42%; } }

.pl-fatia { display: flex; gap: 3px; height: 16px; margin: 22px 0 10px; border-radius: 8px; overflow: hidden; }
.pl-fatia span { flex-basis: 0; min-width: 6px; transform-origin: left; animation: pl-crescer .9s cubic-bezier(.2, .8, .2, 1) both; }
.pl-fatia span:nth-child(2) { animation-delay: .08s; }
.pl-fatia span:nth-child(3) { animation-delay: .16s; }
.pl-fatia span:nth-child(4) { animation-delay: .24s; }
.pl-fatia span:nth-child(5) { animation-delay: .32s; }
@keyframes pl-crescer { from { transform: scaleX(0); } }
.pl .voce { background: var(--pl-grifo); }
.pl .r1 { background: var(--pl-azul); }
.pl .r2 { background: var(--pl-azul-2); }
.pl .r3 { background: var(--pl-azul-3); }
.pl .outros { background: var(--pl-suave); box-shadow: inset 0 0 0 1px var(--pl-linha); }
.pl-legenda { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; color: var(--pl-tinta-2); }
.pl-legenda li { display: flex; align-items: center; gap: 7px; }
.pl-legenda i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.pl-legenda b { color: var(--pl-tinta); font-variant-numeric: tabular-nums; }

.pl-grade { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 30px; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--pl-linha); }
.pl h3 { font-size: 15px; font-weight: 700; letter-spacing: -.01em; margin-bottom: 10px; }
.pl-ranking, .pl-compradores { list-style: none; padding: 0; margin: 0; display: grid; gap: 4px; }
.pl-ranking li { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; margin: 0 -10px; border-radius: 10px; }
.pl-ranking li.voce { background: color-mix(in srgb, var(--pl-grifo) 32%, transparent); }
.pl-ranking li.voce .pl-trilho i { background: var(--pl-tinta); }
.pl-pos { font-size: 13px; font-weight: 700; color: var(--pl-fraco); font-variant-numeric: tabular-nums; }
.pl-quem { min-width: 0; }
.pl-quem b, .pl-compradores b { display: block; font-size: 14.5px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-quem small, .pl-compradores small { display: block; font-size: 12.5px; color: var(--pl-fraco); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pl-trilho { display: block; height: 4px; border-radius: 4px; background: var(--pl-suave); margin-top: 6px; overflow: hidden; }
.pl-trilho i { display: block; height: 100%; border-radius: inherit; background: var(--pl-azul-2); transform-origin: left; animation: pl-crescer .9s .2s cubic-bezier(.2, .8, .2, 1) both; }
.pl-ranking em, .pl-compradores em { font-style: normal; font-weight: 700; font-size: 14px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.pl-pular { text-align: center; color: var(--pl-fraco); padding: 0 !important; line-height: 1; }
.pl-compradores li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--pl-linha); }
.pl-compradores li:last-child { border-bottom: 0; }
.pl-chip { font-size: 12px; font-weight: 600; padding: 4px 10px; border-radius: 999px; background: var(--pl-suave); color: var(--pl-fraco); white-space: nowrap; }
.pl-chip.aberta { background: var(--pl-verde-fundo); color: var(--pl-verde); }
.pl-linha { margin-top: 12px !important; font-size: 14px; color: var(--pl-tinta-2); line-height: 1.5; }
.pl-agora { margin-top: 22px !important; padding-top: 18px; border-top: 1px solid var(--pl-linha); font-size: 15.5px; color: var(--pl-tinta-2); }
.pl-agora b { color: var(--pl-tinta); }
.pl .btn { margin-top: 14px; }
.pl-nota { margin-top: 16px !important; font-size: 12px; line-height: 1.5; color: var(--pl-fraco); }

@media (max-width: 760px) {
  .pl { padding: 20px 18px 18px; border-radius: 16px; }
  .pl-titulo { font-size: 21px; }
  .pl-grade { grid-template-columns: minmax(0, 1fr); gap: 22px; }
}
@media (prefers-reduced-motion: reduce) {
  .pl-titulo mark, .pl-fatia span, .pl-trilho i { animation: none; }
}