.cm-mermaid-keyword{color:#569cd6;font-weight:700}.cm-mermaid-variable{color:#9cdcfe}.cm-mermaid-string{color:#ce9178}.cm-mermaid-number{color:#b5cea8}.cm-mermaid-operator{color:#d4d4d4;font-weight:700}.cm-mermaid-bracket{color:gold}.cm-mermaid-comment{color:#6a9955;font-style:italic}.cm-mermaid-meta{color:#4ec9b0}[data-theme=dark] .cm-mermaid-keyword{color:#4fc3f7}[data-theme=dark] .cm-mermaid-variable{color:#a6e22e}[data-theme=dark] .cm-mermaid-string{color:#f92672}[data-theme=dark] .cm-mermaid-number{color:#ae81ff}[data-theme=dark] .cm-mermaid-operator{color:#f8f8f2}[data-theme=dark] .cm-mermaid-bracket{color:#ffd866}[data-theme=dark] .cm-mermaid-comment{color:#75715e}[data-theme=dark] .cm-mermaid-meta{color:#66d9ef}:root{--bg-primary: #111827;--bg-secondary: #1f2937;--bg-tertiary: rgba(17, 24, 39, .5);--text-primary: #f3f4f6;--text-secondary: #9ca3af;--border-color: #374151;--accent-hover: #3b82f6;--error-text: #f87171;--error-bg: rgba(153, 27, 27, .2);--button-bg: #374151;--button-text: #f9fafb;--button-hover-bg: #4b5563;--selection-bg: rgba(59, 130, 246, .2)}body.light{--bg-primary: #f9fafb;--bg-secondary: #ffffff;--bg-tertiary: rgba(249, 250, 251, .8);--text-primary: #1f2937;--text-secondary: #4b5563;--border-color: #e5e7eb;--accent-hover: #3b82f6;--error-text: #ef4444;--error-bg: rgba(254, 226, 226, 1);--button-bg: #e5e7eb;--button-text: #1f2937;--button-hover-bg: #d1d5db;--selection-bg: rgba(59, 130, 246, .15)}body{font-family:Inter,sans-serif;overflow:hidden;background-color:var(--bg-primary);color:var(--text-primary);transition:background-color .3s,color .3s}body.page-blogs{overflow:auto;overflow-x:hidden;overflow-y:auto}.code-block-container{position:relative}.copy-button{position:absolute;top:8px;right:8px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:6px;padding:4px 8px;font-size:12px;color:var(--text-secondary);cursor:pointer;opacity:.7;transition:all .2s ease;display:flex;align-items:center;gap:4px}.copy-button:hover{opacity:1;background:var(--button-hover-bg);color:var(--text-primary)}.copy-button svg{width:14px;height:14px}.code-block-container pre{padding-top:40px}#editor{font-family:Fira Code,monospace}#left-pane #editor-container{display:flex;flex-direction:column;height:100%;min-height:0}#left-pane .CodeMirror{height:100%;font-family:Fira Code,monospace;background-color:transparent;color:var(--text-primary);border:none;border-radius:0}#left-pane .CodeMirror-gutters{background-color:var(--bg-secondary);border-right:1px solid var(--border-color);border-radius:0}#left-pane .CodeMirror-linenumber{color:var(--text-secondary);font-size:.9em;padding-right:8px;text-align:right;min-width:2em;line-height:1.4}#left-pane .CodeMirror-linenumbers{background-color:var(--bg-secondary);border-right:1px solid var(--border-color);padding:0 4px;width:3em}#left-pane .CodeMirror-code{background-color:transparent}#left-pane .CodeMirror-cursor{border-left:1px solid var(--text-primary)}#left-pane .CodeMirror-selected,#left-pane .CodeMirror-focused .CodeMirror-selected{background-color:var(--selection-bg)}#resizer{transition:background-color .2s ease-in-out;background-color:var(--border-color)}#resizer:hover{background-color:var(--accent-hover)}#output svg{max-width:100%;height:auto}#output-container{scroll-behavior:smooth;position:relative;overflow:auto;overflow-x:auto;overflow-y:auto}#output-wrapper{transition:transform .2s ease-in-out;position:relative;display:flex;align-items:center;justify-content:center}#zoom-in-btn,#zoom-out-btn{opacity:.7;transition:opacity .2s ease-in-out}#zoom-in-btn:hover,#zoom-out-btn:hover{opacity:1}#zoom-in-btn:disabled,#zoom-out-btn:disabled{opacity:.3;cursor:not-allowed}#output-container::-webkit-scrollbar{width:8px;height:8px}#output-container::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:4px}#output-container::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}#output-container::-webkit-scrollbar-thumb:hover{background:var(--accent-hover)}#output-container.grab{cursor:grab}#output-container.grabbing{cursor:grabbing}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media (max-width: 768px){#navbar-default{position:absolute;top:100%;left:0;right:0;width:100%;z-index:9999;background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:0;margin:0;box-shadow:0 10px 25px -5px #0000001a,0 10px 10px -5px #0000000a}#navbar-default ul{width:100%;margin:0;padding:0;border-radius:0}#navbar-default ul li{width:100%}#navbar-default ul li button{color:var(--text-primary)!important;border-bottom:1px solid var(--border-color);width:100%;text-align:left;padding:1rem;border-radius:0}#navbar-default ul li:last-child button{border-bottom:none}}@media (max-width: 768px){body{overflow:auto}#container{flex-direction:column;overflow-y:auto}#left-pane,#right-pane{width:100%!important;height:calc(100vh - 100px)!important;overflow:auto}#resizer{display:none}body.mobile-show-editor #left-pane{display:flex}body.mobile-show-editor #right-pane,body.mobile-show-preview #left-pane{display:none}body.mobile-show-preview #right-pane{display:flex}#output-container{height:auto;min-height:50vh}header{position:sticky;top:0;z-index:40}footer{position:sticky;bottom:0;z-index:40}#top-toolbar{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;gap:.5rem}#top-toolbar>div{min-width:max-content}#footer-actions{overflow-x:auto;overflow-y:visible;-webkit-overflow-scrolling:touch;gap:.5rem;min-width:0}#footer-actions .footer-action,#footer-actions a{min-width:max-content;white-space:nowrap}}