.markdown-body .blog-diagram { position: relative; z-index: 1; margin: 1.5rem 0; padding: 12px; border: 1px solid var(--line-color, #ddd); border-radius: 8px; }
.mermaid-diagram { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.mermaid-diagram svg { display: block; margin: 0 auto; }
.mermaid-diagram:focus-visible { outline: 2px solid var(--post-link-color, #1565c0); outline-offset: 3px; }
.mermaid-diagram pre { white-space: pre-wrap; }
.markdown-body .blog-diagram > figcaption { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 8px; color: var(--sec-text-color, #666); font-size: 13px; }
.blog-diagram figcaption button { min-height: 44px; padding: 8px 12px; border: 1px solid var(--line-color, #ddd); border-radius: 6px; color: var(--post-link-color, #1565c0); background: transparent; font: inherit; cursor: pointer; }
@media print {
  .markdown-body .blog-diagram > figcaption { display: none; }
  .mermaid-diagram { overflow: visible; }
  .mermaid-diagram svg { max-width: 100% !important; width: 100% !important; }
}