.mermaid-source {min-height: 150px; max-height: 420px; font-family: monospace; resize: vertical;}
.mermaid-bar {display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin:12px 0;}
.mermaid-bar .tool-label {margin:0;}
.mermaid-bar .tool-select {width:auto; max-width:260px;}
.mermaid-view-panel {border:1px solid #d1d5db; border-radius:6px; padding:12px; background:#fff; min-width:0;}
.mermaid-view-panel .mermaid-bar {margin-top:0;}
.mermaid-view {min-width:0; height:clamp(380px,62vh,850px); overflow:auto; background:repeating-conic-gradient(#e5e7eb 0% 25%,#f3f4f6 0% 50%) 0 0/20px 20px; border:1px solid #e5e7eb;}
.mermaid-stage {display:flex; justify-content:center; align-items:center; padding:20px; min-height:100%; min-width:100%; width:max-content; box-sizing:border-box;}
.mermaid-stage img {display:block; max-width:none; flex:none;}
#mermaid-empty {max-width:520px; text-align:center; padding:24px; background:#fff;}
.mermaid-options {display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:16px; margin-top:16px;}
.mermaid-options[hidden], #mermaid-image[hidden], #mermaid-empty[hidden], #mermaid-status:empty {display:none;}
.mermaid-options .tool-check {margin-top:26px;}
.mermaid-view-panel:fullscreen, .mermaid-view-panel.preview-expanded {display:flex; flex-direction:column; width:100%; height:100dvh; padding:12px; border:0; border-radius:0; box-sizing:border-box; background:#fff;}
.mermaid-view-panel.preview-expanded {position:fixed; inset:0; z-index:10000;}
.mermaid-view-panel:fullscreen .mermaid-view, .mermaid-view-panel.preview-expanded .mermaid-view {flex:1; height:auto; min-height:0;}
.mermaid-view-panel .preview-fullscreen-button {margin-left:auto;}
.markdown-mermaid-figure {background:#fff; overflow:auto; padding:8px; margin:16px 0;}
.markdown-mermaid-figure img {display:block; max-width:100%; height:auto; margin:0 auto;}
@media(max-width:720px) {
    .mermaid-view {height:60dvh; min-height:320px;}
    .mermaid-stage {padding:12px;}
    .mermaid-bar .tool-select {max-width:160px;}
    .mermaid-options {grid-template-columns:repeat(2,minmax(0,1fr));}
    .mermaid-options .tool-input,.mermaid-options .tool-select {min-width:0;}
}
