.mermaid-diagram {
  width: 100%;
  margin: 2rem 0 0;
  padding: 1.4rem;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #b8b8b3 transparent;
  border: 1px solid #e5e5e0;
  border-radius: 10px;
  background: #ffffff;
  text-align: center;
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
}

.mermaid-diagram::-webkit-scrollbar { height: 8px; }
.mermaid-diagram::-webkit-scrollbar-track { background: transparent; }
.mermaid-diagram::-webkit-scrollbar-thumb {
  min-width: 48px;
  border: 2px solid #ffffff;
  border-radius: 999px;
  background: #b8b8b3;
}
.mermaid-diagram::-webkit-scrollbar-thumb:hover { background: #8f8f89; }

.mermaid-diagram svg {
  display: block;
  width: auto;
  min-width: 100%;
  max-width: none;
  height: auto;
  margin: 0 auto;
}

.mermaid-diagram .node rect,
.mermaid-diagram .node polygon,
.mermaid-diagram .node circle,
.mermaid-diagram .node ellipse {
  filter: none !important;
  stroke-width: 1px !important;
}

.mermaid-diagram .cluster rect {
  rx: 8px;
  ry: 8px;
  stroke-dasharray: none !important;
  stroke-width: 1px !important;
}

.mermaid-diagram .edgePath path,
.mermaid-diagram .flowchart-link {
  stroke-width: 1.25px !important;
}

.mermaid-diagram .edgeLabel,
.mermaid-diagram .labelBkg { background: #ffffff !important; }
.mermaid-diagram text,
.mermaid-diagram .label { letter-spacing: -0.01em; }

.mermaid-scroll-hint {
  display: none;
  margin: 0.4rem 0 1.6rem;
  color: #8a8a84;
  font-size: 0.76rem;
  text-align: center;
  user-select: none;
}
.mermaid-diagram.is-scrollable + .mermaid-scroll-hint { display: block; }

:root[data-theme='dark'] .mermaid-diagram {
  background: #171717;
  border-color: #333330;
  scrollbar-color: #62625d transparent;
}
:root[data-theme='dark'] .mermaid-diagram::-webkit-scrollbar-thumb {
  border-color: #171717;
  background: #62625d;
}
:root[data-theme='dark'] .mermaid-diagram .edgeLabel,
:root[data-theme='dark'] .mermaid-diagram .labelBkg { background: #171717 !important; }
:root[data-theme='dark'] .mermaid-scroll-hint { color: #8f8f89; }

@media (max-width: 767px) {
  .mermaid-diagram { padding: 1rem; border-radius: 8px; }
}