.mermaid-app *{box-sizing:border-box}.mermaid-app{--panel-w: 400px;position:relative;height:100%;min-height:0;flex:1;overflow:hidden;background:#0a0a0f;color:#e4e4e7;font-family:system-ui,-apple-system,sans-serif;font-size:13px}.preview-canvas{position:absolute;inset:0;background-color:#0a0a0f;background-image:radial-gradient(#17171f 1px,transparent 1px);background-size:24px 24px}.preview-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;color:#52525b;text-align:center;padding:2rem;line-height:1.7;user-select:none;pointer-events:none}.preview-scroll{position:absolute;inset:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#2a2a32 transparent;cursor:grab}.preview-scroll::-webkit-scrollbar{width:6px;height:6px}.preview-scroll::-webkit-scrollbar-thumb{background:#2a2a32;border-radius:4px}.preview-inner{display:flex;min-height:100%;min-width:100%;width:max-content;padding:48px}@media(min-width:701px){.mermaid-app:not(.panel-collapsed) .preview-inner{padding-inline-start:calc(var(--panel-w) + 72px)}}.preview-content{margin:auto;display:flex}.preview-content svg{display:block;flex-shrink:0}.error-display{position:absolute;top:60px;inset-inline-end:12px;width:min(440px,calc(100% - 24px));z-index:25;background:#1e0a0aeb;backdrop-filter:blur(8px);border:1px solid rgba(220,38,38,.3);border-radius:10px;padding:12px 14px;box-shadow:0 8px 28px #00000073}.error-header{display:flex;align-items:center;gap:6px;margin-bottom:8px;color:#f87171}.error-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}.error-message{margin:0;font-family:ui-monospace,monospace;font-size:12px;color:#fca5a5;white-space:pre-wrap;word-break:break-word;line-height:1.5;opacity:.85;max-height:40vh;overflow-y:auto}.map-controls{position:absolute;z-index:20;display:flex;gap:8px}.map-controls-export{top:12px;inset-inline-end:12px}.map-controls-zoom{bottom:20px;inset-inline-end:12px;flex-direction:column;align-items:center;gap:8px}.map-btn{display:flex;align-items:center;justify-content:center;gap:7px;height:36px;min-width:36px;padding:0 12px;background:#13131aeb;backdrop-filter:blur(8px);border:1px solid #26262f;border-radius:9px;color:#a1a1aa;font-size:12.5px;font-family:inherit;cursor:pointer;box-shadow:0 2px 12px #00000059;transition:background .12s,color .12s,border-color .12s}.map-btn:hover{background:#1e1e2a;color:#e4e4e7;border-color:#34343f}.map-btn:active{background:#27273a}.map-btn-square{padding:0;width:36px}.map-btn-label{white-space:nowrap}.zoom-stack{display:flex;flex-direction:column;background:#13131aeb;backdrop-filter:blur(8px);border:1px solid #26262f;border-radius:9px;box-shadow:0 2px 12px #00000059;overflow:hidden}.zoom-stack .map-btn{background:transparent;border:none;border-radius:0;box-shadow:none;backdrop-filter:none}.zoom-stack-divider{height:1px;background:#26262f;margin:0 7px}.zoom-label{font-size:11px;color:#71717a;font-family:ui-monospace,monospace;min-width:36px;text-align:center;user-select:none;background:#13131ad9;border-radius:6px;padding:3px 5px}.export-wrap{position:relative}.export-menu{position:absolute;top:calc(100% + 6px);inset-inline-end:0;min-width:230px;background:#15151c;border:1px solid #2a2a35;border-radius:10px;padding:4px;box-shadow:0 8px 28px #00000080;z-index:40}.export-menu button{display:block;width:100%;text-align:start;padding:8px 10px;background:none;border:none;border-radius:6px;color:#c4c4d0;font-size:12.5px;font-family:inherit;cursor:pointer;white-space:nowrap}.export-menu button:hover{background:#22222e;color:#fff}.editor-panel{position:absolute;top:12px;bottom:12px;inset-inline-start:12px;width:var(--panel-w);display:flex;flex-direction:column;background:#0d0d11f0;backdrop-filter:blur(12px);border:1px solid #23232c;border-radius:12px;box-shadow:0 8px 32px #00000080;overflow:hidden;z-index:30;transition:transform .22s ease,opacity .22s ease}.mermaid-app.panel-collapsed .editor-panel{transform:translate(calc(-100% - 24px));opacity:.4;pointer-events:none}.mermaid-app[dir=rtl].panel-collapsed .editor-panel{transform:translate(calc(100% + 24px))}.panel-toggle{position:absolute;top:50%;transform:translateY(-50%);inset-inline-start:calc(var(--panel-w) + 16px);width:26px;height:58px;display:flex;align-items:center;justify-content:center;background:#13131aeb;backdrop-filter:blur(8px);border:1px solid #26262f;border-radius:8px;color:#71717a;cursor:pointer;padding:0;z-index:29;box-shadow:0 2px 12px #00000059;transition:inset-inline-start .22s ease,background .12s,color .12s}.panel-toggle:hover{background:#1e1e2a;color:#e4e4e7}.mermaid-app.panel-collapsed .panel-toggle{inset-inline-start:8px}.panel-toggle svg{transition:transform .2s}.mermaid-app.panel-collapsed .panel-toggle svg{transform:rotate(180deg)}.mermaid-app[dir=rtl] .panel-toggle svg{transform:rotate(180deg)}.mermaid-app[dir=rtl].panel-collapsed .panel-toggle svg{transform:rotate(0)}.panel-files{display:flex;flex-direction:column;border-bottom:1px solid #1e1e24;flex-shrink:0}.files-header{display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:36px;gap:8px;flex-shrink:0}.sidebar-heading{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#52525b;user-select:none}.btn-new{display:flex;align-items:center;justify-content:center;width:24px;height:24px;background:transparent;border:1px solid #2a2a32;border-radius:5px;color:#71717a;cursor:pointer;transition:background .12s,color .12s,border-color .12s;flex-shrink:0;padding:0}.btn-new:hover{background:#1e1e2a;color:#a78bfa;border-color:#3d3d52}.file-list{list-style:none;margin:0;padding:0 6px 6px;overflow-y:auto;max-height:132px;min-height:0;scrollbar-width:thin;scrollbar-color:#2a2a32 transparent}.file-list::-webkit-scrollbar{width:4px}.file-list::-webkit-scrollbar-thumb{background:#2a2a32;border-radius:4px}.file-list-empty{font-size:12px;color:#3f3f46;padding:12px 8px;text-align:center;user-select:none}.file-item{display:flex;align-items:center;gap:6px;padding:5px 6px;border-radius:5px;cursor:pointer;transition:background .1s;margin-bottom:1px;border:1px solid transparent}.file-item:hover{background:#16161e}.file-item.active{background:#1a1a2e;border-color:#2d2d4e}.file-item.active .file-name{color:#a78bfa}.file-icon{display:flex;align-items:center;color:#3f3f46;flex-shrink:0}.file-item.active .file-icon{color:#6d5fbc}.file-name{flex:1;font-size:12.5px;color:#a1a1aa;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:none;line-height:1.3}.btn-delete{display:flex;align-items:center;justify-content:center;width:20px;height:20px;background:none;border:none;color:#3f3f46;cursor:pointer;padding:0;border-radius:3px;opacity:0;transition:opacity .1s,color .1s,background .1s;flex-shrink:0}.file-item:hover .btn-delete{opacity:1}.btn-delete:hover{color:#f87171;background:#ef44441f}.icon-btn{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:transparent;border:none;border-radius:5px;color:#52525b;cursor:pointer;padding:0;transition:background .12s,color .12s;flex-shrink:0}.icon-btn:hover{background:#1e1e2a;color:#a1a1aa}.icon-btn:active{background:#27273a}.editor-header{display:flex;align-items:center;padding:0 12px;height:38px;border-bottom:1px solid #1e1e24;flex-shrink:0;gap:8px}.editor-header-actions{display:flex;align-items:center;gap:2px;flex-shrink:0}.title-input{flex:1;min-width:0;background:transparent;border:none;outline:none;color:#e4e4e7;font-size:13.5px;font-weight:600;font-family:inherit}.title-input::placeholder{color:#3f3f46;font-weight:400}.beta-warning{display:flex;align-items:flex-start;gap:7px;font-size:11px;color:#57534e;background:#0e0d0c;border-bottom:1px solid #1e1e1a;padding:6px 12px;line-height:1.55;flex-shrink:0}.editor-body{display:flex;flex:1;min-height:0;overflow:hidden;position:relative}.line-numbers{flex-shrink:0;width:38px;text-align:right;font-family:Fira Code,Cascadia Code,JetBrains Mono,ui-monospace,monospace;font-size:12.5px;line-height:1.6;color:#3f3f46;background:transparent;border-right:1px solid #18181c;overflow:hidden;user-select:none;white-space:pre;padding:10px 8px 10px 4px}.code-editor{flex:1;background:transparent;border:none;outline:none;color:#c4c4d0;font-family:Fira Code,Cascadia Code,JetBrains Mono,ui-monospace,monospace;font-size:12.5px;line-height:1.6;padding:10px 12px;resize:none;tab-size:2;white-space:pre;overflow-wrap:normal;overflow-x:auto;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#2a2a32 transparent;caret-color:#a78bfa}.code-editor::-webkit-scrollbar{width:6px;height:6px}.code-editor::-webkit-scrollbar-thumb{background:#2a2a32;border-radius:4px}.code-editor::placeholder{color:#3a3a44;white-space:pre-wrap}.editor-statusbar{display:flex;align-items:center;gap:12px;padding:0 12px;height:24px;border-top:1px solid #1a1a20;flex-shrink:0}.status-item{font-size:11px;color:#3f3f46;user-select:none;font-family:ui-monospace,monospace}.toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%) translateY(12px);background:#27273a;border:1px solid #3d3d52;color:#e4e4e7;font-size:12.5px;padding:8px 16px;border-radius:8px;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;white-space:nowrap;z-index:9999;box-shadow:0 4px 16px #0006}.toast.show{opacity:1;transform:translate(-50%) translateY(0)}.toast.toast-error{background:#2a1515;border-color:#5a2020;color:#fca5a5}@media(max-width:700px){.editor-panel{top:auto;inset-inline-start:0;inset-inline-end:0;bottom:0;width:auto;height:48vh;border-radius:14px 14px 0 0;border-left:none;border-right:none;border-bottom:none}.mermaid-app.panel-collapsed .editor-panel,.mermaid-app[dir=rtl].panel-collapsed .editor-panel{transform:translateY(calc(100% + 8px))}.panel-toggle{top:auto;bottom:calc(48vh + 10px);inset-inline-start:50%;transform:translate(-50%);width:58px;height:26px;transition:bottom .22s ease,background .12s,color .12s}.mermaid-app.panel-collapsed .panel-toggle{inset-inline-start:50%;bottom:10px}.panel-toggle svg,.mermaid-app[dir=rtl] .panel-toggle svg{transform:rotate(-90deg)}.mermaid-app.panel-collapsed .panel-toggle svg,.mermaid-app[dir=rtl].panel-collapsed .panel-toggle svg{transform:rotate(90deg)}.mermaid-app:not(.panel-collapsed) .preview-inner{padding-bottom:calc(48vh + 40px)}.map-controls-zoom{bottom:auto;top:60px}.map-btn-label,.line-numbers{display:none}.file-list{max-height:76px}}
