:root{--font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--radius-sm: 10px;--radius-md: 12px;--radius-lg: 16px;--accent: #6366f1;--accent-hover: #4f46e5;--accent-soft: #eef2ff}:root[data-theme=light]{--page-bg: #ffffff;--panel-bg: #ffffff;--panel-alt: #f8f9fb;--input-bg: #f3f4f6;--border: #e5e7eb;--text: #111827;--text-muted: #6b7280;--surface-1: #f1f2f5;--surface-2: #fafbfc;--shadow-1: 0 1px 2px rgba(17, 24, 39, .04), 0 1px 3px rgba(17, 24, 39, .06);--shadow-2: 0 4px 24px rgba(17, 24, 39, .08);--status-ready-bg: #dcfce7;--status-ready-fg: #15803d;--status-busy-bg: #fef3c7;--status-busy-fg: #b45309;--status-error-bg: #fee2e2;--status-error-fg: #b91c1c;--share-bg: #111827;--share-fg: #ffffff;--canvas-bg: #fafafb;--canvas-dot: #d1d5db;--error-bg: #fef2f2;--error-border: #fecaca;--error-fg: #b91c1c;--chip-bg: rgba(255, 255, 255, .92);--chip-fg: var(--text-muted);--cm-bg: #ffffff;--cm-fg: var(--text);--cm-caret: #111827;--cm-selection: rgba(99, 102, 241, .18);--cm-active-line: #f8f9fb;--cm-gutter-bg: #ffffff;--cm-gutter-fg: var(--text-muted);--cm-gutter-border: var(--border);--cm-active-gutter-bg: #f3f4f6;--cm-active-gutter-fg: var(--text);--cm-selection-match: rgba(99, 102, 241, .15);--cm-matching-bracket-bg: rgba(99, 102, 241, .15);--cm-matching-bracket-outline: var(--accent);--cm-tooltip-bg: #ffffff;--cm-tooltip-border: var(--border);--cm-tooltip-fg: var(--text);--cm-autocomplete-selected-bg: var(--accent);--cm-autocomplete-selected-fg: #ffffff;--syn-keyword: #7c3aed;--syn-string: #c2410c;--syn-comment: #9ca3af;--syn-function: #2563eb;--syn-number: #0d9488;--syn-operator: var(--text);--syn-variable: var(--text);--syn-property: #2563eb;--syn-bool: #7c3aed;--syn-atom: #7c3aed}:root[data-theme=dark]{--page-bg: #0f1115;--panel-bg: #16181d;--panel-alt: #1b1e24;--input-bg: #1e2127;--border: #2a2d34;--text: #e5e7eb;--text-muted: #9ca3af;--surface-1: #1e2128;--surface-2: #1a1c22;--shadow-1: 0 1px 2px rgba(0, 0, 0, .3), 0 2px 8px rgba(0, 0, 0, .24);--shadow-2: 0 4px 24px rgba(0, 0, 0, .4);--status-ready-bg: rgba(34, 197, 94, .16);--status-ready-fg: #4ade80;--status-busy-bg: rgba(245, 158, 11, .16);--status-busy-fg: #fbbf24;--status-error-bg: rgba(239, 68, 68, .16);--status-error-fg: #f87171;--share-bg: #ffffff;--share-fg: #111827;--canvas-bg: #131519;--canvas-dot: #2a2d34;--error-bg: rgba(239, 68, 68, .1);--error-border: rgba(239, 68, 68, .35);--error-fg: #f87171;--chip-bg: rgba(22, 24, 29, .85);--chip-fg: var(--text-muted);--cm-bg: #16181d;--cm-fg: var(--text);--cm-caret: #e5e7eb;--cm-selection: rgba(99, 102, 241, .32);--cm-active-line: #1b1e24;--cm-gutter-bg: #16181d;--cm-gutter-fg: var(--text-muted);--cm-gutter-border: var(--border);--cm-active-gutter-bg: #1e2127;--cm-active-gutter-fg: var(--text);--cm-selection-match: rgba(99, 102, 241, .25);--cm-matching-bracket-bg: rgba(99, 102, 241, .25);--cm-matching-bracket-outline: var(--accent);--cm-tooltip-bg: #1b1e24;--cm-tooltip-border: var(--border);--cm-tooltip-fg: var(--text);--cm-autocomplete-selected-bg: var(--accent);--cm-autocomplete-selected-fg: #ffffff;--syn-keyword: #a78bfa;--syn-string: #fb923c;--syn-comment: #6b7280;--syn-function: #60a5fa;--syn-number: #2dd4bf;--syn-operator: var(--text);--syn-variable: var(--text);--syn-property: #60a5fa;--syn-bool: #a78bfa;--syn-atom: #a78bfa}*{box-sizing:border-box;margin:0}html,body,#root,.app{height:100%;font-family:var(--font-sans);background:var(--page-bg);color:var(--text);-webkit-font-smoothing:antialiased}.app{display:flex;flex-direction:column;transition:background-color .16s ease,color .16s ease}*{scrollbar-width:thin;scrollbar-color:var(--border) transparent}*::-webkit-scrollbar{width:10px;height:10px}*::-webkit-scrollbar-track{background:transparent}*::-webkit-scrollbar-thumb{background:var(--border);border-radius:6px;border:2px solid transparent;background-clip:padding-box}*::-webkit-scrollbar-thumb:hover{background:var(--accent);background-clip:padding-box}@keyframes fade-slide{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes loading-sweep{0%{transform:translate(-100%)}to{transform:translate(100%)}}@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important}}.app button{font-family:var(--font-sans);font-size:13px;font-weight:500;cursor:pointer;border-radius:var(--radius-sm);transition:background-color .12s ease,color .12s ease,border-color .12s ease,transform .12s ease,box-shadow .12s ease}.app button:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.btn-ghost{display:inline-flex;align-items:center;gap:6px;height:32px;box-sizing:border-box;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);padding:0 12px;text-decoration:none;font-size:13px;font-weight:500;border-radius:var(--radius-sm);transition:border-color .12s ease,color .12s ease,background-color .12s ease}.btn-ghost:hover,.btn-ghost:focus-visible{border-color:var(--accent);color:var(--accent)}.btn-ghost:focus-visible{outline:2px solid var(--accent);outline-offset:1px}.gh-stars{display:inline-flex;align-items:center;gap:3px;margin-left:2px;padding:2px 7px;border-radius:999px;background:var(--panel-alt);border:1px solid var(--border);color:var(--text-muted);font-family:var(--font-mono);font-size:11px;line-height:1}.gh-stars svg{color:#f5b400}.btn-share{display:inline-flex;align-items:center;height:32px;box-sizing:border-box;color:var(--share-fg);background:var(--share-bg);border:1px solid var(--share-bg);padding:0 16px;font-weight:600;border-radius:var(--radius-sm)}.btn-share:hover{opacity:.9}.toolbar{position:relative;background:var(--page-bg);border-bottom:1px solid var(--border);padding:12px 20px;display:flex;align-items:center;gap:14px;animation:fade-slide .42s ease-out both}.toolbar:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent);opacity:0;transform:translate(-100%);pointer-events:none}.toolbar.is-loading:after{opacity:1;animation:loading-sweep 1.1s ease-in-out infinite}.app-mark{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0;border-radius:8px;background:#fff}.toolbar-title{font-family:var(--font-sans);font-weight:600;font-size:16px;color:var(--text);letter-spacing:-.01em}.status-pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px 4px 8px;border-radius:999px;font-family:var(--font-sans);font-size:12px;font-weight:500}.status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.status-pill--ready{background:var(--status-ready-bg);color:var(--status-ready-fg)}.status-pill--ready .status-dot{background:var(--status-ready-fg)}.status-pill--busy{background:var(--status-busy-bg);color:var(--status-busy-fg)}.status-pill--busy .status-dot{background:var(--status-busy-fg)}.status-pill--error{background:var(--status-error-bg);color:var(--status-error-fg)}.status-pill--error .status-dot{background:var(--status-error-fg)}.toolbar-spacer{flex:1}.toolbar-actions{display:inline-flex;align-items:center;gap:8px}.examples{position:relative;background:var(--page-bg);border-bottom:1px solid var(--border);padding:10px 20px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;animation:fade-slide .42s ease-out both;animation-delay:30ms}.examples-label{font-family:var(--font-sans);text-transform:uppercase;letter-spacing:.06em;font-size:11px;font-weight:600;color:var(--text-muted);margin-right:4px}.example-pill{font-size:13px;font-weight:500;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 12px}.example-pill:hover,.example-pill:focus-visible{border-color:var(--accent);color:var(--accent)}.example-pill.is-active{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-hover)}.main{flex:1;display:flex;min-height:0;gap:0;padding:0;background:var(--panel-bg)}.split-container{flex:1;display:flex;min-width:0;min-height:0}.node-search{width:260px;flex-shrink:0;background:var(--panel-bg);overflow:hidden;display:flex;flex-direction:column;animation:fade-slide .42s ease-out both}.search-input-wrap{position:relative;margin:12px}.search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text-muted);pointer-events:none;display:inline-flex}.node-search input{width:100%;padding:8px 10px 8px 32px;background:var(--input-bg);border:1px solid transparent;border-radius:var(--radius-md);color:var(--text);font-family:var(--font-sans);font-size:13px;outline:none;transition:border-color .12s ease,box-shadow .12s ease,background-color .12s ease}.node-search input::placeholder{color:var(--text-muted)}.node-search input:focus{background:var(--panel-bg);border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.node-search-results{flex:1;overflow-y:auto;list-style:none;padding:0 8px 12px;font-size:13px}.hit-row{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;cursor:pointer;transition:background-color .1s ease}.hit-row:hover,.hit-row:focus-visible{background-color:var(--panel-alt)}.hit-row:focus-visible{outline:2px solid var(--accent);outline-offset:-2px}.hit-row.is-tree-class{padding-left:8px}.hit-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.hit-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-sans);font-weight:600;font-size:13px;color:var(--text)}.hit-module{color:var(--text-muted);font-family:var(--font-mono);font-size:11px;flex-shrink:0;max-width:40%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ctx-menu{position:fixed;z-index:1000;min-width:160px;padding:4px;display:flex;flex-direction:column;gap:2px;background:var(--panel-bg);border:1px solid var(--border);border-radius:10px;box-shadow:var(--shadow-2);animation:fade-slide .1s ease-out both}.ctx-menu button{display:block;width:100%;text-align:left;padding:6px 10px;font-family:var(--font-sans);font-size:12px;font-weight:500;color:var(--text);background:transparent;border:none;border-radius:var(--radius-sm)}.ctx-menu button:hover,.ctx-menu button:focus-visible{background:var(--accent-soft);color:var(--accent-hover)}.tree-node{display:block;padding:0}.tree-row{width:100%;display:flex;align-items:center;gap:6px;padding:7px 8px;background-color:transparent;border:none;border-radius:8px;color:var(--text);font-family:var(--font-sans);font-size:13px;text-align:left;transition:background-color .1s ease}.tree-row:hover{background-color:var(--panel-alt)}.tree-provider-row{position:sticky;top:0;z-index:2;background-color:var(--panel-bg)}.tree-provider-row:hover,.tree-provider-row[aria-expanded=true]{background-color:var(--surface-1)}.tree-chevron{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;color:var(--text-muted);transition:transform .15s ease;transform-origin:center}.tree-provider-row[aria-expanded=true] .tree-chevron,.tree-category-row[aria-expanded=true] .tree-chevron{transform:rotate(90deg)}.tree-provider-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;font-size:14px;color:var(--text)}.tree-category-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--font-mono);font-weight:500;font-size:12.5px;color:var(--text)}.tree-badge{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);flex-shrink:0}.tree-provider-row .tree-badge{background:var(--surface-1);border-radius:999px;padding:2px 8px}.tree-provider-row:hover .tree-badge,.tree-provider-row[aria-expanded=true] .tree-badge{background:var(--surface-2)}.tree-children,.tree-class-rows{list-style:none;margin:2px 0 6px 17px;padding-left:4px;border-left:1px solid var(--border)}.editor-column{flex:0 0 auto;min-width:160px;display:flex;flex-direction:column;background:var(--panel-bg);overflow:hidden;animation:fade-slide .42s ease-out both;animation-delay:60ms}.editor-pane-wrap{flex:1;display:flex;flex-direction:column;min-height:0}.editor-topbar{flex-shrink:0;display:flex;align-items:center;justify-content:space-between;height:46px;box-sizing:border-box;padding:0 16px;border-bottom:1px solid var(--border);background:var(--panel-bg)}.editor-filename{font-family:var(--font-mono);font-size:13px;color:var(--text)}.editor-linecount{font-family:var(--font-mono);font-size:12px;color:var(--text-muted)}.editor-pane{flex:1;overflow:auto;min-height:0}.editor-pane .cm-editor{height:100%}.editor-pane .cm-lineNumbers .cm-gutterElement{font-size:11.5px;padding:0 10px 0 12px}.cm-signature-hint{background:var(--panel-bg);color:var(--accent-hover);padding:5px 10px;border:1px solid var(--border);border-radius:var(--radius-sm);font-family:var(--font-mono);font-size:12px;max-width:480px;box-shadow:var(--shadow-2)}.split-handle{flex:0 0 1px;width:1px;cursor:col-resize;background:var(--border);position:relative;touch-action:none;transition:background-color .12s ease;z-index:4}.split-handle:before{content:"";position:absolute;top:0;bottom:0;left:-4px;right:-4px;background:transparent}.split-handle:hover,.split-handle.is-active{background:var(--accent)}.error-panel{max-height:30%;overflow:auto;background:var(--error-bg);color:var(--error-fg);padding:12px 14px;font-family:var(--font-mono);font-size:12px;border-top:1px solid var(--error-border)}.error-panel:before{content:"TRACEBACK";display:block;font-family:var(--font-sans);font-weight:600;letter-spacing:.06em;font-size:11px;text-transform:uppercase;color:var(--error-fg);opacity:.85;margin-bottom:5px}.preview-pane{flex:1 1 0;min-width:160px;position:relative;display:flex;flex-direction:column;background:var(--panel-bg);overflow:hidden;animation:fade-slide .42s ease-out both;animation-delay:.12s}.preview-header{position:relative;z-index:3;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;height:46px;box-sizing:border-box;padding:0 16px;background:var(--panel-bg);border-bottom:1px solid var(--border)}.preview-canvas{position:relative;flex:1;overflow:hidden;touch-action:none;color:var(--text);background-color:var(--canvas-bg);background-image:radial-gradient(var(--canvas-dot) 1px,transparent 1px);background-size:16px 16px;transition:background-color .16s ease;cursor:grab}.preview-canvas.is-panning{cursor:grabbing;-webkit-user-select:none;user-select:none}.preview-content{position:absolute;top:0;left:0;transform-origin:0 0}.diagram-block{margin-bottom:28px}.sheet-label{font-family:var(--font-sans);font-weight:600;font-size:12px;color:var(--text-muted);margin-bottom:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.diagram-header-left{display:inline-flex;align-items:baseline;gap:6px;min-width:0}.diagram-name{font-family:var(--font-sans);font-weight:600;font-size:14px;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.diagram-name--editable{display:inline-flex;align-items:baseline;gap:4px;cursor:pointer;border-radius:var(--radius-sm)}.diagram-name--editable:hover,.diagram-name--editable:focus-visible{color:var(--accent-hover)}.diagram-name-edit-icon{font-size:11px;color:var(--text-muted);opacity:0;transition:opacity .12s ease}.diagram-name--editable:hover .diagram-name-edit-icon,.diagram-name--editable:focus-visible .diagram-name-edit-icon{opacity:1}.diagram-name-input{font-family:var(--font-sans);font-weight:600;font-size:14px;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:1px 6px;min-width:80px;max-width:260px;outline:none}.diagram-name-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.diagram-meta{font-family:var(--font-mono);font-size:12px;color:var(--text-muted);white-space:nowrap}.diagram-header-right{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}.zoom-segment{display:inline-flex;align-items:stretch;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden}.zoom-segment button{border:none;border-radius:0;background:var(--panel-bg);color:var(--text);padding:5px 10px;font-size:12px;line-height:1}.zoom-segment button+button{border-left:1px solid var(--border)}.zoom-segment button:hover{color:var(--accent-hover)}.zoom-pct{font-family:var(--font-mono);min-width:44px;text-align:center}.preview-overlay-chip{position:absolute;top:12px;right:12px;z-index:2;display:inline-flex;align-items:center;padding:5px 10px;border-radius:999px;background:var(--chip-bg);border:1px solid var(--border);color:var(--chip-fg);font-family:var(--font-sans);font-size:12px;font-weight:500;box-shadow:var(--shadow-1);pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.render-ms-chip{position:absolute;left:12px;bottom:12px;z-index:2;padding:4px 10px;border-radius:999px;background:var(--chip-bg);border:1px solid var(--border);color:var(--chip-fg);font-family:var(--font-mono);font-size:12px;box-shadow:var(--shadow-1);pointer-events:none;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.export-bar{flex-shrink:0;display:flex;flex-direction:column;gap:18px;padding:18px 16px;background:var(--panel-bg);border-top:1px solid var(--border);border-radius:0}.export-bar-row{display:flex;align-items:flex-end;flex-wrap:wrap;gap:8px 16px}.export-bar-row-fields{justify-content:space-between}.export-bar-row-actions{align-items:center}.export-field{display:flex;flex-direction:row;align-items:center;gap:8px;flex:1;min-width:0}.export-field-label{font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted);flex-shrink:0}.export-size-input{flex:1;min-width:64px;width:auto;text-align:center;font-family:var(--font-mono);font-size:12px;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);border-radius:10px;padding:6px 8px}.export-size-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.export-size-input:disabled{color:var(--text-muted);background:var(--surface-1);opacity:.6;cursor:not-allowed}.export-size-x,.export-size-px{color:var(--text-muted);font-size:12px;flex-shrink:0}.export-auto-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);border-radius:999px;padding:5px 12px 5px 6px;background:var(--panel-bg);font-family:var(--font-sans);font-size:12px;font-weight:500;color:var(--text)}.export-auto-toggle .toggle-track{position:relative;width:28px;height:16px;border-radius:999px;background:var(--border);transition:background-color .15s ease;flex-shrink:0}.export-auto-toggle .toggle-knob{position:absolute;top:2px;left:2px;width:12px;height:12px;border-radius:50%;background:#fff;box-shadow:0 1px 2px #0003;transition:transform .15s ease}.export-auto-toggle[aria-checked=true] .toggle-track{background:var(--accent)}.export-auto-toggle[aria-checked=true] .toggle-knob{transform:translate(12px)}.export-bar-select{font-family:var(--font-sans);font-size:12px;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:5px 8px;max-width:160px;flex-shrink:0}.export-download-btn,.export-copy-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;flex:1 1 0}.export-download-btn{font-family:var(--font-sans);font-weight:600;font-size:12px;color:var(--text);background:var(--panel-bg);border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 13px}.export-download-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.export-download-btn:disabled{opacity:.5;cursor:not-allowed}.export-copy-btn{flex:0 0 auto;font-family:var(--font-sans);font-weight:600;font-size:12px;color:var(--text-muted);background:transparent;border:1px solid var(--border);border-radius:var(--radius-sm);padding:6px 13px}.export-copy-btn:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.export-copy-btn:disabled{opacity:.5;cursor:not-allowed}.export-bar-message{font-family:var(--font-sans);font-size:11px;font-weight:600;flex-shrink:0}.export-bar-message-error{color:var(--error-fg)}.export-bar-message-success{color:var(--status-ready-fg)}.diagram-card{display:inline-block;background:#fff;border-radius:var(--radius-lg);box-shadow:0 4px 24px #0000000f;padding:20px}.editor-pane .cm-panels{background:var(--panel-alt);color:var(--text);border-color:var(--border)}.editor-pane .cm-panels.cm-panels-top{border-bottom:1px solid var(--border)}.editor-pane .cm-panel.cm-search label{color:var(--text-muted)}.editor-pane .cm-textfield{background:var(--panel-bg);border:1px solid var(--border);border-radius:6px;color:var(--text)}.editor-pane .cm-button{background:var(--panel-bg);background-image:none;border:1px solid var(--border);border-radius:6px;color:var(--text)}.editor-pane .cm-button:active{background:var(--surface-1)}.editor-pane .cm-searchMatch{background:#f5b85c59}.editor-pane .cm-searchMatch-selected{background:#6366f166}.cm-tooltip{background:var(--cm-tooltip-bg);border:1px solid var(--cm-tooltip-border);border-radius:var(--radius-sm);color:var(--cm-tooltip-fg);font-family:var(--font-mono)}.cm-tooltip-autocomplete ul li[aria-selected]{background:var(--cm-autocomplete-selected-bg)!important;color:var(--cm-autocomplete-selected-fg)!important}