/* panorama-perdas.css — panorama "Como amadores perdem partidas". Só o que rating-lichess.css não cobre; cor sai de token do site. */
.pp .pp-h3{font-family:var(--disp);font-weight:700;font-size:1.05rem;margin:22px 0 4px;color:var(--ink);}

/* barras empilhadas: rótulo em HTML, traço em SVG esticado, texto em px reais */
.pb{margin:10px 0 6px;}
.pb-leg{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;padding:0;margin:0 0 10px;font-size:.84rem;color:var(--ink-2);}
.pb-leg li{display:inline-flex;align-items:center;gap:8px;}
.pb-leg i{display:inline-block;width:14px;height:14px;border-radius:3px;}
.pb-linha,.pb-eixo{display:grid;grid-template-columns:104px minmax(0,1fr) 112px;gap:12px;align-items:center;margin:0 0 6px;}
.pb-rot{font-family:var(--disp);font-weight:600;font-size:.84rem;color:var(--ink-2);font-variant-numeric:tabular-nums;white-space:nowrap;}
.pb-barra{display:block;width:100%;height:28px;border-radius:5px;background:var(--bg-2);overflow:hidden;}
.pb-tempo{font-size:.8rem;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;}
.pb-tempo b{color:var(--ink);font-family:var(--disp);font-size:.92rem;}
.pb-eixo{margin-top:2px;}
.pb-escala{position:relative;height:16px;}
.pb-escala span{position:absolute;top:0;transform:translateX(-50%);font-size:.72rem;color:var(--muted);font-variant-numeric:tabular-nums;}
.pb-escala span:first-child{transform:none;} .pb-escala span:last-child{transform:translateX(-100%);}
@media (max-width:520px){
  .pb-linha,.pb-eixo{grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;}
  .pb-linha .pb-barra{grid-column:1 / -1;grid-row:2;}
  .pb-linha .pb-rot{grid-row:1;grid-column:1;}
  .pb-linha .pb-tempo{grid-row:1;grid-column:2;text-align:right;}
  .pb-linha{margin-bottom:12px;}
  .pb-eixo{grid-template-columns:minmax(0,1fr);} .pb-eixo .pb-rot,.pb-eixo .pb-tempo{display:none;}
}

/* números-chave */
.pp-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 6px;}
.pp-kpi{border-left:3px solid var(--line-2);padding:2px 0 2px 14px;}
.pp-kpi:nth-child(3){border-left-color:var(--gold-2);}
.pp-v{display:block;font-family:var(--disp);font-weight:700;font-size:clamp(1.5rem,4.4vw,2rem);color:var(--ink);font-variant-numeric:tabular-nums;line-height:1.1;}
.pp-r{display:block;font-size:.84rem;color:var(--ink-2);margin-top:4px;}
@media (max-width:760px){.pp-kpis{grid-template-columns:repeat(2,minmax(0,1fr));}}
.pp-meio{margin-top:22px;}
.ev-tb .sub{white-space:normal;}
