/* Material styles every <pre> as a code block. The mermaid integration emits
   <pre class="mermaid"> so we have to undo the code-block visual treatment and
   let the SVG own its dimensions. */
pre.mermaid,
.mermaid {
  background: transparent;
  border: none;
  box-shadow: none;
  padding: 0;
  margin: 1rem 0;
  overflow: visible;
  font-size: 0;
  text-align: center;
}

pre.mermaid > svg,
.mermaid > svg {
  max-width: 100%;
  height: auto;
}

/* The original ```mermaid``` source survives as a child <code> when
   superfences uses fence_code_format. Hide it once mermaid.js has rendered the
   sibling SVG so we do not show the raw flowchart text underneath the diagram. */
pre.mermaid:has(svg) > code,
.mermaid:has(svg) > code {
  display: none;
}