:root{font-family:Avenir Next,Segoe UI,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#root{margin:0;width:100%;min-height:100%}body{min-height:100vh;color:#e2e8f0;background:#020617}button,input,select,textarea{font:inherit}.app-shell{--app-background: radial-gradient(circle at top, rgba(59, 130, 246, .22), transparent 28%), linear-gradient(180deg, #111827 0%, #020617 100%);--text-primary: #e2e8f0;--text-secondary: #cbd5e1;--text-muted: #9fb4d2;--panel-bg: rgba(2, 6, 23, .66);--panel-border: rgba(148, 163, 184, .18);--field-bg: rgba(15, 23, 42, .92);--field-text: #f8fafc;--accent: #7dd3fc;--accent-strong: #08111f;--selection-accent: #fef08a;--canvas-panel: rgba(9, 17, 31, .64);--node-label-bg: rgba(12, 16, 24, .76);--node-label-border: rgba(255, 255, 255, .22);--node-label-text: #f8fafc;--node-label-selected-bg: rgba(255, 255, 255, .92);--node-label-selected-text: #111827;--handle-tag-bg: rgba(12, 16, 24, .76);--handle-tag-border: rgba(255, 255, 255, .18);--handle-tag-text: #f8fafc;width:100vw;height:100vh;color:var(--text-primary);background:var(--app-background);padding:0;position:relative;overflow:hidden}.app-shell.theme-light{--app-background: radial-gradient(circle at top, rgba(59, 130, 246, .12), transparent 30%), linear-gradient(180deg, #ffffff 0%, #e2e8f0 100%);--text-primary: #0f172a;--text-secondary: #334155;--text-muted: #475569;--panel-bg: rgba(255, 255, 255, .72);--panel-border: rgba(100, 116, 139, .18);--field-bg: rgba(255, 255, 255, .94);--field-text: #0f172a;--accent: #2563eb;--accent-strong: #ffffff;--selection-accent: #0f172a;--canvas-panel: rgba(255, 255, 255, .72);--node-label-bg: rgba(255, 255, 255, .92);--node-label-border: rgba(71, 85, 105, .2);--node-label-text: #0f172a;--node-label-selected-bg: rgba(15, 23, 42, .92);--node-label-selected-text: #f8fafc;--handle-tag-bg: rgba(255, 255, 255, .92);--handle-tag-border: rgba(71, 85, 105, .18);--handle-tag-text: #0f172a}.topbar,.summary-panel,.selection-hint,.toolbar-field,.status-card,.overlay-panel,.overlay-select,.mode-pill{border:1px solid var(--panel-border);background:var(--panel-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-radius:22px}.eyebrow{margin:0 0 6px;color:var(--accent);font-size:.82rem;letter-spacing:.12em;text-transform:uppercase}.brand h1{margin:0;font-size:clamp(1.5rem,3vw,2.25rem)}.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.toolbar-field{display:flex;flex-direction:column;gap:6px;min-width:220px;padding:10px 12px;border-radius:14px}.toolbar-field.compact{min-width:132px}.toolbar-field span{color:var(--text-muted);font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}.toolbar-field select,.toolbar-field input{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--panel-border);color:var(--field-text);background:var(--field-bg)}.view-switcher{display:inline-flex;gap:8px;padding:6px;border-radius:999px;background:var(--panel-bg);border:1px solid var(--panel-border)}.view-button{border:0;border-radius:999px;padding:10px 16px;color:var(--text-secondary);background:transparent;cursor:pointer}.view-button.active{color:var(--accent-strong);background:var(--accent);font-weight:700}.edit-mode-switcher{display:inline-flex;gap:8px;padding:6px;border-radius:999px;background:var(--panel-bg);border:1px solid var(--panel-border)}.edit-mode-button{border:0;border-radius:999px;padding:10px 14px;color:var(--text-secondary);background:transparent;cursor:pointer}.edit-mode-button.active{color:var(--accent-strong);background:var(--selection-accent);font-weight:700}.save-button{border:1px solid var(--panel-border);border-radius:999px;padding:10px 16px;color:var(--text-primary);background:var(--panel-bg);cursor:pointer}.save-button.dirty{border-color:color-mix(in srgb,var(--selection-accent) 75%,transparent);color:var(--selection-accent)}.canvas-root{position:relative;width:100%;height:100%;z-index:0}.canvas-area{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;border:0;border-radius:0;background:transparent}.view-frame,.view-frame canvas,.view2d-canvas{width:100%;height:100%;display:block}.view-frame{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;isolation:isolate}.view-frame canvas{position:relative;z-index:0}.summary-panel{padding:18px;border-radius:24px}.sidebar-stack{display:flex;flex-direction:column;gap:16px;min-width:0}.summary-panel h2{margin:0;font-size:1.35rem}.summary-panel p{color:var(--text-secondary)}.summary-label{margin:0 0 6px;color:var(--accent);font-size:.76rem;letter-spacing:.1em;text-transform:uppercase}.summary-panel dl{margin:16px 0 0;display:grid;gap:10px}.summary-panel dl div{display:flex;justify-content:space-between;gap:10px;color:var(--text-primary)}.summary-panel dt{color:var(--text-muted)}.inspector-panel{display:flex;flex-direction:column;gap:14px}.inspector-empty{margin:0;color:var(--text-secondary)}.inspector-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.inspector-field{display:flex;flex-direction:column;gap:6px}.inspector-field span{color:var(--text-muted);font-size:.76rem;letter-spacing:.06em;text-transform:uppercase}.inspector-field input,.inspector-field select{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--panel-border);color:var(--field-text);background:var(--field-bg)}.status-card{position:absolute;top:16px;left:76px;z-index:20;padding:12px 14px;border-radius:16px}.status-card.error{border-color:#f8717166;color:#fecaca}.selection-hint{position:absolute;left:16px;bottom:16px;z-index:20;padding:12px 14px;border-radius:16px;display:flex;flex-direction:column;gap:4px;max-width:min(320px,calc(100vw - 32px))}.selection-hint span{color:var(--text-muted);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}.selection-hint strong{font-size:1rem}.selection-hint small{color:var(--text-muted);font-size:.8rem}.demo-action-hint{position:absolute;left:50%;top:18px;z-index:10;min-width:240px;max-width:min(360px,calc(100vw - 220px));padding:16px 18px 17px;border-radius:24px;border:1px solid rgba(148,163,184,.22);pointer-events:none;-webkit-user-select:none;user-select:none;display:flex;align-items:center;flex-direction:column;gap:4px;transform:translate(-50%);opacity:.45;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:action-hint-fade .16s ease-out;transition:opacity .42s ease}.demo-action-hint.dimmed{opacity:.22}.demo-action-hint.theme-dark{color:#f8fafc;background:#0f172a5c;border-color:#e2e8f02e;box-shadow:0 10px 32px #02061738}.demo-action-hint.theme-light{color:#0f172a;background:#ffffff70;border-color:#0f172a29;box-shadow:0 10px 32px #64748b29}.demo-action-hint strong{font-size:18px;font-weight:700;line-height:1.25;letter-spacing:.01em;text-align:center}.hint-visual{width:168px;height:112px;overflow:visible}.hint-mouse rect,.hint-mouse path,.hint-ring,.hint-line,.hint-node,.hint-parent-node,.hint-plane,.hint-eye{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.74}.hint-click,.hint-wheel,.hint-handle,.hint-child-dot,.hint-flow-node,.hint-eye-dot{fill:currentColor;opacity:.46}.hint-click.active,.hint-wheel.active,.hint-handle.active{animation:hint-pulse 1.1s ease-in-out infinite;opacity:.9}.hint-arrow,.hint-flow-line{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.76}.hint-arrow-head{fill:currentColor;opacity:.76}.hint-cursor,.hint-child-node{fill:currentColor;opacity:.72}.hint-slide-x,.hint-node-drag,.hint-group-move{animation:hint-slide-x 1.6s ease-in-out infinite}.hint-rotate-orbit{transform-origin:66px 31px;animation:hint-orbit 1.8s ease-in-out infinite}.hint-wheel-shift{animation:hint-wheel-shift 1.2s ease-in-out infinite}.hint-zoom{transform-origin:66px 30px;animation:hint-zoom 1.4s ease-in-out infinite}.hint-resize-box{transform-origin:50px 32px;animation:hint-resize 1.5s ease-in-out infinite}.hint-resize-arrows{animation:hint-soft-pulse 1.5s ease-in-out infinite}.hint-node-spin{transform-origin:51px 33px;animation:hint-node-spin 1.8s ease-in-out infinite}.hint-spin-arrow{animation:hint-soft-pulse 1.8s ease-in-out infinite}.hint-parent-node{fill:color-mix(in srgb,currentColor 10%,transparent);animation:hint-border-glow 1.6s ease-in-out infinite}.hint-nest-child{animation:hint-nest 1.8s ease-in-out infinite}.hint-child-dot{opacity:.62}.hint-align-dots .dot-a{animation:hint-align-a 1.8s ease-in-out infinite}.hint-align-dots .dot-b{animation:hint-align-b 1.8s ease-in-out infinite}.hint-align-dots .dot-c{animation:hint-align-c 1.8s ease-in-out infinite}.hint-align-dots .dot-d{animation:hint-align-d 1.8s ease-in-out infinite}.hint-grid-line{fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;opacity:.24}.hint-flatten{animation:hint-flatten 1.8s ease-in-out infinite}.hint-plane{fill:color-mix(in srgb,currentColor 8%,transparent)}.hint-plane.flat{opacity:.3}.hint-depth{animation:hint-depth 1.8s ease-in-out infinite}.hint-node.back{opacity:.48}.hint-node.calm{fill:color-mix(in srgb,currentColor 8%,transparent)}.hint-eye{opacity:.58}.hint-flow-line{stroke-dasharray:7 5;animation:hint-dash 1.4s linear infinite}.hint-flow-pulse{fill:currentColor;opacity:.82;animation:hint-flow-pulse 1.4s ease-in-out infinite}@keyframes action-hint-fade{0%{opacity:0;transform:translate(-50%,-4px)}to{opacity:.45;transform:translate(-50%)}}@keyframes hint-pulse{0%,to{opacity:.34;transform:scale(.92)}50%{opacity:.95;transform:scale(1.16)}}@keyframes hint-soft-pulse{0%,to{opacity:.42}50%{opacity:.84}}@keyframes hint-slide-x{0%,to{transform:translate(-5px)}50%{transform:translate(6px)}}@keyframes hint-orbit{0%,to{transform:rotate(-10deg)}50%{transform:rotate(12deg)}}@keyframes hint-wheel-shift{0%,to{transform:translateY(-2px);opacity:.42}50%{transform:translateY(3px);opacity:.82}}@keyframes hint-zoom{0%,to{transform:scale(.92)}50%{transform:scale(1.08)}}@keyframes hint-resize{0%,to{transform:scale(.9)}50%{transform:scale(1.12)}}@keyframes hint-node-spin{0%,to{transform:rotate(-8deg)}50%{transform:rotate(14deg)}}@keyframes hint-border-glow{0%,to{opacity:.48}50%{opacity:.86}}@keyframes hint-nest{0%{transform:translate(0);opacity:.42}58%,to{transform:translate(42px);opacity:.84}}@keyframes hint-align-a{50%,to{transform:translate(6px)}}@keyframes hint-align-b{50%,to{transform:translate(-14px,12px)}}@keyframes hint-align-c{50%,to{transform:translate(10px,-14px)}}@keyframes hint-align-d{50%,to{transform:translate(-18px,1px)}}@keyframes hint-flatten{0%,to{transform:translateY(-3px) skewY(-8deg)}50%{transform:translateY(5px) scaleY(.55)}}@keyframes hint-depth{0%,to{transform:translateY(3px)}50%{transform:translate(4px,-4px)}}@keyframes hint-dash{to{stroke-dashoffset:-24}}@keyframes hint-flow-pulse{0%{transform:translate(-12px);opacity:0}35%,75%{opacity:.86}to{transform:translate(28px);opacity:0}}.empty-view{height:100%;display:grid;place-items:center;color:var(--text-secondary)}.view2d-node{cursor:pointer}.view2d-label{font-size:14px;font-weight:700;pointer-events:none}.node-label{z-index:1;max-width:280px;padding:0;border:0;color:#fff;background:transparent;box-shadow:none;font-weight:600;text-shadow:-1px -1px 0 #000000,1px -1px 0 #000000,-1px 1px 0 #000000,1px 1px 0 #000000,0 1px 2px rgba(0,0,0,.6);white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;text-align:center;line-height:1.12;pointer-events:none;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;gap:6px}.node-label.selected{color:#fff;background:transparent;border-color:transparent;font-weight:700}.node-label-meta{font-size:.68em;opacity:.8;text-transform:uppercase;letter-spacing:.06em}.handle-tag{z-index:1;padding:3px 7px;border-radius:999px;border:1px solid var(--handle-tag-border);color:var(--handle-tag-text);background:var(--handle-tag-bg);font-size:10px;line-height:1;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none}.flow-label{z-index:1;padding:4px 8px;border-radius:999px;border:1px solid var(--node-label-border);color:var(--node-label-text);background:var(--node-label-bg);font-size:11px;white-space:nowrap;pointer-events:none;-webkit-user-select:none;user-select:none}.menu-open .node-label,.menu-open .flow-label,.menu-open .handle-tag{opacity:.35}.overlay-button{border:1px solid var(--panel-border);color:var(--text-primary);background:var(--panel-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);cursor:pointer}.overlay-menu-button{position:absolute;top:16px;left:16px;z-index:50;min-width:52px;padding:10px 14px;border-radius:999px}.overlay-top-right{position:absolute;top:16px;right:16px;z-index:60;display:flex;justify-content:flex-end;max-width:min(360px,calc(100vw - 96px))}.node-list-dropdown{position:relative;z-index:60;display:flex;flex-direction:column;gap:6px;min-width:min(300px,calc(100vw - 96px));padding:10px 12px;border:1px solid var(--panel-border);border-radius:16px;color:var(--text-primary);background:var(--panel-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.node-list-label{color:var(--text-muted);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.node-list-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border:1px solid var(--panel-border);border-radius:10px;color:var(--field-text);background:var(--field-bg);cursor:pointer;text-align:left}.node-list-trigger span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.node-list-trigger small{color:var(--text-muted);font-size:.78rem}.node-list-popover{position:absolute;top:calc(100% + 8px);right:0;z-index:60;width:min(420px,calc(100vw - 32px));max-height:min(70vh,620px);overflow:auto;padding:8px;border:1px solid var(--panel-border);border-radius:16px;color:var(--text-primary);background:var(--panel-bg);box-shadow:0 16px 40px #00000047;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.overlay-select{display:flex;flex-direction:column;gap:6px;min-width:min(280px,calc(100vw - 96px));padding:10px 12px;border-radius:16px}.overlay-select span{color:var(--text-muted);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.overlay-select select{width:100%;padding:9px 12px;border-radius:10px;border:1px solid var(--panel-border);color:var(--field-text);background:var(--field-bg)}.overlay-bottom-right{position:absolute;right:16px;bottom:16px;z-index:50}.mode-pill{padding:8px 12px;border-radius:999px;color:var(--text-primary);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase}.overlay-panel{position:absolute;z-index:50;color:var(--text-primary)}.overlay-menu-panel{top:64px;left:16px;width:min(420px,calc(100vw - 32px));max-height:calc(100vh - 80px);overflow:auto;padding:16px;border-radius:22px}.overlay-side-panel{top:64px;right:16px;width:min(360px,calc(100vw - 32px));max-height:calc(100vh - 80px);overflow:auto;padding:0;border-radius:22px}.overlay-panel .summary-panel{margin:0}.overlay-actions{display:flex;flex-direction:column;gap:12px;margin-top:14px}.overlay-actions .toolbar-field,.overlay-actions .view-switcher,.overlay-actions .edit-mode-switcher,.overlay-actions .save-button{width:100%}.overlay-actions .save-button{justify-content:center}.object-list{display:flex;flex-direction:column;gap:8px;overflow:auto;max-height:calc(100vh - 180px)}.object-item{width:100%;text-align:left;border:1px solid var(--panel-border);background:var(--field-bg);color:var(--field-text);border-radius:12px;padding:10px 12px;cursor:pointer}.object-item.active{border-color:color-mix(in srgb,var(--accent) 70%,white 20%);background:color-mix(in srgb,var(--accent) 18%,var(--field-bg))}.node-tree-list{display:flex;flex-direction:column;gap:3px;overflow:auto;max-height:calc(100vh - 180px)}.node-tree-list.compact{max-height:none;overflow:visible;padding-top:4px}.node-tree-group{position:relative}.node-tree-children{position:relative;margin-left:16px;padding-left:8px;border-left:1px solid color-mix(in srgb,var(--text-muted) 34%,transparent)}.node-tree-item{position:relative;width:100%;min-height:32px;display:flex;align-items:center;gap:6px;border:1px solid transparent;border-radius:11px;color:var(--field-text);background:transparent;cursor:pointer;text-align:left}.node-tree-item:hover{background:color-mix(in srgb,var(--accent) 10%,transparent);border-color:color-mix(in srgb,var(--panel-border) 72%,transparent)}.node-tree-item.selected{border-color:color-mix(in srgb,var(--accent) 66%,white 10%);background:color-mix(in srgb,var(--accent) 22%,var(--field-bg))}.node-tree-chevron{width:14px;flex:0 0 14px;color:var(--text-muted);font-size:.72rem;line-height:1;text-align:center}.node-tree-chevron.has-children{color:var(--accent)}.node-tree-branch{width:14px;flex:0 0 14px;color:color-mix(in srgb,var(--text-muted) 80%,transparent);font-size:.9rem;line-height:1}.node-tree-name{min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.node-tree-name.parent{font-weight:700}.node-tree-count{min-width:20px;padding:2px 6px;border-radius:999px;color:var(--text-muted);background:color-mix(in srgb,var(--text-muted) 12%,transparent);font-size:.72rem;line-height:1.2;text-align:center}.flow-panel{gap:16px}.flow-section{display:flex;flex-direction:column;gap:10px;padding-top:12px;border-top:1px solid var(--panel-border)}.flow-type-switcher,.flow-direction-grid{display:grid;gap:6px}.flow-type-switcher,.flow-direction-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.flow-type-button,.flow-direction-button{border:1px solid var(--panel-border);border-radius:10px;padding:8px 6px;color:var(--text-secondary);background:var(--field-bg);cursor:pointer}.flow-type-button.active,.flow-direction-button.active{border-color:var(--accent);color:var(--accent-strong);background:var(--accent);font-weight:700}.flow-control-label,.flow-message{color:var(--text-muted);font-size:.78rem}.flow-list .object-item{display:flex;flex-direction:column;gap:2px}.flow-list small{color:var(--text-muted)}.save-button.danger{border-color:#f8717180;color:#ef4444}.containment-panel{display:flex;flex-direction:column;gap:10px;margin-top:8px;padding-top:10px;border-top:1px solid var(--panel-border)}.containment-actions{display:flex;gap:10px;flex-wrap:wrap}@media (max-width: 960px){.workspace{grid-template-columns:1fr}.sidebar-stack{order:-1}.inspector-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width: 720px){.topbar,.toolbar{flex-direction:column;align-items:stretch}.toolbar-field{min-width:0}.inspector-grid{grid-template-columns:1fr}.overlay-top-right{left:76px;right:16px;max-width:none}.overlay-select{min-width:0;width:100%}.overlay-side-panel,.overlay-menu-panel{width:calc(100vw - 32px)}.selection-hint{max-width:calc(100vw - 112px)}}