@font-face{font-family:WorkflowArial;src:url(/fonts/Arial.ttf) format("truetype");font-weight:400;font-style:normal;font-display:swap}*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #3C502D;--secondary-color: #FFC107;--accent-color: #F0680E;--background-color: #e5e5e5;--canvas-background: #f0f0f0;--surface-color: #ffffff;--text-color: #1a1a1a;--text-secondary: #6b6b6b;--border-color: #d0d0d0;--hover-color: #f5f5f5;--shadow: 0 2px 8px rgba(0, 0, 0, .1);--shadow-strong: 0 4px 12px rgba(0, 0, 0, .15);--border-radius: 8px;--transition: all .3s ease}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6}.app-header{background:var(--surface-color);padding:.2rem 2rem;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow);position:sticky;top:0;z-index:1000;gap:2rem}.app-header h1{font-size:1.5rem;font-weight:600;color:var(--primary-color);margin:0}.app-logo{height:80px;width:auto;object-fit:contain;margin-left:5rem}.header-info{display:flex;gap:1.5rem;align-items:center}.header-stat{color:var(--text-secondary);font-size:.9rem}.header-stat strong{color:var(--text-color);font-weight:600}.header-controls{display:flex;gap:.75rem;align-items:center}.zoom-controls{display:flex;gap:.25rem;align-items:center;padding:.25rem;background:var(--hover-color);border-radius:var(--border-radius);border:1px solid var(--border-color)}.btn-zoom{background:var(--surface-color);border:1px solid var(--border-color);color:var(--text-color);width:32px;height:32px;border-radius:4px;cursor:pointer;font-size:1.1rem;font-weight:600;display:flex;align-items:center;justify-content:center;transition:var(--transition)}.btn-zoom:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.zoom-value{padding:0 .5rem;font-size:.85rem;font-weight:600;color:var(--text-color);min-width:50px;text-align:center}.layer-controls{background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:1rem;margin-bottom:1rem}.layer-controls h3{color:var(--text-color);font-size:1rem;margin-bottom:.75rem;font-weight:500}.layer-buttons{display:flex;flex-direction:column;gap:.5rem}.btn.small{padding:.5rem .75rem;font-size:.875rem;min-height:auto}.btn{padding:.5rem 1rem;border:none;border-radius:var(--border-radius);font-size:.9rem;font-weight:500;cursor:pointer;transition:var(--transition);display:flex;align-items:center;gap:.5rem}.btn.primary{background:var(--primary-color);color:#fff}.btn.secondary{background:var(--surface-color);color:var(--text-color);border:1px solid var(--border-color)}.btn.accent{background:var(--accent-color);color:#fff}.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.btn.primary:hover{background:#1976d2}.btn.secondary:hover{background:var(--hover-color)}.btn.accent:hover{background:#45a049}.app-main{height:calc(100vh - 80px);overflow:hidden}.editor-workspace{display:grid;grid-template-columns:350px 1fr;height:calc(100vh - 80px);gap:1px;background:var(--border-color)}.sidebar{background:var(--surface-color);padding:1rem;overflow-y:auto;display:flex;flex-direction:column;gap:1rem;box-shadow:var(--shadow-strong)}.panel{background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:1rem}.panel h3{margin-bottom:.75rem;color:var(--primary-color);font-size:1rem;font-weight:600}.node-palette{display:flex;flex-direction:column;gap:.5rem}.node-item{padding:.75rem;background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--border-radius);cursor:grab;transition:var(--transition);font-size:.9rem}.node-item:hover{background:var(--hover-color);border-color:var(--primary-color)}.node-item:active{cursor:grabbing}.node-item .node-title{font-weight:500;color:var(--text-color)}.node-item .node-description{font-size:.8rem;color:var(--text-secondary);margin-top:.25rem}.canvas-container{background:var(--background-color);position:relative;overflow:hidden}.workflow-canvas{width:100%;height:100%;background:radial-gradient(circle,var(--border-color) 1px,transparent 1px);background-size:20px 20px}.preview-panel{background:var(--surface-color);padding:1rem;overflow-y:auto}.preview-container{background:var(--background-color);border:1px solid var(--border-color);border-radius:var(--border-radius);padding:1rem;min-height:200px}.preview-placeholder{display:flex;align-items:center;justify-content:center;height:150px;color:var(--text-secondary);border:2px dashed var(--border-color);border-radius:var(--border-radius)}.properties-panel{max-height:400px;overflow-y:auto}.property-group{margin-bottom:1rem}.property-label{display:block;margin-bottom:.25rem;font-size:.9rem;font-weight:500;color:var(--text-color)}.property-input,.property-select,.property-textarea{width:100%;padding:.5rem;background:var(--background-color);border:1px solid var(--border-color);border-radius:var(--border-radius);color:var(--text-color);font-size:.9rem;transition:var(--transition)}.property-input:focus,.property-select:focus,.property-textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #2196f333}.property-textarea{resize:vertical;min-height:80px}.property-checkbox{margin-right:.5rem}.property-description{font-size:.8rem;color:var(--text-secondary);margin-top:.25rem}.placeholder{text-align:center;color:var(--text-secondary);font-style:italic;padding:2rem}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--background-color)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--hover-color)}.joint-paper{background:transparent!important}.joint-element{cursor:pointer}.joint-element:hover .joint-element-tools{opacity:1}.joint-element-tools{opacity:0;transition:opacity .2s}.joint-element rect{fill:var(--surface-color);stroke:var(--border-color);stroke-width:2}.joint-element text{fill:var(--text-color);font-family:inherit;font-size:12px}.joint-link path{stroke:var(--primary-color);stroke-width:2}.joint-link .marker-target{fill:var(--primary-color)}.node-item[data-category="AI Generation"]{border-left:4px solid #F0680E}.node-item[data-category=Image]{border-left:4px solid #2196F3}.node-item[data-category=Text]{border-left:4px solid #FF9800}.node-item[data-category=Preview]{border-left:4px solid #795548}.node-item[data-category=Mask]{border-left:4px solid #455A64}.notification{animation:slideIn .3s ease-out}@keyframes slideIn{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.node-category{margin-bottom:1rem}.category-header{font-size:.9rem;font-weight:600;color:var(--primary-color);margin-bottom:.5rem;padding:.25rem 0;border-bottom:1px solid var(--border-color);cursor:pointer;transition:var(--transition)}.category-header:hover{color:#1976d2}.category-nodes{display:flex;flex-direction:column;gap:.5rem}.category-badge{display:inline-block;padding:.1rem .4rem;border-radius:4px;font-size:.7rem;color:#fff;margin-top:.25rem;opacity:.8}.properties-header{padding-bottom:.75rem;border-bottom:1px solid var(--border-color);margin-bottom:1rem}.properties-header .node-title{font-size:1.1rem;font-weight:600;color:var(--primary-color);margin-bottom:.25rem}.properties-header .node-id{font-size:.8rem;color:var(--text-secondary)}.properties-form{display:flex;flex-direction:column;gap:1rem}.property-label.required{color:#ff5722}.property-checkbox-label{display:flex;align-items:center;gap:.5rem;cursor:pointer;font-size:.9rem}.property-checkbox{width:auto!important;margin:0!important}.error-message{color:#f44336;text-align:center;padding:1rem;background:#f443361a;border-radius:var(--border-radius);border:1px solid rgba(244,67,54,.3)}.preview-header{border-bottom:1px solid var(--border-color);margin-bottom:1rem}.preview-tabs{display:flex;gap:1px;background:var(--border-color);border-radius:var(--border-radius);padding:2px}.tab-button{flex:1;padding:.5rem;border:none;background:var(--surface-color);color:var(--text-secondary);border-radius:calc(var(--border-radius) - 2px);cursor:pointer;transition:var(--transition);font-size:.8rem}.tab-button.active{background:var(--primary-color);color:#fff}.tab-button:hover:not(.active){background:var(--hover-color);color:var(--text-color)}.tab-content{display:none;animation:fadeIn .2s ease-in}.tab-content.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.workflow-stats{display:flex;gap:1rem;margin-bottom:1rem;padding:.75rem;background:var(--background-color);border-radius:var(--border-radius)}.stat-item{display:flex;flex-direction:column;align-items:center;gap:.25rem}.stat-label{font-size:.8rem;color:var(--text-secondary)}.stat-value{font-size:1.25rem;font-weight:600;color:var(--primary-color)}.structure-tree{max-height:300px;overflow-y:auto}.structure-node{padding:.5rem;margin-bottom:.5rem;background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--border-radius);cursor:pointer;transition:var(--transition)}.structure-node:hover{border-color:var(--primary-color)}.structure-node .node-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:.25rem}.structure-node .node-title{font-weight:500;color:var(--text-color)}.structure-node .node-id,.node-connections{font-size:.8rem;color:var(--text-secondary)}.connection{margin:.1rem 0}.workflow-actions,.node-preview-actions{margin-top:1rem;display:flex;gap:.5rem}.btn.small{padding:.375rem .75rem;font-size:.8rem}.node-preview-content{display:flex;flex-direction:column;gap:1rem}.node-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.node-header h4{margin:0;color:var(--primary-color)}.node-info{padding:.5rem;background:var(--background-color);border-radius:var(--border-radius)}.node-inputs h5{margin-bottom:.5rem;color:var(--text-color)}.inputs-list{display:flex;flex-direction:column;gap:.25rem}.input-item{display:flex;justify-content:space-between;padding:.25rem .5rem;background:var(--surface-color);border-radius:4px;font-size:.8rem}.input-name{color:var(--text-color);font-weight:500}.input-value{color:var(--text-secondary);max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.node-image-preview{text-align:center;margin-top:1rem}.node-image-preview img{max-width:100%;max-height:200px;border-radius:var(--border-radius);border:1px solid var(--border-color)}.result-preview-content{display:flex;flex-direction:column;gap:1rem}.result-header{display:flex;justify-content:space-between;align-items:center}.result-status{padding:.2rem .5rem;border-radius:4px;font-size:.8rem;font-weight:500}.result-status.success{background:#f0680e33;color:#f0680e}.result-status.error{background:#f4433633;color:#f44336}.result-status.unknown{background:#9e9e9e33;color:#9e9e9e}.image-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}.result-image{display:flex;flex-direction:column;gap:.5rem}.result-image img{width:100%;height:auto;border-radius:var(--border-radius);border:1px solid var(--border-color)}.image-info{display:flex;justify-content:space-between;align-items:center;font-size:.8rem;color:var(--text-secondary)}.result-metadata{background:var(--background-color);padding:1rem;border-radius:var(--border-radius);border:1px solid var(--border-color)}.result-metadata h6{margin-bottom:.5rem;color:var(--text-color)}.result-metadata pre{font-size:.7rem;color:var(--text-secondary);white-space:pre-wrap;word-wrap:break-word;max-height:200px;overflow-y:auto}.layer-manager{display:flex;flex-direction:column;height:100%}.layer-manager .layer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.layer-header h4{margin:0;font-size:1rem;color:var(--primary-color)}.layer-controls{display:flex;gap:.25rem}.layer-controls .btn{padding:.25rem .5rem;font-size:.8rem;min-width:auto}.layer-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.5rem}.layer-placeholder{text-align:center;color:var(--text-secondary);font-style:italic;padding:2rem 1rem;border:2px dashed var(--border-color);border-radius:var(--border-radius)}.layer-item{display:flex;justify-content:space-between;align-items:center;padding:.75rem;background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--border-radius);cursor:pointer;transition:var(--transition)}.layer-item:hover{background:var(--hover-color);border-color:var(--primary-color)}.layer-item.selected{background:var(--primary-color);color:#fff;border-color:var(--primary-color)}.layer-item.selected .layer-details,.layer-item.selected .layer-position{color:#ffffffe6}.layer-info{display:flex;align-items:center;gap:.5rem;flex:1;min-width:0}.layer-icon{font-size:1.2rem;flex-shrink:0}.layer-details{display:flex;flex-direction:column;min-width:0;flex:1}.layer-name{font-weight:500;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-position{font-size:.75rem;color:var(--text-secondary);margin-top:.1rem}.layer-controls{display:flex;gap:.25rem;opacity:1}.layer-controls button{background:none;border:none;padding:.2rem;border-radius:4px;cursor:pointer;font-size:.8rem;transition:var(--transition);color:var(--text-secondary)}.layer-controls button:hover{background:var(--hover-color);color:var(--text-color)}.layer-item.selected .layer-controls button{color:#fffc}.layer-item.selected .layer-controls button:hover{background:#ffffff1a;color:#fff}.parameters-sidebar{background:var(--surface-color);overflow-y:auto;overflow-x:hidden;display:flex;flex-direction:column}.parameter-panel{padding:1rem;min-width:0;overflow:hidden;background:var(--surface-color);box-shadow:var(--shadow-strong)}.panel-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border-color)}.panel-header h3{margin:0;color:var(--primary-color);font-size:1.1rem;font-weight:600}.btn-add-layer{padding:.5rem .75rem;border:none;border-radius:var(--border-radius);background:var(--primary-color);color:#fff;font-size:.8rem;cursor:pointer;transition:var(--transition);margin-left:.5rem}.btn-add-layer:hover{background:#1976d2;transform:translateY(-1px)}.layers-list{display:flex;flex-direction:column;gap:.4rem;overflow-x:hidden}.layer-container{display:flex;flex-direction:column;gap:0;transition:var(--transition);border-radius:var(--border-radius);overflow:hidden}.layer-container.selected{border:2px solid var(--accent-color);box-shadow:0 0 8px #4caf504d}.layer-title{display:flex;justify-content:space-between;align-items:center;padding:.3rem .5rem;background:var(--primary-color);color:#fff;border-radius:0;font-size:.8rem;font-weight:600;transition:var(--transition)}.layer-title .layer-name{color:#fff}.layer-container.selected .layer-title{background:var(--accent-color)}.layer-container.selected .layer-title .layer-name{color:#fff}.layer-title .layer-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.layer-title .btn-delete{width:20px;height:20px;font-size:12px;background:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff}.layer-title .btn-delete:hover{background:#f44336;border-color:#f44336;color:#fff}.layer-item{background:var(--surface-color);border:none;border-radius:0;padding:0;min-width:0;overflow:hidden}.layer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;border-bottom:1px solid var(--border-color)}.layer-name{font-weight:500;color:var(--text-color)}.btn-delete{background:#f44336;border:none;border-radius:50%;width:24px;height:24px;color:#fff;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:var(--transition)}.btn-delete:hover{background:#d32f2f;transform:scale(1.1)}.layer-controls{display:flex;flex-direction:column;gap:.35rem;margin-bottom:0;padding:.5rem;border-radius:0 0 var(--border-radius) var(--border-radius)}.control-group{display:flex;flex-direction:column;gap:.15rem}.control-row{display:grid;grid-template-columns:1fr 1fr;gap:.3rem;min-width:0}.control-group label{font-size:.75rem;font-weight:500;color:var(--text-color);word-break:break-word;white-space:normal;line-height:1.2}.control-group input,.control-group select,.control-group textarea{padding:.25rem .35rem;border:1px solid var(--border-color);border-radius:4px;background:var(--surface-color);color:var(--text-color);font-size:.85rem;transition:var(--transition);width:100%;min-width:0;box-sizing:border-box}.control-group input:focus,.control-group select:focus,.control-group textarea:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 2px #2196f333}.control-group textarea{resize:vertical;min-height:60px;overflow-wrap:break-word;word-wrap:break-word;white-space:pre-wrap}.control-group input[type=range]{-webkit-appearance:none;-moz-appearance:none;appearance:none;height:6px;background:var(--border-color);border-radius:3px;outline:none;padding:0;position:relative}.control-group input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:16px;height:16px;background:#f0680e;cursor:pointer;border-radius:50%;border:2px solid white;box-shadow:0 1px 3px #0003;margin-top:-5px;position:relative;z-index:2}.control-group input[type=range]::-moz-range-thumb{width:16px;height:16px;background:#f0680e;cursor:pointer;border-radius:50%;border:2px solid white;box-shadow:0 1px 3px #0003}.control-group input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:3px}.control-group input[type=range]::-moz-range-track{height:6px;background:var(--border-color);border-radius:3px}.control-group input[type=range]::-moz-range-progress{height:6px;background:#f0680e;border-radius:3px}.range-value{font-size:.8rem;color:var(--text-secondary);font-weight:500;margin-left:.5rem}.image-preview{margin-bottom:.75rem;text-align:center}.image-preview img{border-radius:4px;border:1px solid var(--border-color);max-width:100%;height:auto}.canvas-settings{margin-top:2rem;padding-top:1rem;border-top:2px solid var(--border-color)}.canvas-settings h4{margin-bottom:.75rem;color:var(--primary-color);font-size:1rem}.setting-group{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;min-width:0}.setting-group label{font-size:.85rem;font-weight:500;color:var(--text-color);flex-shrink:0;margin-right:.5rem}.setting-group input{width:80px;min-width:60px;padding:.3rem .5rem;border:1px solid var(--border-color);border-radius:4px;background:var(--surface-color);color:var(--text-color);font-size:.85rem;box-sizing:border-box}.canvas-area{background:var(--background-color);display:flex;flex-direction:column;overflow:hidden}.canvas-wrapper{height:100%;display:flex;flex-direction:column}.btn-zoom-old{padding:.4rem .6rem;border:1px solid var(--border-color);border-radius:4px;background:var(--background-color);color:var(--text-color);cursor:pointer;transition:var(--transition);font-size:.85rem}.btn-zoom:hover{background:var(--hover-color);border-color:var(--primary-color)}.zoom-value{font-size:.85rem;color:var(--text-secondary);font-weight:500;min-width:40px;text-align:center}.canvas-info{font-size:.85rem;color:var(--text-secondary)}.canvas-container{flex:1;overflow:hidden;position:relative}.canvas-viewport{width:100%;height:100%;overflow:auto;background-color:var(--canvas-background);background-image:radial-gradient(circle,#d0d0d0 1px,transparent 1px);background-size:20px 20px;display:flex;align-items:center;justify-content:center;padding:20px}.canvas{background:#fff;border:1px solid var(--border-color);box-shadow:var(--shadow);position:relative;transform-origin:top left}.canvas-layer{border:2px solid transparent;transition:border-color .2s;-webkit-user-select:none;user-select:none;background:transparent!important;position:absolute;min-width:50px;min-height:20px}.canvas-layer.selected{border-color:transparent!important;background:transparent!important}.canvas-layer.selected .layer-controls{display:block}.canvas-layer .layer-controls{display:none;position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;background:transparent!important}.selection-border{position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid var(--primary-color);background:transparent!important;pointer-events:none;box-sizing:border-box}.resize-handles{position:absolute;top:0;left:0;right:0;bottom:0}.resize-handle{position:absolute;width:8px;height:8px;background:var(--primary-color);border:1px solid white;border-radius:50%;pointer-events:all}.resize-handle--nw{top:-4px;left:-4px;cursor:nw-resize}.resize-handle--ne{top:-4px;right:-4px;cursor:ne-resize}.resize-handle--sw{bottom:-4px;left:-4px;cursor:sw-resize}.resize-handle--se{bottom:-4px;right:-4px;cursor:se-resize}.layer-content-wrapper{width:100%;height:100%;position:relative;overflow:visible}.canvas-layer--text .text-content{pointer-events:none;white-space:pre-wrap;word-wrap:break-word;background:transparent;width:auto;height:auto;display:inline-block;padding:4px 8px;min-width:20px;min-height:16px}.canvas-layer--image .layer-image{display:block;width:100%;height:100%;object-fit:contain;border-radius:var(--border-radius)}.layer-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--surface-color);border:2px dashed var(--border-color);border-radius:var(--border-radius);color:var(--text-secondary);font-size:14px;text-align:center;padding:1rem;min-width:100px;min-height:100px}.layer-placeholder span{font-size:2rem;margin-bottom:.5rem;opacity:.7}.layer-placeholder p{margin:0;font-size:12px;word-break:break-word}.layer-placeholder small{margin-top:.25rem;font-size:10px;opacity:.7}.snap-line{position:absolute;background:var(--primary-color);pointer-events:none;z-index:1000;opacity:.8}.snap-line.horizontal{height:1px}.snap-line.vertical{width:1px}.spacing-line{background:var(--primary-color);opacity:1}.spacing-label{background:var(--primary-color);color:#fff;font-size:11px;font-weight:600;padding:2px 6px;border-radius:3px;white-space:nowrap;pointer-events:none;box-shadow:0 1px 3px #0003}.layer-type{font-size:.7rem;color:var(--text-secondary);background:var(--background-color);padding:.2rem .4rem;border-radius:3px;margin-left:auto}.canvas-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:var(--text-secondary)}.parameter-panel.loading{display:flex;flex-direction:column;align-items:center;justify-content:center;height:200px;color:var(--text-secondary)}.btn-reload-workflow{background:none;border:1px solid var(--border-color);border-radius:4px;color:var(--text-secondary);cursor:pointer;padding:.25rem .5rem;font-size:.9rem;transition:var(--transition)}.btn-reload-workflow:hover{background:var(--hover-color);color:var(--text-color);border-color:var(--primary-color)}.modal{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:10000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:var(--surface-color);border-radius:var(--border-radius);box-shadow:0 8px 32px #00000080;max-width:90vw;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}.modal-header{padding:1rem;border-bottom:1px solid var(--border-color);display:flex;justify-content:space-between;align-items:center}.modal-header h3{margin:0;color:var(--primary-color);font-size:1.2rem}.modal-close{background:none;border:none;font-size:1.5rem;color:var(--text-secondary);cursor:pointer;padding:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:var(--transition)}.modal-close:hover{background:var(--hover-color);color:var(--text-color)}.modal-body{padding:1rem;overflow-y:auto;flex:1}.modal-footer{padding:1rem;border-top:1px solid var(--border-color);display:flex;justify-content:flex-end;gap:.75rem}.result-preview{min-width:400px;max-width:800px}.generated-image-container{text-align:center}.generated-image-container img{border-radius:var(--border-radius);box-shadow:var(--shadow)}.image-info{margin-top:.5rem;font-size:.85rem;color:var(--text-secondary)}.loading-modal .modal-content{max-width:400px;text-align:center}.loading-spinner{width:48px;height:48px;border:4px solid var(--border-color);border-top:4px solid var(--primary-color);border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-modal h3{margin:0 0 .5rem;color:var(--primary-color)}.loading-modal p{margin:0 0 1rem;color:var(--text-secondary)}.progress-bar{width:100%;height:8px;background:var(--background-color);border-radius:4px;overflow:hidden;margin-top:1rem}.progress-fill{height:100%;background:var(--primary-color);border-radius:4px;transition:width .3s ease;width:0%}@media (max-width: 1200px){.workspace{grid-template-columns:250px 1fr 250px}}@media (max-width: 768px){.workspace{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.sidebar,.preview-panel{height:auto;max-height:300px}.app-header{padding:.75rem 1rem}.app-header h1{font-size:1.25rem}.header-controls{gap:.5rem}.btn{padding:.4rem .8rem;font-size:.8rem}.image-grid{grid-template-columns:1fr}.workflow-stats{flex-wrap:wrap}.layer-header,.layer-item{flex-direction:column;align-items:flex-start;gap:.5rem}.layer-info{width:100%}.layer-controls{width:100%;justify-content:flex-end}}