/* JR OS 2026.141 — como o ícone se comporta no meio do texto.
   O emoji ficava grande demais, com cor própria, e derrubava a linha de base.
   O SVG acompanha o tamanho da letra e a cor de quem o contém. */
.jr-i{
  width:1.15em;height:1.15em;
  display:inline-block;vertical-align:-0.19em;
  flex:0 0 auto;
  color:inherit;
}
/* Espaço só quando existe texto ao lado — ícone sozinho não ganha respiro à toa. */
.jr-i:not(:only-child){margin-right:.42em}
.jr-i:not(:only-child):last-child{margin-right:0;margin-left:.42em}
/* Em botão e aba, quem manda no espaçamento é o gap do flex. */
button .jr-i,a .jr-i,[role="button"] .jr-i,.tab .jr-i,.chip .jr-i{margin:0}
button,a,[role="button"]{--jr-gap-icone:.5em}
button:has(.jr-i),a:has(.jr-i),[role="button"]:has(.jr-i){gap:var(--jr-gap-icone)}

/* Número grande de painel: o ícone ao lado não pode competir com o número. */
.metric .jr-i,.kpi .jr-i,.card>h2 .jr-i,h1 .jr-i{opacity:.75}
h1 .jr-i,h2 .jr-i{width:1em;height:1em;vertical-align:-0.12em}

/* Alto contraste e impressão continuam legíveis. */
@media(forced-colors:active){.jr-i{color:CanvasText}}
@media print{.jr-i{color:#000}}