@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700&display=swap";:root{--bg:#f9fafb;--bg-2:#f1f5f9;--surface:#fff;--surface-2:#f4f6fa;--border:#e2e8f0;--border-2:#cbd5e1;--text:#0f172a;--text-dim:#475569;--accent:#4f46e5;--accent-light:#6366f1;--accent-glow:#4f46e51f;--shadow:0 1px 4px #0f172a14;--shadow-md:0 4px 16px #0f172a1a;--radius:8px;--toolbar-height:52px}:root[data-theme=dark]{--bg:#141520;--bg-2:#1a1b2e;--surface:#1e1f35;--surface-2:#252640;--border:#2e3058;--border-2:#3a3c6a;--text:#e2e8f0;--text-dim:#a1aab8;--accent:#6366f1;--accent-light:#818cf8;--accent-glow:#6366f126;--shadow:0 1px 4px #0000004d;--shadow-md:0 4px 16px #0006}*{box-sizing:border-box;margin:0;padding:0}html,body,#app{height:100%;overflow:hidden}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:Be Vietnam Pro,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;transition:background .25s,color .2s}.app-shell{flex-direction:column;height:100%;display:flex}.toolbar{height:var(--toolbar-height);background:var(--surface);border-bottom:1px solid var(--border);z-index:10;box-shadow:var(--shadow);flex-shrink:0;justify-content:space-between;align-items:center;gap:12px;padding:0 16px;transition:background .25s,border-color .25s,box-shadow .25s;display:flex}.toolbar-left{align-items:center;gap:10px;display:flex}.toolbar-logo{flex-shrink:0;justify-content:center;align-items:center;display:flex}.toolbar-title{letter-spacing:-.01em;background:linear-gradient(130deg, var(--accent-light) 0%, #a78bfa 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:1rem;font-weight:700}.toolbar-sep{background:var(--border);flex-shrink:0;width:1px;height:20px}.toolbar-doc{color:var(--text-dim);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;border-radius:4px;max-width:280px;padding:2px 6px;font-size:.85rem;font-weight:500;transition:background .15s;overflow:hidden}.toolbar-doc:hover{background:var(--accent-glow)}.toolbar-doc[contenteditable=true]{outline:1.5px solid var(--accent);background:var(--surface-2);cursor:text;white-space:pre;max-width:none;text-overflow:unset;overflow:visible}.toolbar-right{align-items:center;gap:6px;display:flex}.tb-btn{border:1px solid var(--border);border-radius:var(--radius);color:var(--text-dim);cursor:pointer;white-space:nowrap;background:0 0;align-items:center;gap:5px;padding:5px 11px;font-family:inherit;font-size:.8rem;font-weight:500;transition:border-color .15s,color .15s,background .15s,box-shadow .15s;display:inline-flex}.tb-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}.tb-btn.tb-icon{padding:5px 8px;font-size:.9rem}.tb-btn-theme{padding:5px 9px;font-size:1rem;line-height:1}.add-palette{position:relative}.add-palette-menu{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-md);z-index:100;min-width:140px;padding:4px;display:none;position:absolute;top:calc(100% + 6px);left:0}.add-palette-menu.open{flex-direction:column;gap:2px;display:flex}.add-palette-item{color:var(--text);cursor:pointer;white-space:nowrap;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:8px 12px;font-family:inherit;font-size:.82rem;transition:background .12s;display:flex}.add-palette-item:hover{background:var(--accent-glow);color:var(--accent)}.history-palette{position:relative}.history-menu{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-md);z-index:100;min-width:220px;max-height:320px;padding:4px;display:none;position:absolute;top:calc(100% + 6px);right:0;overflow-y:auto}.history-menu.open{flex-direction:column;gap:2px;display:flex}.history-item{color:var(--text);cursor:pointer;white-space:nowrap;text-align:left;background:0 0;border:none;border-radius:6px;flex-direction:column;gap:2px;padding:8px 12px;font-family:inherit;font-size:.78rem;transition:background .12s;display:flex}.history-item:hover{background:var(--accent-glow);color:var(--accent)}.history-time{color:var(--text-dim);font-size:.7rem;font-weight:500}.history-title{color:var(--text);text-overflow:ellipsis;font-size:.75rem;overflow:hidden}.history-empty{color:var(--text-dim);text-align:center;padding:12px;font-size:.78rem}#canvas-container{flex:1;transition:background .3s;position:relative;overflow:hidden}:root #canvas-container{background-color:var(--bg);background-image:radial-gradient(circle, var(--border) 1px, transparent 1px);background-position:0 0;background-size:24px 24px}:root[data-theme=dark] #canvas-container{background-color:var(--bg);background-image:radial-gradient(circle at 50% 0%, #6366f112 0%, transparent 55%), radial-gradient(circle, var(--border) 1px, transparent 1px);background-position:0 0,0 0;background-size:100% 100%,24px 24px}#canvas-container svg{background:0 0!important}.mxRubberband{border:2px dashed var(--accent);background:var(--accent-glow);pointer-events:none;z-index:50;border-radius:4px;position:absolute}.conn-handle{border:1.5px solid var(--accent);cursor:pointer;z-index:60;opacity:0;pointer-events:none;background:0 0;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;transition:opacity .12s,transform .12s,background .12s;display:flex;position:absolute;transform:scale(.5)}.conn-handle.visible{opacity:1;pointer-events:auto;transform:scale(1)}.conn-handle:hover{background:var(--accent);transform:scale(1.15)}.conn-handle svg{width:12px;height:12px}.conn-handle:not(:hover) svg path{stroke:var(--accent)}.conn-handle:hover svg path{stroke:#fff}.conn-preview-line{pointer-events:none;z-index:55;position:absolute}.style-panel{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-md);z-index:200;border-radius:12px;align-items:center;gap:16px;padding:8px 16px;display:none;position:fixed;bottom:20px;left:50%;transform:translate(-50%)}.style-panel.open{display:flex}.sp-mode{align-items:center;gap:16px;display:flex}.style-panel[data-mode=vertex] .sp-mode-edge,.style-panel[data-mode=edge] .sp-mode-vertex,.style-panel[data-mode=""] .sp-mode{display:none}.sp-group{align-items:center;gap:6px;display:flex}.sp-label{color:var(--text-muted);letter-spacing:.02em;text-transform:uppercase;min-width:32px;font-family:inherit;font-size:.72rem}.sp-divider{background:var(--border);opacity:.5;width:1px;height:20px}.sp-color{border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:6px;width:26px;height:26px;padding:0}.sp-color::-webkit-color-swatch-wrapper{padding:2px}.sp-color::-webkit-color-swatch{border:none;border-radius:4px}.sp-select{background:var(--surface);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:4px 8px;font-family:inherit;font-size:.78rem}.sp-toggle{border:1px solid var(--border);color:var(--text-muted);cursor:pointer;letter-spacing:.02em;background:0 0;border-radius:999px;padding:3px 8px;font-family:inherit;font-size:.68rem;transition:all .15s}.sp-toggle:hover{background:var(--accent-glow);color:var(--accent);border-color:var(--accent)}.sp-toggle.active{background:var(--accent);color:#fff;border-color:var(--accent)}@keyframes edge-flow-forward{to{stroke-dashoffset:-28px}}.edge-animated{stroke-dasharray:10 6;stroke-linecap:round;animation-duration:.8s;animation-timing-function:linear;animation-iteration-count:infinite}.edge-animated-forward{animation-name:edge-flow-forward}.edge-animated-backward{animation-name:edge-flow-forward;animation-direction:reverse}.edge-animated-both{animation-name:edge-flow-forward;animation-direction:alternate}div.mxRubberband{background:#07f;border:1px solid #00f;position:absolute;overflow:hidden}.mxCellEditor{_background:url(data:image/gif;base64,R0lGODlhMAAwAIAAAP///wAAACH5BAEAAAAALAAAAAAwADAAAAIxhI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8egpAAA7);word-wrap:normal;resize:none;background:url(data:image/gif;base64,R0lGODlhMAAwAIAAAP///wAAACH5BAEAAAAALAAAAAAwADAAAAIxhI+py+0Po5y02ouz3rz7D4biSJbmiabqyrbuC8fyTNf2jef6zvf+DwwKh8Si8egpAAA7);border:0 solid #0000;min-width:1px;margin:0;padding:0;display:inline-block;position:absolute;overflow:visible}.mxPlainTextEditor *{margin:0;padding:0}div.mxWindow{_background:url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);z-index:1;background:url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);border:1px solid #c3c3c3;position:absolute;overflow:hidden;box-shadow:3px 3px 12px silver}table.mxWindow{border-collapse:collapse;table-layout:fixed;font-family:Arial;font-size:8pt}td.mxWindowTitle{_background:url(data:image/gif;base64,R0lGODlhFwAXAMQAANfX18rKyuHh4c7OzsDAwMHBwc/Pz+Li4uTk5NHR0dvb2+jo6O/v79/f3/n5+dnZ2dbW1uPj44yMjNPT0+Dg4N3d3ebm5szMzAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAXABcAAAWQICESxWiW5Ck6bOu+MMvMdG3f86LvfO/rlqBwSCwaj8ikUohoOp/QaDNCrVqvWKpgezhsv+AwmEIum89ocmPNbrvf64p8Tq/b5Yq8fs/v5x+AgYKDhIAAh4iJiouHEI6PkJGSjhOVlpeYmZUJnJ2en6CcBqMDpaanqKgXq6ytrq+rAbKztLW2shK5uru8vbkhADs=) repeat-x;text-overflow:ellipsis;white-space:nowrap;text-align:center;color:#000;background:url(data:image/gif;base64,R0lGODlhFwAXAMQAANfX18rKyuHh4c7OzsDAwMHBwc/Pz+Li4uTk5NHR0dvb2+jo6O/v79/f3/n5+dnZ2dbW1uPj44yMjNPT0+Dg4N3d3ebm5szMzAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAAAAAAALAAAAAAXABcAAAWQICESxWiW5Ck6bOu+MMvMdG3f86LvfO/rlqBwSCwaj8ikUohoOp/QaDNCrVqvWKpgezhsv+AwmEIum89ocmPNbrvf64p8Tq/b5Yq8fs/v5x+AgYKDhIAAh4iJiouHEI6PkJGSjhOVlpeYmZUJnJ2en6CcBqMDpaanqKgXq6ytrq+rAbKztLW2shK5uru8vbkhADs=) repeat-x;height:13px;padding:4px 2px 6px;font-weight:700;overflow:hidden}td.mxWindowPane{vertical-align:top;padding:0}div.mxWindowPane{position:relative;overflow:hidden}td.mxWindowPane td{font-family:Arial;font-size:8pt}td.mxWindowPane input,td.mxWindowPane select,td.mxWindowPane textarea,td.mxWindowPane radio{border:1px solid #8c8c8c;padding:1px;font-family:Arial;font-size:8pt}td.mxWindowPane button{_background:url(data:image/gif;base64,R0lGODlhCgATALMAAP7+/t7e3vj4+Ojo6OXl5e/v7/n5+fb29vPz8/39/e3t7fHx8e7u7v///wAAAAAAACH5BAAAAAAALAAAAAAKABMAAAQ2MMlJhb0Y6c2X/2AhjiRjnqiirizqMkEsz0Rt30Ou7y8K/ouDcEg0GI9IgHLJbDif0Kh06owAADs=) repeat-x;float:left;background:url(data:image/gif;base64,R0lGODlhCgATALMAAP7+/t7e3vj4+Ojo6OXl5e/v7/n5+fb29vPz8/39/e3t7fHx8e7u7v///wAAAAAAACH5BAAAAAAALAAAAAAKABMAAAQ2MMlJhb0Y6c2X/2AhjiRjnqiirizqMkEsz0Rt30Ou7y8K/ouDcEg0GI9IgHLJbDif0Kh06owAADs=) repeat-x;padding:2px;font-family:Arial;font-size:8pt}img.mxToolbarItem{border-width:1px;margin-bottom:6px;margin-right:6px}select.mxToolbarCombo{vertical-align:top;border-style:inset;border-width:2px}div.mxToolbarComboContainer{padding:2px}img.mxToolbarMode{border-width:0;margin:2px 4px 4px 2px}img.mxToolbarModeSelected{border-style:inset;border-width:2px;margin:0 2px 2px 0}div.mxTooltip{cursor:default;color:#000;background:#ffc;border:1px solid #000;padding:4px;font-family:Arial;font-size:8pt;position:absolute;box-shadow:3px 3px 12px silver}div.mxPopupMenu{_background:url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);background:url(data:image/gif;base64,R0lGODlhGgAUAIAAAOzs7PDw8CH5BAAAAAAALAAAAAAaABQAAAIijI+py70Ao5y02lud3lzhD4ZUR5aPiKajyZbqq7YyB9dhAQA7);border:1px solid #000;position:absolute;box-shadow:3px 3px 12px silver}table.mxPopupMenu{border-collapse:collapse;margin-top:1px;margin-bottom:1px}tr.mxPopupMenuItem{color:#000;cursor:pointer}tr.mxPopupMenuItemHover{color:#fff;cursor:pointer;background-color:#006}td.mxPopupMenuItem{white-space:nowrap;padding:2px 30px 2px 10px;font-family:Arial;font-size:8pt}td.mxPopupMenuIcon{background-color:#d0d0d0;padding:2px 4px}.mxDisabled{opacity:.2!important;cursor:default!important}