/* Gráfico de linha em SVG. */
.grafico-caixa { margin: var(--e4) 0; }
.grafico-area { width: 100%; touch-action: pan-y; }
.grafico { display: block; overflow: visible; user-select: none; -webkit-user-select: none; cursor: crosshair; }
.g-grade { stroke: var(--linha); stroke-width: 1; }
.g-eixo { fill: var(--mut); font-size: var(--t-s); font-family: inherit; font-variant-numeric: tabular-nums; }
.g-linha { stroke: var(--txt); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.g-ponto { fill: var(--s1); stroke: var(--txt); stroke-width: 2; }
.g-ponto-ativo { fill: var(--acc); stroke: var(--s1); stroke-width: 3; }
.g-guia { stroke: var(--mut); stroke-width: 1; stroke-dasharray: 3 4; }
.g-dica rect { fill: var(--s3); stroke: var(--linha); }
.g-dica text { fill: var(--txt); font-size: var(--t-s); font-weight: 600; font-family: inherit; }
.grafico-nota { margin-top: var(--e1); font-size: var(--t-s); color: var(--mut); text-align: center; }

.g-guia, .g-dica { opacity: 0; pointer-events: none; }
.grafico.tocado .g-guia, .grafico.tocado .g-dica { opacity: 1; }