.mermaid-container{margin:2rem 0;position:relative;width:100%}.mermaid{display:flex;justify-content:center;align-items:center;padding:1rem;background-color:var(--color-surface,#ffffff);border:1px solid var(--color-border,#e5e7eb);border-radius:.5rem;overflow-x:auto;overflow-y:visible;min-height:200px;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,segoe ui,Roboto,sans-serif}@media(prefers-color-scheme:dark){.mermaid{background-color:var(--color-surface-dark,#1f2937);border-color:var(--color-border-dark,#374151)}}html.dark .mermaid{background-color:var(--color-surface-dark,#1f2937);border-color:var(--color-border-dark,#374151)}.mermaid svg{max-width:100%;height:auto;display:block;margin:0 auto;width:100%;overflow:visible}.mermaid svg[viewBox]{width:100%;height:auto}.mermaid-container{display:flex;justify-content:center;overflow:hidden}.mermaid svg{transform-origin:center top;transition:transform .2s ease}@media(max-width:640px){.mermaid-container{margin:1.5rem -1rem}.mermaid{border-radius:0;border-left:none;border-right:none;padding:.75rem}.mermaid{-webkit-overflow-scrolling:touch;scroll-behavior:smooth}.mermaid::after{content:'';position:absolute;right:0;top:0;bottom:0;width:2rem;background:linear-gradient(to left,rgba(0,0,0,.1),transparent);pointer-events:none;opacity:0;transition:opacity .3s ease}.mermaid.scrollable::after{opacity:1}}.mermaid[data-processed=false]::before{content:'Loading diagram...';display:flex;justify-content:center;align-items:center;color:var(--color-text-muted,#6b7280);font-size:.875rem;font-style:italic}.mermaid-error{padding:1rem;background-color:#fef2f2;border:1px solid #fecaca;border-radius:.5rem;color:#991b1b}html.dark .mermaid-error{background-color:#7f1d1d;border-color:#991b1b;color:#fecaca}.mermaid-error p{margin:0 0 .5rem;font-weight:600}.mermaid-error details{margin-top:.5rem}.mermaid-error summary{cursor:pointer;font-weight:500;padding:.25rem 0}.mermaid-error summary:hover{text-decoration:underline}.mermaid-code,.mermaid-fallback code{display:block;padding:1rem;background-color:var(--color-code-bg,#f9fafb);border:1px solid var(--color-border,#e5e7eb);border-radius:.375rem;overflow-x:auto;font-family:ui-monospace,cascadia code,source code pro,Menlo,Consolas,monospace;font-size:.875rem;line-height:1.5;color:var(--color-text,#1f2937)}html.dark .mermaid-code,html.dark .mermaid-fallback code{background-color:var(--color-code-bg-dark,#111827);border-color:var(--color-border-dark,#374151);color:var(--color-text-dark,#f9fafb)}.mermaid-fallback{padding:1rem;background-color:#fffbeb;border:1px solid #fde68a;border-radius:.5rem}html.dark .mermaid-fallback{background-color:#78350f;border-color:#92400e}.mermaid-fallback details{margin-top:.5rem}.mermaid-fallback summary{cursor:pointer;font-weight:500;padding:.25rem 0;color:var(--color-warning,#92400e)}html.dark .mermaid-fallback summary{color:var(--color-warning-dark,#fde68a)}.mermaid:focus-visible,.mermaid-fallback summary:focus-visible,.mermaid-error summary:focus-visible{outline:2px solid var(--color-focus,#3b82f6);outline-offset:2px;border-radius:.25rem}.mermaid svg a:focus-visible{outline:2px solid var(--color-focus,#3b82f6);outline-offset:2px}.mermaid-container.zoomable .mermaid{cursor:zoom-in;transition:transform .3s ease}.mermaid-container.zoomable .mermaid:hover{transform:scale(1.02)}.mermaid-container.zoomable .mermaid:active,.mermaid-container.zoomable .mermaid.zoomed{cursor:zoom-out;transform:scale(1.5);z-index:1000}@media(prefers-contrast:high){.mermaid{border-width:2px}.mermaid svg{filter:contrast(1.2)}}@media(prefers-reduced-motion:reduce){.mermaid-container.zoomable .mermaid{transition:none}.mermaid{scroll-behavior:auto}}@media print{.mermaid-container{break-inside:avoid;page-break-inside:avoid}.mermaid{border:1px solid #000;background-color:#fff}.mermaid-fallback,.mermaid-error{display:none}}.mermaid-container{cursor:pointer;position:relative}.mermaid-expand-hint{position:absolute;top:.5rem;right:.5rem;width:2rem;height:2rem;background:rgba(0,0,0,.6);border-radius:.375rem;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s ease;z-index:10;pointer-events:none}.mermaid-expand-hint svg{width:1.25rem;height:1.25rem;color:#fff}.mermaid-container:hover .mermaid-expand-hint{opacity:1}.mermaid-modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background:rgba(0,0,0,.9);z-index:9999;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;padding:2rem;box-sizing:border-box}.mermaid-modal.active{opacity:1;visibility:visible}.mermaid-modal-content{background:var(--color-surface,#ffffff);border-radius:.75rem;max-width:95vw;max-height:90vh;overflow:auto;padding:2rem;position:relative;box-shadow:0 25px 50px -12px rgba(0,0,0,.5)}html.dark .mermaid-modal-content{background:var(--color-surface-dark,#1f2937)}.mermaid-modal-content svg{max-width:100%;height:auto;display:block}.mermaid-modal-close{position:absolute;top:1rem;right:1rem;width:2.5rem;height:2.5rem;background:var(--color-border,#e5e7eb);border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease,transform .2s ease;z-index:10}.mermaid-modal-close:hover{background:var(--color-text-muted,#6b7280);transform:scale(1.1)}.mermaid-modal-close:hover svg{color:#fff}.mermaid-modal-close svg{width:1.5rem;height:1.5rem;color:var(--color-text,#1f2937)}html.dark .mermaid-modal-close{background:var(--color-border-dark,#374151)}html.dark .mermaid-modal-close svg{color:var(--color-text-dark,#f9fafb)}html.dark .mermaid-modal-close:hover{background:var(--color-text-muted,#9ca3af)}.mermaid-modal-hint{position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);color:rgba(255,255,255,.7);font-size:.875rem;pointer-events:none}.mermaid-modal-close:focus-visible{outline:2px solid var(--color-focus,#3b82f6);outline-offset:2px}body.mermaid-modal-open{overflow:hidden}:root{--mermaid-primary:#3b82f6;--mermaid-secondary:#8b5cf6;--mermaid-tertiary:#ec4899;--mermaid-text:#1f2937;--mermaid-border:#6b7280}html.dark{--mermaid-primary:#60a5fa;--mermaid-secondary:#a78bfa;--mermaid-tertiary:#f472b6;--mermaid-text:#f9fafb;--mermaid-border:#9ca3af}