/** Destaque de expressões matemáticas (bloco e inline).
 *  Bloco: .math-out  |  Inline: .math-inline
 *  Estética: cartão de equação com barra de acento, fundo suave, fonte mono e selo Σ.
 */
.math-out {
  position: relative;
  margin: 1.6rem 0;
  padding: 1.05rem 3rem 1.05rem 1.25rem;
  background: linear-gradient(135deg, rgba(7,61,53,.06) 0%, color-mix(in srgb, #073D35 4%, #fff) 100%);
  border: 1px solid color-mix(in srgb, #073D35 22%, transparent);
  border-left: 4px solid #073D35;
  border-radius: 14px;
  font-family: var(--font-mono, "JetBrains Mono", monospace);
  font-size: 1.02rem;
  line-height: 1.7;
  letter-spacing: .005em;
  color: color-mix(in srgb, #073D35 40%, #10151c);
  overflow-x: auto;
  box-shadow: 0 1px 0 color-mix(in srgb, #073D35 12%, transparent) inset;
}
.math-out::after {
  content: "Σ";
  position: absolute;
  top: .55rem;
  right: .85rem;
  font-family: var(--font-display, Georgia, serif);
  font-size: 1.15rem;
  line-height: 1;
  color: #073D35;
  opacity: .72;
}
.math-out sub, .math-out sup { font-size: .72em; }
.math-out + p, p + .math-out { margin-top: 1.1rem; }

.math-inline {
  font-family: var(--font-mono, "JetBrains Mono", monospace);
  font-size: .96em;
  padding: .1em .42em;
  margin: 0 .06em;
  border-radius: 7px;
  background: rgba(7,61,53,.06);
  border: 1px solid color-mix(in srgb, #073D35 26%, transparent);
  color: color-mix(in srgb, #073D35 55%, #10151c);
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
  white-space: normal;
}

@media (max-width: 32rem) {
  .math-out { padding: .9rem 2.4rem .9rem 1rem; font-size: .95rem; }
  .math-out::after { top: .45rem; right: .6rem; font-size: 1rem; }
}
@media print {
  .math-out { background: none; border-left-color: #000; }
  .math-inline { background: none; border: 0; }
}