.editor-container[data-v-20af2104]{position:relative;width:100%;height:100%;background:var(--bg-primary)}.line-numbers[data-v-20af2104]{position:absolute;left:0;top:0;width:50px;height:100%;background:var(--bg-secondary);border-right:1px solid var(--border-color);overflow:hidden;-webkit-user-select:none;user-select:none;padding:12px 0}.line-number[data-v-20af2104]{height:20px;line-height:20px;text-align:right;padding-right:12px;font-size:13px;color:var(--text-secondary);font-family:Monaco,Menlo,Consolas,monospace}.editor-textarea[data-v-20af2104]{width:100%;height:100%;padding:12px 12px 12px 62px;border:none;outline:none;resize:none;font-size:14px;line-height:20px;font-family:Monaco,Menlo,Consolas,monospace;background:var(--bg-primary);color:var(--text-primary);-moz-tab-size:2;tab-size:2}.editor-textarea[data-v-20af2104]::placeholder{color:var(--text-secondary);opacity:.5}.preview-container[data-v-fb0a8b63]{position:relative;width:100%;height:100%;background:var(--bg-primary);overflow:hidden;cursor:grab;outline:none}.preview-container.dot-bg[data-v-fb0a8b63]{background-image:radial-gradient(circle,#e0e0e0 2px,transparent 2px);background-size:32px 32px;background-color:var(--bg-primary)}.preview-container.dot-bg.dark[data-v-fb0a8b63]{background-image:radial-gradient(circle,#3a3a3a 2px,transparent 2px);background-size:32px 32px;background-color:#1a1a2e}.preview-container.dragging[data-v-fb0a8b63]{cursor:grabbing}.preview-container.dark[data-v-fb0a8b63]{background-color:#1a1a2e}.preview-container.fullscreen[data-v-fb0a8b63]{position:fixed;top:50px;left:0;right:0;bottom:0;z-index:50}.preview-toolbar[data-v-fb0a8b63]{position:absolute;top:12px;right:12px;display:flex;align-items:center;gap:4px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;padding:4px;box-shadow:0 2px 8px #0000001a;z-index:10;cursor:default}.toolbar-btn[data-v-fb0a8b63]{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border:none;background:transparent;color:var(--text-primary);border-radius:4px;cursor:pointer;transition:background .2s}.toolbar-btn[data-v-fb0a8b63]:hover{background:var(--hover-bg)}.toolbar-divider[data-v-fb0a8b63]{width:1px;height:20px;background:var(--border-color);margin:0 4px}.zoom-label[data-v-fb0a8b63]{font-size:12px;color:var(--text-secondary);min-width:40px;text-align:center}.preview-content[data-v-fb0a8b63]{width:100%;height:100%;overflow:hidden;display:flex;align-items:center;justify-content:center}.diagram-wrapper[data-v-fb0a8b63]{transition:transform .1s ease-out;will-change:transform}.preview-container.dragging .diagram-wrapper[data-v-fb0a8b63]{transition:none}.diagram-wrapper[data-v-fb0a8b63] svg{display:block}.drag-hint[data-v-fb0a8b63]{position:absolute;bottom:20px;left:50%;transform:translate(-50%);padding:8px 16px;background:#000000b3;color:#fff;border-radius:20px;font-size:12px;pointer-events:none;animation:fadeInOut-fb0a8b63 3s ease-in-out}@keyframes fadeInOut-fb0a8b63{0%{opacity:0}10%{opacity:1}80%{opacity:1}to{opacity:0}}.error-message[data-v-fb0a8b63]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:20px;background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:8px;color:#f44336;max-width:80%;white-space:pre-wrap;font-family:monospace;font-size:12px}.app[data-v-fd6e725f]{width:100%;height:100%;display:flex;flex-direction:column;background:var(--bg-primary);color:var(--text-primary)}.header[data-v-fd6e725f]{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 20px;border-bottom:1px solid var(--border-color);background:var(--bg-primary)}.header-left[data-v-fd6e725f]{display:flex;align-items:center;gap:12px}.logo[data-v-fd6e725f]{display:flex;align-items:center}.title[data-v-fd6e725f]{font-size:16px;font-weight:500;color:var(--text-primary)}.header-center[data-v-fd6e725f]{display:flex;align-items:center}.theme-selector[data-v-fd6e725f]{display:flex;gap:4px;padding:4px;background:var(--bg-secondary);border-radius:6px}.theme-btn[data-v-fd6e725f]{padding:6px 12px;border:none;background:transparent;color:var(--text-secondary);border-radius:4px;cursor:pointer;font-size:13px;transition:all .2s}.theme-btn[data-v-fd6e725f]:hover{color:var(--text-primary);background:var(--hover-bg)}.theme-btn.active[data-v-fd6e725f]{background:var(--bg-primary);color:var(--text-primary);box-shadow:0 1px 3px #0000001a}.header-right[data-v-fd6e725f]{display:flex;gap:8px}.btn[data-v-fd6e725f]{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--border-color);background:var(--bg-primary);color:var(--text-primary);border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s}.btn[data-v-fd6e725f]:hover{background:var(--hover-bg)}.icon-btn[data-v-fd6e725f]{padding:6px 8px}.icon-btn.active[data-v-fd6e725f]{background:var(--accent-color);border-color:var(--accent-color);color:#fff}.icon-btn.active[data-v-fd6e725f]:hover{background:#d81b60}.dropdown[data-v-fd6e725f]{position:relative}.dropdown-menu[data-v-fd6e725f]{position:absolute;top:100%;right:0;margin-top:4px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:6px;box-shadow:0 4px 12px #00000026;min-width:140px;z-index:100;overflow:hidden}.dropdown-item[data-v-fd6e725f]{display:flex;align-items:center;gap:8px;width:100%;padding:10px 14px;border:none;background:transparent;color:var(--text-primary);font-size:14px;cursor:pointer;text-align:left;transition:background .2s}.dropdown-item[data-v-fd6e725f]:hover{background:var(--hover-bg)}.main-content[data-v-fd6e725f]{flex:1;display:flex;overflow:hidden}.main-content.preview-fullscreen .preview-panel[data-v-fd6e725f]{width:100%}.editor-panel[data-v-fd6e725f]{width:30%;height:100%;border-right:1px solid var(--border-color)}.divider[data-v-fd6e725f]{width:4px;cursor:col-resize;background:var(--border-color);transition:background .2s}.divider[data-v-fd6e725f]:hover{background:var(--accent-color)}.preview-panel[data-v-fd6e725f]{flex:1;height:100%;overflow:hidden}.examples-bar[data-v-fd6e725f]{position:absolute;bottom:40px;left:20px;background:var(--bg-primary);border:1px solid var(--border-color);border-radius:8px;padding:12px;box-shadow:0 2px 8px #0000001a;max-width:600px}.examples-header[data-v-fd6e725f]{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.examples-title[data-v-fd6e725f]{font-size:12px;color:var(--text-secondary)}.close-btn[data-v-fd6e725f]{border:none;background:none;font-size:20px;cursor:pointer;color:var(--text-secondary);padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center}.close-btn[data-v-fd6e725f]:hover{color:var(--text-primary)}.examples-list[data-v-fd6e725f]{display:flex;flex-wrap:wrap;gap:8px}.example-item[data-v-fd6e725f]{padding:6px 12px;border:1px solid var(--border-color);background:var(--bg-secondary);color:var(--text-primary);border-radius:4px;cursor:pointer;font-size:13px;transition:all .2s}.example-item[data-v-fd6e725f]:hover{background:var(--hover-bg);border-color:var(--accent-color)}.footer-info[data-v-fd6e725f]{position:absolute;bottom:12px;right:12px;display:flex;align-items:center;gap:12px;font-size:12px;color:var(--text-secondary)}.btn-text[data-v-fd6e725f]{border:none;background:none;color:var(--text-secondary);cursor:pointer;font-size:12px;padding:4px 8px;border-radius:4px;transition:all .2s}.btn-text[data-v-fd6e725f]:hover{background:var(--hover-bg);color:var(--text-primary)}.version[data-v-fd6e725f]{padding:4px 8px;background:var(--bg-secondary);border-radius:4px}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}#app{width:100vw;height:100vh}:root{--bg-primary: #ffffff;--bg-secondary: #f5f5f5;--border-color: #e0e0e0;--text-primary: #333333;--text-secondary: #666666;--accent-color: #e91e63;--hover-bg: #f0f0f0}.dark{--bg-primary: #1e1e1e;--bg-secondary: #252526;--border-color: #3e3e42;--text-primary: #d4d4d4;--text-secondary: #969696;--accent-color: #e91e63;--hover-bg: #2a2a2a}