.graph-canvas{width:100%;height:100%;display:block;background:var(--canvas-bg);cursor:default;-webkit-user-select:none;user-select:none}.graph-canvas .node{cursor:grab}.graph-canvas .node:active{cursor:grabbing}.graph-canvas .node-bg{filter:drop-shadow(0 1px 3px rgba(0,0,0,.1));transition:stroke .15s ease,stroke-width .15s ease}.graph-canvas .node:hover .node-bg{stroke:var(--node-hover-border)}.graph-canvas .node-text-container{word-wrap:break-word;white-space:pre-wrap}.graph-canvas .node-text-container:focus{outline:none}.graph-canvas .node-text-container[contenteditable=true]{cursor:text}.graph-canvas .edge-path{transition:stroke .15s ease,stroke-width .15s ease}.graph-canvas .edge:hover .edge-path{stroke:var(--edge-hover-color);stroke-width:2}.graph-canvas .edge-preview,.graph-canvas .selection-rect{pointer-events:none}.virtual-cards-overlay{position:fixed;inset:0;pointer-events:none;z-index:50}.virtual-arrows-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.virtual-card{position:fixed;padding:12px 16px;background:var(--panel-bg);border:2px dashed var(--border-color);border-radius:var(--radius-lg);color:var(--text-color);font-size:13px;display:flex;align-items:center;justify-content:flex-start;text-align:left;cursor:pointer;pointer-events:auto;opacity:1;transition:all var(--transition-fast);box-shadow:var(--shadow-md);animation:virtual-card-appear var(--transition-normal)}.virtual-card:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--info-color);margin-right:10px;flex-shrink:0;opacity:.5;transition:opacity var(--transition-fast)}@keyframes virtual-card-appear{0%{opacity:0;transform:translate(10px)}to{opacity:.95;transform:translate(0)}}.virtual-card:hover,.virtual-card-selected{border-color:var(--info-color);border-style:solid;background:var(--panel-bg);box-shadow:0 4px 16px #1a73e833;transform:translate(-4px)}.virtual-card:hover:before,.virtual-card-selected:before{opacity:1}.virtual-card-text{line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.virtual-cards-loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);padding:16px 24px;background:var(--panel-bg);border:1px solid var(--border-color);border-radius:var(--radius-lg);color:var(--text-color);font-size:14px;display:flex;align-items:center;gap:10px;box-shadow:var(--shadow-md);pointer-events:auto;animation:virtual-card-appear var(--transition-normal)}.virtual-spinner{display:inline-block;width:16px;height:16px;border:2px solid var(--info-color);border-right-color:transparent;border-radius:50%;animation:spin .75s linear infinite}.ai-generate-icon{position:fixed;width:22px;height:22px;border-radius:var(--radius-sm);background:var(--panel-bg);border:1px solid var(--border-color);color:var(--text-muted);cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-sm);transition:all var(--transition-fast);z-index:100;animation:ai-icon-appear var(--transition-normal);padding:0}.ai-generate-icon svg{width:12px;height:12px;transition:transform var(--transition-fast)}@keyframes ai-icon-appear{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.ai-generate-icon:hover{background:var(--info-color);border-color:var(--info-color);color:#fff;box-shadow:0 4px 12px #1a73e84d}.ai-generate-icon:hover svg{transform:scale(1.1)}.ai-generate-icon:active{transform:scale(.95)}.ai-generate-input-container{position:fixed;display:flex;flex-direction:column;gap:0;padding:0;background:var(--panel-bg);border:1px solid transparent;border-radius:var(--radius-xl);box-shadow:0 0 0 1px #667eea33,0 8px 32px #00000040,0 2px 8px #667eea26;z-index:200;animation:ai-input-appear .25s cubic-bezier(.34,1.56,.64,1);overflow:hidden;min-width:340px}.ai-generate-input-container:before{content:"";position:absolute;inset:-1px;border-radius:var(--radius-xl);background:var(--ai-gradient);z-index:-1;opacity:.5}@keyframes ai-input-appear{0%{opacity:0;transform:translateY(-8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.ai-generate-header{display:flex;align-items:center;gap:8px;padding:10px 14px;background:linear-gradient(135deg,#667eea14,#764ba214);border-bottom:1px solid rgba(102,126,234,.15)}.ai-generate-header svg{width:16px;height:16px;color:#667eea}.ai-generate-header span{font-size:12px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.ai-generate-body{display:flex;align-items:center;gap:10px;padding:12px 14px}.ai-generate-input{flex:1;padding:10px 14px;background:var(--bg-muted);border:1px solid transparent;border-radius:var(--radius-md);color:var(--text-color);font-size:14px;font-family:inherit;line-height:1.4;outline:none;resize:none;min-height:40px;max-height:120px;overflow-y:auto;transition:all var(--transition-fast)}.ai-generate-input:focus{background:var(--bg-color);border-color:#667eea66;box-shadow:0 0 0 3px #667eea1a}.ai-generate-input::placeholder{color:var(--text-muted)}.ai-generate-submit{display:flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;background:var(--ai-gradient);border:none;border-radius:var(--radius-md);color:#fff;cursor:pointer;transition:all var(--transition-fast);flex-shrink:0}.ai-generate-submit:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.ai-generate-submit:active:not(:disabled){transform:translateY(0)}.ai-generate-submit:disabled{opacity:.4;cursor:not-allowed;background:var(--text-muted)}.ai-generate-submit svg{width:18px;height:18px}.ai-generate-loading{display:flex;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0}.ai-generate-spinner{width:20px;height:20px;border:2px solid rgba(102,126,234,.3);border-top-color:#667eea;border-radius:50%;animation:spin .8s linear infinite}.ai-generate-hint{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 14px;background:var(--bg-muted);border-top:1px solid var(--border-light);font-size:11px;color:var(--text-muted)}.ai-generate-hint kbd{font-size:10px;padding:2px 5px;min-width:auto;margin-right:2px}.controls{position:fixed;bottom:20px;left:20px;display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--controls-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100}.controls-group{display:flex;gap:4px}.controls-divider{width:1px;height:24px;background:var(--border-color);margin:0 4px}.control-btn{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-color);cursor:pointer;transition:background var(--transition-fast),opacity var(--transition-fast),color var(--transition-fast);position:relative}.control-btn:hover:not(:disabled){background:var(--hover-bg)}.control-btn:active:not(:disabled){background:var(--active-bg)}.control-btn:disabled{opacity:.4;cursor:not-allowed}.control-btn-primary{color:var(--info-color)}.control-btn-primary:hover:not(:disabled){background:#1a73e826}.control-btn-active{background:var(--hover-bg);color:var(--info-color)}.control-btn-danger:hover:not(:disabled){color:var(--error-color)}.control-btn-ai{font-weight:700;font-size:12px}.ai-btn-text{background:var(--ai-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:700}.control-btn-ai-configured .ai-btn-text{background:var(--ai-gradient-success);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.control-btn-ai:hover:not(:disabled){background:#667eea26}.control-btn-ai-configured:hover:not(:disabled){background:#34a85326}.control-btn svg{flex-shrink:0}.control-btn[data-tooltip]:hover:after,.recent-item-delete[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);padding:6px 10px;background:var(--bg-color);color:var(--text-color);font-size:12px;font-weight:500;white-space:nowrap;border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);border:1px solid var(--border-color);pointer-events:none;z-index:1000;animation:tooltip-fade-in var(--transition-fast)}.control-btn[data-tooltip]:hover:before,.recent-item-delete[data-tooltip]:hover:before{content:"";position:absolute;bottom:calc(100% + 4px);left:50%;transform:translate(-50%);border:5px solid transparent;border-top-color:var(--border-color);pointer-events:none;z-index:1000}@keyframes tooltip-fade-in{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.recent-panel{position:fixed;bottom:80px;left:20px;width:280px;max-height:400px;background:var(--panel-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--border-color);z-index:99;overflow:hidden;animation:slide-up var(--transition-normal)}.recent-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border-light)}.recent-header h3{margin:0;font-size:14px;font-weight:600;color:var(--text-color)}.recent-close{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-muted);font-size:18px;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast)}.recent-close:hover{background:var(--hover-bg);color:var(--text-color)}.recent-list{max-height:320px;overflow-y:auto;overflow-x:hidden}.recent-empty{padding:24px 16px;text-align:center}.recent-empty p{margin:0;color:var(--text-muted);font-size:13px}.recent-empty-hint{margin-top:8px!important;font-size:12px!important;opacity:.7}.recent-item{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;cursor:pointer;transition:background var(--transition-fast);border-bottom:1px solid var(--border-light)}.recent-item:last-child{border-bottom:none}.recent-item:hover{background:var(--hover-bg)}.recent-item-info{flex:1;min-width:0}.recent-item-name{display:block;font-size:13px;font-weight:500;color:var(--text-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.recent-item-meta{display:flex;gap:8px;margin-top:2px;font-size:11px;color:var(--text-muted)}.recent-item-count{color:var(--info-color)}.recent-item-delete{display:flex;align-items:center;justify-content:center;width:24px;min-width:24px;height:24px;padding:0;margin-left:8px;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast);opacity:0;position:relative;flex-shrink:0}.recent-item:hover .recent-item-delete{opacity:1}.recent-item-delete:hover{background:#d930251a;color:var(--error-color)}.settings-panel{position:fixed;bottom:80px;left:20px;width:280px;background:var(--panel-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--border-color);z-index:99;overflow:hidden;animation:slide-up var(--transition-normal)}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border-light)}.settings-header h3{margin:0;font-size:14px;font-weight:600;color:var(--text-color)}.settings-close{display:flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;background:transparent;border:none;border-radius:var(--radius-sm);color:var(--text-muted);font-size:18px;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast)}.settings-close:hover{background:var(--hover-bg);color:var(--text-color)}.settings-content{padding:12px}.settings-section{display:flex;flex-direction:column;gap:8px}.settings-section-header{display:flex;align-items:center;gap:8px;padding:4px 0;color:var(--text-muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.settings-section-header svg{opacity:.7}.settings-toggle{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--bg-color);border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition-fast)}.settings-toggle:hover{background:var(--hover-bg)}.settings-toggle input{position:absolute;opacity:0;pointer-events:none}.settings-toggle-slider{position:relative;width:36px;min-width:36px;height:20px;background:var(--border-color);border-radius:10px;transition:background var(--transition-normal)}.settings-toggle-slider:after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;background:#fff;border-radius:50%;transition:transform var(--transition-normal);box-shadow:var(--shadow-sm)}.settings-toggle input:checked+.settings-toggle-slider{background:var(--info-color)}.settings-toggle input:checked+.settings-toggle-slider:after{transform:translate(16px)}.settings-toggle-content{flex:1;min-width:0}.settings-toggle-title{display:block;font-size:13px;font-weight:500;color:var(--text-color)}.settings-toggle-desc{display:block;font-size:11px;color:var(--text-muted);margin-top:1px}.settings-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 12px;margin-top:4px;background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-color);font-size:12px;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.settings-btn:hover{background:var(--hover-bg);border-color:var(--info-color);color:var(--info-color)}.settings-btn-configured{background:#34a8531a;border-color:#34a8534d;color:#34a853}.settings-btn-configured:hover{background:#34a85326;border-color:#34a853}.help-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fade-in var(--transition-normal)}.help-panel{background:var(--panel-bg);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);max-width:600px;max-height:80vh;overflow:hidden;animation:slide-up var(--transition-normal)}.help-scrollable{overflow-y:auto;max-height:80vh}.help-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px}.help-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text-color)}.help-close{background:none;border:none;font-size:24px;color:var(--text-muted);cursor:pointer;padding:0;line-height:1;opacity:.6;transition:opacity var(--transition-fast)}.help-close:hover{opacity:1}.help-description{padding:16px 24px;background:var(--bg-muted);border-bottom:1px solid var(--border-color)}.help-description p{margin:0;font-size:14px;line-height:1.5;color:var(--text-secondary)}.help-description strong{color:var(--text-color)}.help-content{padding:20px 24px;overflow-y:auto}.help-section{margin-bottom:24px}.help-section:last-child{margin-bottom:0}.help-section h3{margin:0 0 12px;font-size:14px;font-weight:600;color:var(--text-color);text-transform:uppercase;letter-spacing:.5px}.help-section ul{margin:0;padding:0;list-style:none}.help-section li{display:flex;align-items:center;gap:12px;padding:8px 0;font-size:14px;color:var(--text-secondary);border-bottom:1px solid var(--border-light)}.help-section li:last-child{border-bottom:none}kbd{display:inline-flex;align-items:center;justify-content:center;min-width:24px;padding:4px 8px;font-family:inherit;font-size:12px;font-weight:500;color:var(--text-color);background:var(--kbd-bg);border:1px solid var(--kbd-border);border-radius:6px;box-shadow:0 1px 2px #0000000d}.help-dev-mode-btn{margin-top:12px;padding:10px 16px;font-size:13px;font-weight:500;color:#e2e2f0;background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);box-shadow:0 2px 8px #6366f14d}.help-dev-mode-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #6366f166}.help-dev-mode-btn:active{transform:translateY(0)}.help-examples{padding:16px 24px;border-bottom:1px solid var(--border-color)}.help-examples h3{margin:0 0 12px;font-size:14px;font-weight:600;color:var(--text-color);text-transform:uppercase;letter-spacing:.5px}.help-examples-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.help-example-btn{display:flex;flex-direction:column;align-items:center;gap:4px;padding:12px 8px;background:var(--bg-muted);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast)}.help-example-btn:hover{background:var(--hover-bg);border-color:var(--node-active-border);transform:translateY(-2px)}.help-example-btn:active{transform:translateY(0)}.help-example-name{font-size:13px;font-weight:600;color:var(--text-color)}.help-example-desc{font-size:11px;color:var(--text-muted)}.help-ai-feature{display:flex;align-items:flex-start;gap:14px;margin-top:16px;padding:14px 16px;background:linear-gradient(135deg,#667eea0f,#764ba20f);border:1px solid rgba(102,126,234,.2);border-radius:var(--radius-md)}.help-ai-feature-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:var(--ai-gradient);border-radius:var(--radius-md);color:#fff}.help-ai-feature-content{display:flex;flex-direction:column;gap:4px}.help-ai-feature-content strong{font-size:14px;font-weight:600;color:var(--text-color)}.help-ai-feature-content span{font-size:13px;line-height:1.5;color:var(--text-secondary)}.help-ai-status{display:flex;align-items:center;gap:8px;margin-top:12px;font-size:12px;color:var(--text-muted);flex-wrap:wrap}.help-ai-manual-hint{color:var(--text-muted);font-size:11px}.help-ai-indicator{width:8px;height:8px;border-radius:50%;background:var(--error-color)}.help-ai-indicator.configured{background:var(--success-color)}.help-ai-configure-btn{width:100%;margin-top:12px;padding:10px 16px;background:var(--ai-gradient);border:none;border-radius:var(--radius-md);color:#fff;font-size:13px;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.help-ai-configure-btn:hover{opacity:.9;transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.toast-container{position:fixed;bottom:20px;right:20px;display:flex;flex-direction:column;gap:8px;z-index:1000;max-height:200px;overflow-y:auto}.toast{display:flex;align-items:center;gap:10px;padding:12px 16px;background:var(--toast-bg);border-radius:var(--radius-md);box-shadow:var(--shadow-md);min-width:250px;max-width:400px;animation:toast-in var(--transition-normal)}@keyframes toast-in{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.toast-info{border-left:3px solid var(--info-color)}.toast-warning{border-left:3px solid var(--warning-color)}.toast-error{border-left:3px solid var(--error-color)}.toast-icon{font-size:16px;flex-shrink:0}.toast-message{flex:1;font-size:14px;color:var(--text-color);line-height:1.4}.toast-close{background:none;border:none;font-size:18px;color:var(--text-muted);cursor:pointer;padding:0 4px;line-height:1;opacity:.6;transition:opacity var(--transition-fast)}.toast-close:hover{opacity:1}.toast-overflow{text-align:center;font-size:12px;color:var(--text-muted);padding:4px 8px;background:var(--bg-muted);border-radius:var(--radius-sm)}.dev-console{position:fixed;bottom:20px;left:50%;transform:translate(-50%);width:500px;max-width:calc(100vw - 40px);background:#1a1a2e;border:1px solid #3d3d5c;border-radius:var(--radius-lg);box-shadow:0 8px 32px #0006;z-index:2000;font-family:JetBrains Mono,Fira Code,SF Mono,Consolas,monospace;overflow:hidden;animation:dev-console-slide-up var(--transition-normal)}@keyframes dev-console-slide-up{0%{opacity:0;transform:translate(-50%) translateY(20px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.dev-console-header{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#252541;border-bottom:1px solid #3d3d5c}.dev-console-title{font-size:12px;font-weight:600;color:#9d9dcc;text-transform:uppercase;letter-spacing:1px}.dev-console-close{background:none;border:none;font-size:18px;color:#6d6d8f;cursor:pointer;padding:0;line-height:1;transition:color var(--transition-fast)}.dev-console-close:hover{color:#ff6b6b}.dev-console-history{max-height:200px;overflow-y:auto;padding:10px 14px;font-size:13px;line-height:1.5}.dev-console-history::-webkit-scrollbar{width:6px}.dev-console-history::-webkit-scrollbar-track{background:transparent}.dev-console-history::-webkit-scrollbar-thumb{background:#3d3d5c;border-radius:3px}.dev-console-entry{white-space:pre-wrap;word-break:break-word;margin-bottom:4px}.dev-console-command{color:#7dd3fc}.dev-console-result{color:#86efac}.dev-console-error{color:#fca5a5}.dev-console-input-row{display:flex;align-items:center;gap:8px;padding:12px 14px;background:#16162a;border-top:1px solid #3d3d5c}.dev-console-prompt{color:#c084fc;font-size:14px;font-weight:600}.dev-console-input{flex:1;background:transparent;border:none;outline:none;font-family:inherit;font-size:14px;color:#e2e2f0;caret-color:#c084fc}.dev-console-input::placeholder{color:#5d5d7a}.dev-console-input::selection{background:#c084fc40}.title-input-container{position:fixed;top:16px;left:16px;z-index:100}.title-input{background:transparent;border:none;font-size:16px;font-weight:500;color:var(--text-color);padding:8px 12px;border-radius:8px;min-width:120px;max-width:300px;transition:background-color .15s ease,box-shadow .15s ease}.title-input::placeholder{color:var(--text-muted);font-weight:400}.title-input:hover{background:var(--hover-bg)}.title-input:focus{background:var(--controls-bg);box-shadow:0 2px 8px #00000026;outline:none}.ai-modal-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fade-in var(--transition-normal)}.ai-modal{background:var(--panel-bg);border-radius:var(--radius-xl);box-shadow:0 24px 48px #0003;border:1px solid var(--border-color);width:480px;max-width:calc(100vw - 40px);max-height:calc(100vh - 40px);overflow:hidden;animation:slide-up-scale .25s ease-out}.ai-modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border-light)}.ai-modal-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text-color);display:flex;align-items:center;gap:10px}.ai-modal-header h2 svg{color:var(--info-color)}.ai-modal-close{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-muted);font-size:24px;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast)}.ai-modal-close:hover{background:var(--hover-bg);color:var(--text-color)}.ai-modal-content{padding:24px;overflow-y:auto;max-height:calc(100vh - 200px)}.ai-section{margin-bottom:24px}.ai-section:last-child{margin-bottom:0}.ai-label{display:block;font-size:13px;font-weight:600;color:var(--text-muted);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.ai-provider-tabs{display:flex;gap:8px}.ai-provider-tab{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;background:var(--bg-color);border:2px solid var(--border-color);border-radius:var(--radius-lg);color:var(--text-muted);font-size:14px;font-weight:500;cursor:pointer;transition:all var(--transition-fast)}.ai-provider-tab:hover{border-color:var(--text-muted);color:var(--text-color)}.ai-provider-tab.active{border-color:var(--info-color);background:#1a73e814;color:var(--info-color)}.ai-key-input-wrapper{display:flex;gap:8px}.ai-input{flex:1;padding:12px 14px;background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-color);font-size:14px;font-family:SF Mono,Monaco,Cascadia Code,monospace;outline:none;transition:border-color var(--transition-fast)}.ai-input:focus{border-color:var(--info-color)}.ai-input::placeholder{color:var(--text-muted);opacity:.6}.ai-validate-btn{padding:12px 20px;background:var(--info-color);border:none;border-radius:var(--radius-md);color:#fff;font-size:14px;font-weight:500;cursor:pointer;transition:opacity var(--transition-fast),background var(--transition-fast);display:flex;align-items:center;gap:6px;min-width:90px;justify-content:center}.ai-validate-btn:hover:not(:disabled){background:#1565c0}.ai-validate-btn:disabled{opacity:.5;cursor:not-allowed}.ai-status{display:flex;align-items:center;gap:6px;margin-top:10px;padding:8px 12px;border-radius:var(--radius-sm);font-size:13px;font-weight:500}.ai-status-validating{background:#1a73e81a;color:var(--info-color)}.ai-status-valid{background:#34a8531a;color:var(--success-color)}.ai-status-invalid{background:#d930251a;color:var(--error-color)}.ai-spinner{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .75s linear infinite}.ai-recommended{display:flex;gap:8px;margin-bottom:12px}.ai-recommended-btn{flex:1;display:flex;flex-direction:column;align-items:center;padding:12px 8px;background:var(--bg-color);border:2px solid var(--border-color);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast)}.ai-recommended-btn:hover{border-color:var(--text-muted)}.ai-recommended-btn.active{border-color:var(--info-color);background:#1a73e814}.ai-recommended-category{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;color:var(--text-muted);margin-bottom:4px}.ai-recommended-btn.active .ai-recommended-category{color:var(--info-color)}.ai-recommended-name{font-size:13px;font-weight:600;color:var(--text-color);margin-bottom:2px}.ai-recommended-desc{font-size:11px;color:var(--text-muted)}.ai-select{width:100%;padding:12px 14px;background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-md);color:var(--text-color);font-size:14px;outline:none;cursor:pointer;transition:border-color var(--transition-fast);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%23888'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.ai-select:focus{border-color:var(--info-color)}.ai-modal-footer{padding:16px 24px;border-top:1px solid var(--border-light);background:var(--bg-color)}.ai-footer-hint{margin:0;font-size:12px;color:var(--text-muted);text-align:center}.ai-footer-hint kbd{display:inline-block;padding:2px 6px;background:var(--panel-bg);border:1px solid var(--border-color);border-radius:var(--radius-sm);font-family:inherit;font-size:11px}.ai-toggles{display:flex;flex-direction:column;gap:12px}.ai-toggle{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast)}.ai-toggle:hover{border-color:var(--text-muted)}.ai-toggle input{display:none}.ai-toggle-slider{position:relative;width:var(--toggle-width);height:var(--toggle-height);background:var(--border-color);border-radius:calc(var(--toggle-height) / 2);flex-shrink:0;transition:background var(--transition-normal)}.ai-toggle-slider:after{content:"";position:absolute;top:2px;left:2px;width:var(--toggle-thumb-size);height:var(--toggle-thumb-size);background:#fff;border-radius:50%;transition:transform var(--transition-normal);box-shadow:var(--shadow-sm)}.ai-toggle input:checked+.ai-toggle-slider{background:var(--info-color)}.ai-toggle input:checked+.ai-toggle-slider:after{transform:translate(var(--toggle-thumb-size))}.ai-toggle-content{display:flex;flex-direction:column;gap:2px}.ai-toggle-title{font-size:14px;font-weight:500;color:var(--text-color)}.ai-toggle-desc{font-size:12px;color:var(--text-muted)}:root{--canvas-bg: #f8f9fa;--bg-color: #ffffff;--bg-muted: #f1f3f4;--panel-bg: #ffffff;--controls-bg: rgba(255, 255, 255, .95);--toast-bg: #ffffff;--text-color: #1a1a1a;--text-secondary: #5f6368;--text-muted: #9aa0a6;--border-color: #dadce0;--border-light: #e8eaed;--node-bg: #ffffff;--node-border: #dadce0;--node-hover-border: #bdc1c6;--node-active-border: #1a73e8;--node-selected-border: #fbbc04;--edge-color: #5f6368;--edge-hover-color: #1a73e8;--edge-selected-color: #1a73e8;--edge-preview-color: #1a73e8;--selection-fill: rgba(26, 115, 232, .1);--selection-stroke: rgba(26, 115, 232, .5);--hover-bg: rgba(0, 0, 0, .05);--active-bg: rgba(0, 0, 0, .1);--info-color: #1a73e8;--success-color: #34a853;--warning-color: #f9ab00;--error-color: #d93025;--kbd-bg: #f1f3f4;--kbd-border: #dadce0;--ai-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--ai-gradient-success: linear-gradient(135deg, #34a853 0%, #0f9d58 100%);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1);--shadow-md: 0 4px 12px rgba(0, 0, 0, .15);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .2);--transition-fast: .15s ease;--transition-normal: .2s ease;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--toggle-width: 44px;--toggle-height: 24px;--toggle-thumb-size: 20px}@media(prefers-color-scheme:dark){:root{--canvas-bg: #1e1e1e;--bg-color: #2d2d2d;--bg-muted: #3c3c3c;--panel-bg: #2d2d2d;--controls-bg: rgba(45, 45, 45, .95);--toast-bg: #3c3c3c;--text-color: #e8eaed;--text-secondary: #9aa0a6;--text-muted: #5f6368;--border-color: #5f6368;--border-light: #3c3c3c;--node-bg: #2d2d2d;--node-border: #5f6368;--node-hover-border: #9aa0a6;--node-active-border: #8ab4f8;--node-selected-border: #fdd663;--edge-color: #9aa0a6;--edge-hover-color: #8ab4f8;--edge-selected-color: #8ab4f8;--edge-preview-color: #8ab4f8;--selection-fill: rgba(138, 180, 248, .15);--selection-stroke: rgba(138, 180, 248, .5);--hover-bg: rgba(255, 255, 255, .08);--active-bg: rgba(255, 255, 255, .15);--info-color: #8ab4f8;--success-color: #81c995;--warning-color: #fdd663;--error-color: #f28b82;--kbd-bg: #3c3c3c;--kbd-border: #5f6368;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .3);--shadow-md: 0 4px 12px rgba(0, 0, 0, .35);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .4)}}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;padding:0;width:100%;height:100%;overflow:hidden}body{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:14px;line-height:1.5;color:var(--text-color);background:var(--canvas-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{width:100%;height:100%;position:relative}:focus-visible{outline:2px solid var(--info-color);outline-offset:2px}::selection{background:#1a73e84d}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up-scale{0%{opacity:0;transform:translateY(20px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes spin{to{transform:rotate(360deg)}}.toggle{display:flex;align-items:center;gap:12px;padding:12px 14px;background:var(--bg-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast)}.toggle:hover{border-color:var(--text-muted)}.toggle input{display:none}.toggle-slider{position:relative;width:var(--toggle-width);height:var(--toggle-height);background:var(--border-color);border-radius:calc(var(--toggle-height) / 2);flex-shrink:0;transition:background var(--transition-normal)}.toggle-slider:after{content:"";position:absolute;top:2px;left:2px;width:var(--toggle-thumb-size);height:var(--toggle-thumb-size);background:#fff;border-radius:50%;transition:transform var(--transition-normal);box-shadow:var(--shadow-sm)}.toggle input:checked+.toggle-slider{background:var(--info-color)}.toggle input:checked+.toggle-slider:after{transform:translate(var(--toggle-thumb-size))}.toggle-content{display:flex;flex-direction:column;gap:2px}.toggle-title{font-size:14px;font-weight:500;color:var(--text-color)}.toggle-desc{font-size:12px;color:var(--text-muted)}.toggle--compact{padding:8px 10px;gap:10px;border:none;background:var(--bg-color);border-radius:var(--radius-md)}.toggle--compact .toggle-slider{width:36px;height:20px}.toggle--compact .toggle-slider:after{width:16px;height:16px}.toggle--compact input:checked+.toggle-slider:after{transform:translate(16px)}.toggle--compact .toggle-title{font-size:13px}.toggle--compact .toggle-desc{font-size:11px;margin-top:1px}.close-btn{display:flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;background:transparent;border:none;border-radius:var(--radius-md);color:var(--text-muted);font-size:24px;cursor:pointer;transition:background var(--transition-fast),color var(--transition-fast)}.close-btn:hover{background:var(--hover-bg);color:var(--text-color)}.close-btn--small{width:24px;height:24px;font-size:18px;border-radius:var(--radius-sm)}.modal-overlay{position:fixed;inset:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fade-in var(--transition-normal)}.modal{background:var(--panel-bg);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg);border:1px solid var(--border-color);max-width:calc(100vw - 40px);max-height:calc(100vh - 40px);overflow:hidden;animation:slide-up-scale .25s ease-out}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border-light)}.modal-header h2{margin:0;font-size:18px;font-weight:600;color:var(--text-color)}.modal-content{padding:24px;overflow-y:auto}.modal-footer{padding:16px 24px;border-top:1px solid var(--border-light);background:var(--bg-color)}.panel{position:fixed;background:var(--panel-bg);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);border:1px solid var(--border-color);overflow:hidden;animation:slide-up var(--transition-normal)}.panel-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid var(--border-light)}.panel-header h3{margin:0;font-size:14px;font-weight:600;color:var(--text-color)}.panel-content{padding:12px}.spinner{display:inline-block;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .75s linear infinite}.spinner--small{width:12px;height:12px;border-width:1.5px}.spinner--large{width:24px;height:24px;border-width:3px}