.interactive-diagram{width:100%;height:100%;min-height:620px;-webkit-user-select:none;user-select:none;--interactive-diagram-text: var(--text, #172033);--interactive-diagram-muted: var(--muted, #697586)}.interactive-diagram .diagram-svg{display:block;width:100%;height:100%;min-height:620px;cursor:grab;touch-action:none}.interactive-diagram.is-panning .diagram-svg{cursor:grabbing}.interactive-diagram.is-static .diagram-svg{cursor:default;touch-action:auto}.interactive-diagram .grid-layer{pointer-events:none}.interactive-diagram .node-card{filter:drop-shadow(0 10px 18px rgba(31,42,68,.12))}.interactive-diagram .node-box{fill:#fff;stroke:#cfdae7;stroke-width:1.4}.interactive-diagram .node-tone-active .node-box{stroke:#2f6fed;stroke-width:2.2}.interactive-diagram .node-tone-warning .node-box{stroke:#d18a00;stroke-width:2.2}.interactive-diagram .node-tone-danger .node-box{stroke:#cf3f3f;stroke-width:2.4}.interactive-diagram .node-tone-muted{opacity:.58}.interactive-diagram .node-title{fill:var(--interactive-diagram-text);font-size:15px;font-weight:800;letter-spacing:0}.interactive-diagram .node-type{fill:var(--interactive-diagram-muted);font-size:11px;font-weight:700;letter-spacing:0;text-transform:uppercase}.interactive-diagram .edge-path{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:2.4}.interactive-diagram .edge-tone-warning .edge-path,.interactive-diagram .edge-tone-danger .edge-path{stroke-width:3}.interactive-diagram .edge-disabled .edge-path{opacity:.58}.interactive-diagram .edge-label-bg{fill:#ffffffe0;stroke:#cfdae7eb}.interactive-diagram .edge-label-text{fill:#344054;font-size:12px;font-weight:800;letter-spacing:0;pointer-events:none}.interactive-diagram .group-boundary{fill:#ffffff61;stroke:#b7c3d2;stroke-width:1.3;stroke-dasharray:8 7}.interactive-diagram .group-label{fill:#526173;font-size:12px;font-weight:800;letter-spacing:0}.interactive-diagram .packet{filter:drop-shadow(0 4px 8px rgba(47,111,237,.35))}.interactive-diagram.animations-off .packet,.interactive-diagram.labels-off .edge-label{display:none}:root{color-scheme:light;--bg: #eef2f7;--surface: #ffffff;--surface-soft: #f8fafc;--text: #172033;--muted: #697586;--line-strong: #2f6fed;--line-soft: #d7dee8;--line-hover: #b9c4d2;--success: #27945f;--shadow: 0 18px 42px rgba(35, 48, 72, .13)}*{box-sizing:border-box}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}html,body,#root{min-height:100%}body{margin:0;background:linear-gradient(180deg,#ffffffb3,#fff0),var(--bg);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.48}.app-shell{display:grid;grid-template-rows:auto minmax(0,1fr);gap:18px;width:min(980px,100%);min-height:100vh;margin:0 auto;padding:24px 18px}.app-header,.editor-topbar,.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand-lockup{display:grid;gap:2px}.brand-lockup h1{font-size:30px}.brand-lockup p{color:var(--muted);font-size:13px;font-weight:700}.file-input{display:none}.file-error{position:fixed;top:14px;left:50%;z-index:70;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;width:min(680px,calc(100vw - 28px));padding:10px 10px 10px 14px;border:1px solid #e7b8b8;border-radius:8px;background:#fff7f7;color:#9f2f2f;box-shadow:var(--shadow);transform:translate(-50%)}.file-error p{font-size:13px;font-weight:700;line-height:1.4}.file-error .icon-button{width:32px;height:32px;border-color:transparent;background:transparent;color:inherit}.eyebrow{margin:0 0 4px;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:0;text-transform:uppercase}h1,h2,h3,p{letter-spacing:0}h1{margin:0;font-size:26px;line-height:1.2}h2{margin:0;font-size:18px;line-height:1.25}h3{margin:0;font-size:15px;line-height:1.25}p{margin:0}.diagram-list{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:12px;min-height:0;overflow-y:auto;padding-bottom:24px}.empty-editor-start{display:grid;align-content:center;justify-items:center;min-height:280px;padding:24px;border:1px dashed var(--line-hover);border-radius:8px;background:#ffffff9e;color:var(--muted);text-align:center}.self-hosted-viewer{position:relative;width:100vw;height:100vh;overflow:hidden;background:var(--surface-soft)}.self-hosted-viewer.has-scene-controls{display:grid;grid-template-rows:auto minmax(0,1fr)}.self-hosted-viewer-root{width:100%;height:100%}.self-hosted-viewer .scene-controls{position:static;border-width:0 0 1px;border-radius:0;box-shadow:none}.self-hosted-viewer-status{display:grid;align-content:center;justify-items:center;gap:10px;padding:24px;color:var(--muted);text-align:center}.self-hosted-viewer-status svg{color:#b42318}.diagram-card{display:grid;grid-template-columns:minmax(0,1fr) 280px auto;align-items:center;gap:18px;min-height:192px;padding:18px;border:1px solid var(--line-soft);border-radius:8px;background:#ffffffd6;box-shadow:0 10px 26px #23304814}.diagram-card-main{display:grid;gap:10px;min-width:0}.diagram-card-description{max-width:680px;color:var(--muted);font-size:14px;line-height:1.5}.document-file-status{display:flex;align-items:center;gap:10px;min-width:0;color:var(--muted);font-size:12px;font-weight:700}.document-file-status span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.document-file-status strong{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;color:var(--success);font-size:11px}.document-file-status strong:before{width:7px;height:7px;border-radius:50%;background:currentColor;content:""}.document-file-status strong.is-dirty,.diagram-card-main .document-file-status strong{color:#b86400}.editor-document-heading{display:grid;width:min(720px,100%);min-width:0}.editor-title-heading{min-width:0}.inline-metadata-display{display:block;width:100%;padding:3px 6px;border:1px solid transparent;border-radius:6px;background:transparent;text-align:left;letter-spacing:0;transition:background-color .12s ease,border-color .12s ease}.inline-metadata-display:hover{border-color:#6975861f;background:#69758614}.inline-metadata-display:focus-visible{border-color:#2f6fed57;background:#2f6fed12;outline:2px solid rgba(47,111,237,.12)}.editor-title-display,.editor-title-input{min-height:40px;color:var(--text);font-size:26px;font-weight:800;line-height:1.2}.editor-title-display{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-description-display,.editor-description-input{min-height:42px;margin-top:1px;color:var(--muted);font-size:13px;font-weight:600;line-height:1.35}.editor-description-display.is-placeholder{color:#8a96a8;font-weight:500}.editor-title-input,.editor-description-input{display:block;width:100%;border:1px solid var(--line-soft);border-radius:6px;background:#ffffffe6;letter-spacing:0;outline:0;box-shadow:0 0 0 3px #2f6fed0f}.editor-title-input{padding:3px 6px}.editor-description-input{padding:5px 6px;resize:none}.editor-title-input:focus,.editor-description-input:focus{border-color:var(--line-strong);background:var(--surface)}.editor-description-input::placeholder{color:#8a96a8;font-weight:500}.editor-document-heading .document-file-status{margin-top:4px;padding-left:4px}.diagram-card-thumbnail{width:280px;height:auto;min-height:0;aspect-ratio:16 / 9;border:1px solid var(--line-soft);border-radius:6px;background:var(--surface-soft);overflow:hidden;pointer-events:none}.diagram-card-thumbnail .diagram-svg{height:100%;min-height:0;cursor:default}.card-actions,.toolbar,.editor-title-row{display:flex;align-items:center;gap:8px}.editor-title-row{flex:1 1 auto;min-width:0}.button,.icon-button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface);color:var(--text);font-weight:800}.button{gap:8px;min-height:38px;padding:0 13px;font-size:13px;white-space:nowrap}.button-primary{border-color:var(--line-strong);background:var(--line-strong);color:#fff}.button-secondary:hover,.icon-button:not(:disabled):hover{border-color:var(--line-hover)}.icon-button{width:38px;height:38px;padding:0}.icon-button:disabled{cursor:not-allowed;opacity:.42}.build-version{position:fixed;right:12px;bottom:10px;z-index:60;padding:5px 8px;border:1px solid rgba(183,195,210,.88);border-radius:8px;background:#ffffffdb;color:var(--muted);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,monospace;font-size:11px;font-weight:700;letter-spacing:0;pointer-events:none}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:20;display:grid;place-items:center;padding:22px;background:#0f172a6b}.viewer-modal{display:grid;grid-template-rows:auto auto minmax(0,1fr);gap:12px;width:min(1320px,96vw);height:min(860px,92vh);padding:16px;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface);box-shadow:var(--shadow)}.viewer-modal:fullscreen{width:100vw;height:100vh;padding:16px;border:0;border-radius:0}.viewer-diagram-root{min-height:0;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface-soft);overflow:hidden}.editor-shell{display:grid;grid-template-rows:auto minmax(0,1fr);gap:14px;width:min(1520px,100%);height:100vh;height:100dvh;margin:0 auto;padding:18px;overflow:hidden}.editor-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:14px;height:100%;min-height:0}.side-panel{display:grid;grid-template-rows:minmax(0,1fr) auto;gap:12px;min-height:0;padding:16px;border:1px solid var(--line-soft);border-radius:8px;background:#ffffffd1;overflow:hidden}.side-panel-scroll{display:grid;align-content:start;gap:18px;min-height:0;overflow-y:auto}.side-panel-scroll section{display:grid;gap:10px}.side-section-heading,.node-actions{display:flex;align-items:center}.side-section-heading{justify-content:space-between;gap:10px}.node-actions{gap:6px}.node-actions .icon-button,.scene-editor-panel .side-section-heading .icon-button{width:32px;height:32px}.delete-button:not(:disabled){color:#b42318}.node-list{display:grid;gap:8px;margin:0;padding:0;list-style:none}.node-list li{border:1px solid var(--line-soft);border-radius:8px;background:var(--surface-soft)}.node-list-button{display:grid;gap:2px;width:100%;padding:10px;border:0;border-radius:8px;background:transparent;color:inherit;text-align:left}.node-list-button:hover{background:#2f6fed12}.node-list-button.is-selected{background:#2f6fed1c;color:var(--line-strong)}.node-list span,.node-list-button span{font-size:13px;font-weight:800}.node-list small,.node-list-button small{color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase}.scene-list{display:grid;gap:6px;margin:0;padding:0;list-style:none}.scene-list li{min-width:0}.scene-list-button{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:7px;width:100%;min-height:36px;padding:5px 8px;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface-soft);color:inherit;text-align:left}.scene-list-button:hover{border-color:var(--line-hover)}.scene-list-button.is-selected{border-color:#2f6fed73;background:#2f6fed17;color:var(--line-strong)}.scene-list-button small{display:grid;width:22px;height:22px;place-items:center;border-radius:50%;background:#6975861a;font-size:10px;font-weight:800}.scene-list-button span{min-width:0;overflow:hidden;font-size:12px;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.scene-editor-fields{display:grid;gap:9px;padding-top:2px}.scene-edit-scope{display:grid;gap:6px;padding-bottom:2px}.scene-edit-scope-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.scene-edit-scope-heading span,.scene-edit-scope-heading small{font-size:10px;font-weight:800;text-transform:uppercase}.scene-edit-scope-heading span{color:var(--muted)}.scene-edit-scope-heading small{color:var(--line-strong)}.segmented-control{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding:3px;border:1px solid var(--line-soft);border-radius:8px;background:#eef2f7}.segmented-control button{min-width:0;min-height:30px;padding:0 7px;border:0;border-radius:6px;background:transparent;color:var(--muted);font-size:11px;font-weight:800}.segmented-control button.is-active{background:var(--surface);color:var(--line-strong);box-shadow:0 1px 4px #2330481f}.scene-editor-actions,.scene-editor-actions>div{display:flex;align-items:center}.scene-editor-actions{justify-content:space-between;gap:8px}.scene-editor-actions>span{color:var(--muted);font-size:11px;font-weight:700}.scene-editor-actions>div{gap:4px}.scene-editor-actions .icon-button{width:28px;height:28px}.scene-editor-fields label{display:grid;gap:5px}.scene-editor-fields label>span{color:var(--muted);font-size:10px;font-weight:800;text-transform:uppercase}.scene-editor-fields input,.scene-editor-fields textarea{width:100%;min-width:0;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface);color:var(--text);font-size:12px;font-weight:700}.scene-editor-fields input{min-height:34px;padding:0 9px}.scene-editor-fields textarea{min-height:62px;padding:8px 9px;line-height:1.4;resize:vertical}.scene-editor-fields input:focus,.scene-editor-fields textarea:focus{border-color:var(--line-strong);outline:2px solid rgba(47,111,237,.12)}.scene-empty-state{padding:10px;border:1px dashed var(--line-hover);border-radius:8px;color:var(--muted);font-size:12px;font-weight:700;text-align:center}.editor-workspace{display:grid;grid-template-rows:minmax(0,1fr);gap:12px;height:100%;min-height:0;overflow:hidden}.editor-workspace.has-scene-controls{grid-template-rows:auto minmax(0,1fr)}.scene-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:12px;min-height:78px;padding:12px;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface)}.scene-copy{display:grid;gap:3px;min-width:0}.scene-copy p:last-child{color:var(--muted);font-size:13px;line-height:1.4}.diagram-edit-surface{position:relative;height:100%;min-height:0;overflow:hidden}.editor-diagram-root{width:100%;height:100%;min-height:0;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface-soft);box-shadow:var(--shadow);overflow:hidden}.node-inspector{position:absolute;left:16px;top:16px;z-index:10;display:grid;gap:12px;width:280px;padding:14px;border:1px solid var(--line-soft);border-radius:8px;background:#fffffff5;box-shadow:0 18px 42px #2330482b}.node-inspector header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.node-inspector header>div:first-child{min-width:0}.node-inspector h3{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.inspector-actions{display:inline-flex;flex:0 0 auto;gap:6px}.inspector-actions .icon-button{width:32px;height:32px}.node-inspector label{display:grid;gap:6px}.node-inspector label span,.node-icon-field>span{color:var(--muted);font-size:11px;font-weight:800;letter-spacing:0;text-transform:uppercase}.node-inspector .eyebrow{display:flex;align-items:center;gap:7px}.scene-override-badge{padding:2px 5px;border:1px solid rgba(47,111,237,.32);border-radius:4px;background:#2f6fed14;color:var(--line-strong);font-size:9px;line-height:1.1}.is-scene-override-inspector{border-color:#2f6fed6b}.is-overridden-field{margin-left:-9px;padding-left:6px;border-left:3px solid var(--line-strong)}.override-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--line-strong);vertical-align:1px}.reset-override-button{color:var(--line-strong)}.node-icon-field{display:grid;gap:6px}.node-icon-picker{min-width:0}.node-icon-trigger{display:grid;grid-template-columns:22px minmax(0,1fr) 16px;align-items:center;gap:8px;width:100%;min-height:38px;padding:5px 9px;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface);color:var(--text);text-align:left}.node-icon-trigger:hover,.node-icon-trigger[aria-expanded=true]{border-color:var(--line-hover);background:var(--surface-soft)}.node-icon-trigger>span:not(.node-icon-unknown){overflow:hidden;font-size:13px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.node-icon-trigger svg:first-child,.node-icon-option svg{width:22px;height:22px;fill:currentColor}.node-icon-trigger>svg:last-child{color:var(--muted)}.node-icon-unknown{display:grid;width:22px;height:22px;place-items:center;border:1px solid var(--line-soft);border-radius:50%;color:var(--muted);font-size:12px;font-weight:800}.node-icon-popover{position:fixed;z-index:40;display:grid;grid-template-rows:auto minmax(0,1fr);width:352px;max-width:calc(100vw - 24px);height:360px;max-height:calc(100vh - 24px);padding:12px;border:1px solid var(--line-soft);border-radius:8px;background:#fffffffa;box-shadow:0 20px 48px #23304838}.node-icon-popover header{display:grid;gap:10px;padding-bottom:10px}.node-icon-popover header>div{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.node-icon-popover header strong{font-size:13px}.node-icon-popover header span{color:var(--muted);font-size:11px;font-weight:700}.node-icon-search{display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;gap:5px;min-height:36px;padding:0 9px;border:1px solid var(--line-soft);border-radius:8px;color:var(--muted)}.node-icon-search:focus-within{border-color:var(--line-hover)}.node-icon-search input{width:100%;min-width:0;border:0;outline:0;background:transparent;color:var(--text);font:inherit;font-size:13px}.node-icon-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-content:start;gap:6px;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding-right:2px}.node-icon-option{display:grid;grid-template-rows:26px minmax(28px,auto);place-items:center;gap:5px;min-width:0;min-height:66px;padding:7px 5px;border:1px solid transparent;border-radius:7px;background:transparent;color:var(--text)}.node-icon-option:hover{border-color:var(--line-soft);background:var(--surface-soft)}.node-icon-option.is-selected{border-color:#2f6fed61;background:#2f6fed17;color:var(--line-strong)}.node-icon-option span{max-width:100%;overflow:hidden;font-size:10px;font-weight:700;line-height:1.25;text-align:center;text-overflow:ellipsis}.node-icon-empty{grid-column:1 / -1;padding:28px 8px;color:var(--muted);font-size:12px;text-align:center}.node-inspector input,.node-inspector select{width:100%;min-height:36px;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface);color:var(--text);font-size:13px;font-weight:700}.node-inspector input{padding:0 10px}.node-inspector select{padding:0 8px}.edge-create-button{justify-content:center;width:100%}.edge-create-button.is-active{border-color:var(--line-strong);background:#2f6fed1a;color:var(--line-strong)}.edge-inspector{width:300px;grid-template-columns:repeat(2,minmax(0,1fr))}.edge-inspector header,.edge-inspector .edge-label-field{grid-column:1 / -1}.edge-inspector h3{max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.edge-color-control{position:relative}.edge-color-control i{position:absolute;z-index:1;top:50%;left:10px;width:10px;height:10px;border:1px solid rgba(31,42,68,.16);border-radius:50%;transform:translateY(-50%);pointer-events:none}.node-inspector .edge-color-control select{padding-left:28px}.prompt-bar{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;min-height:54px;padding:0 14px;border:1px solid var(--line-soft);border-radius:8px;background:var(--surface)}.prompt-bar svg{color:var(--success)}.prompt-bar input{width:100%;border:0;outline:0;color:var(--text);font-size:15px}.prompt-bar input::placeholder{color:var(--muted)}.viewer-diagram-root .diagram-svg,.editor-diagram-root .diagram-svg{min-height:0}.interactive-diagram-editor.is-scene-override-mode .node-card.node-scene-overridden .node-box{stroke:var(--line-strong);stroke-width:3}.interactive-diagram-editor.is-scene-override-mode .edge.edge-scene-overridden .edge-path{stroke-width:4;filter:drop-shadow(0 0 3px rgba(47,111,237,.46))}@media(max-width:860px){.app-shell,.editor-shell{padding:12px}.editor-shell{height:auto;min-height:100vh;min-height:100dvh;overflow:visible}.diagram-card{grid-template-columns:minmax(0,1fr)}.card-actions{justify-content:flex-start}.diagram-card-thumbnail{width:100%}.editor-layout{grid-template-columns:minmax(0,1fr);height:auto}.side-panel{max-height:260px}.editor-workspace,.diagram-edit-surface,.editor-diagram-root{height:auto}.editor-workspace,.diagram-edit-surface{overflow:visible}.diagram-edit-surface,.editor-diagram-root{min-height:620px}.editor-topbar,.viewer-header{align-items:flex-start;flex-direction:column}.editor-topbar .toolbar,.app-header .toolbar{width:100%;flex-wrap:wrap}.editor-title-row,.editor-document-heading{width:100%}}
