.mermaid-app *{box-sizing:border-box}.mermaid-app{display:grid;grid-template-columns:200px 1fr 1fr;height:100%;min-height:0;flex:1;overflow:hidden;background:#0a0a0d;color:#e4e4e7;font-family:system-ui,-apple-system,sans-serif;font-size:13px}.sidebar{display:flex;flex-direction:column;border-right:1px solid #1e1e24;background:#0d0d10;overflow:hidden;min-height:0}.sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:0 12px;height:38px;border-bottom:1px solid #1e1e24;gap:8px;flex-shrink:0;background:#0d0d10}.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:4px;overflow-y:auto;flex:1;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:16px 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-pane{display:flex;flex-direction:column;border-right:1px solid #1e1e24;overflow:hidden;min-height:0;background:#0a0a0d}.editor-header{display:flex;align-items:center;padding:0 12px;height:38px;border-bottom:1px solid #1e1e24;flex-shrink:0;gap:8px;background:#0d0d10}.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:11.5px;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:#0a0a0d;border-right:1px solid #18181c;overflow:hidden;user-select:none;white-space:pre;padding:10px 8px 10px 4px}.code-editor{flex:1;background:#0a0a0d;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:#27272e;white-space:pre-wrap}.code-editor:focus{background:#0b0b0f}.editor-statusbar{display:flex;align-items:center;gap:12px;padding:0 12px;height:24px;border-top:1px solid #1a1a20;background:#09090c;flex-shrink:0}.status-item{font-size:11px;color:#3f3f46;user-select:none;font-family:ui-monospace,monospace}.preview-pane{display:flex;flex-direction:column;overflow:hidden;min-height:0;background:#08080b}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:0 8px 0 12px;height:38px;border-bottom:1px solid #1e1e24;flex-shrink:0;background:#0d0d10;gap:8px}.preview-heading{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#52525b;user-select:none}.preview-actions{display:flex;align-items:center;gap:1px}.zoom-label{font-size:11px;color:#52525b;font-family:ui-monospace,monospace;min-width:32px;text-align:center;user-select:none}.preview-divider{width:1px;height:16px;background:#2a2a32;margin:0 4px;flex-shrink:0}.preview-body{flex:1;min-height:0;position:relative;overflow:hidden;display:flex;flex-direction:column}.preview-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:13px;color:#3f3f46;text-align:center;padding:2rem;line-height:1.7;flex:1;user-select:none}.preview-scroll{flex:1;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{padding:20px;min-height:100%;display:flex;align-items:flex-start;justify-content:center}.preview-content{display:flex;justify-content:center}.preview-content svg{display:block;flex-shrink:0}.error-display{margin:16px;background:#dc26260f;border:1px solid rgba(220,38,38,.2);border-radius:8px;padding:12px 14px;flex-shrink:0}.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}.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:960px){.mermaid-app{grid-template-columns:180px 1fr;grid-template-rows:1fr 1fr}.sidebar{grid-row:1 / 3}.editor-pane{border-right:none;border-bottom:1px solid #1e1e24}}@media(max-width:600px){.mermaid-app{grid-template-columns:1fr;grid-template-rows:auto 1fr 1fr}.sidebar{grid-row:auto;border-right:none;border-bottom:1px solid #1e1e24;flex-direction:row;height:42px;min-height:0}.sidebar-header{width:100%}.file-list,.line-numbers{display:none}}