:root{--bg-primary:#09090b;--bg-secondary:#131316;--bg-card:#1a1a1f;--bg-card-hover:#222228;--bg-elevated:#2a2a30;--text-primary:#fafafb;--text-secondary:#a1a1aa;--text-muted:#63636e;--accent:#3b82f6;--accent-dim:#2563eb;--accent-light:#60a5fa;--accent-glow:#3b82f61f;--accent-glow-strong:#3b82f638;--purple:#8b5cf6;--emerald:#10b981;--danger:#ef4444;--warning:#f59e0b;--info:#3b82f6;--border:#ffffff0f;--border-subtle:#ffffff0a;--border-active:#3b82f666;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-2xl:24px;--shadow-sm:0 1px 4px #00000040;--shadow-md:0 4px 16px #00000059;--shadow-lg:0 8px 32px #00000073;--shadow-glow:0 0 0 3px #3b82f614;--shadow-glow-strong:0 0 24px #3b82f626;--transition:.2s cubic-bezier(.4,0,.2,1);--transition-slow:.4s cubic-bezier(.4,0,.2,1);--transition-bounce:.5s cubic-bezier(.34,1.56,.64,1);--font:"Inter",system-ui,-apple-system,sans-serif;--z-overlay:10;--z-modal-backdrop:100;--z-modal:110;--z-toast:10000;--accent-gradient:linear-gradient(135deg,var(--accent),var(--accent-light));--accent-gradient-vivid:linear-gradient(135deg,#2563eb,#7c3aed,#3b82f6);--bg-glass:#09090bd9;--bg-glass-light:#ffffff08}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px}body{font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;line-height:1.5}img{max-width:100%;display:block}a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}.app-shell{background:var(--bg-primary);min-height:100vh;display:flex}.app-sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);flex-direction:column;flex-shrink:0;align-items:center;gap:6px;width:56px;height:100vh;padding:14px 0;display:flex;position:sticky;top:0}.app-sidebar-logo{background:var(--accent-gradient);color:#fff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;margin-bottom:14px;display:flex;box-shadow:0 0 16px #3b82f633}.app-sidebar-nav{flex-direction:column;align-items:center;gap:4px;display:flex}.app-sidebar-item{border-radius:var(--radius-md);width:38px;height:38px;color:var(--text-muted);cursor:pointer;transition:var(--transition);background:0 0;border:1px solid #0000;justify-content:center;align-items:center;display:flex}.app-sidebar-item:hover:not(:disabled){color:var(--text-secondary);background:#ffffff0a}.app-sidebar-item.active{background:var(--accent-glow-strong);color:var(--accent-light);border-color:#3b82f62e;box-shadow:0 0 12px #3b82f614}.app-sidebar-item:disabled{opacity:.3;cursor:not-allowed}.app-body{flex-direction:column;flex:1;min-width:0;display:flex}.app-toolbar{background:var(--bg-glass);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border);z-index:var(--z-overlay);flex-shrink:0;justify-content:space-between;align-items:center;padding:10px 20px;display:flex;position:sticky;top:0}.app-toolbar-left,.app-toolbar-right{align-items:center;gap:12px;display:flex}.app-toolbar-sep{background:var(--border);width:1px;height:22px}.app-toolbar-step{color:var(--text-primary);letter-spacing:-.01em;font-size:.85rem;font-weight:600}.app-toolbar-btn{background:var(--bg-glass-light);color:var(--text-muted);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);font-size:13px;font-weight:500;line-height:1;font-family:var(--font);justify-content:center;align-items:center;padding:6px 10px;display:flex}.app-toolbar-btn:hover{color:var(--text-primary);background:#ffffff0f;border-color:#ffffff1f}.app-toolbar-btn-danger{color:var(--danger);border-color:#ef444426}.app-toolbar-btn-danger:hover{background:#ef444414;border-color:#ef444440}.app-ws{align-items:center;gap:6px;display:flex}.app-ws-icon{color:var(--text-muted);align-items:center;display:flex}.app-ws-select{background:var(--bg-glass-light);color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);font-size:13px;font-weight:500;font-family:var(--font);padding:6px 12px}.app-ws-select:hover{color:var(--text-primary);border-color:#ffffff1f}.app-ws-select:focus{border-color:var(--accent);box-shadow:var(--shadow-glow);outline:none}.app-ws-input{background:var(--bg-secondary);color:var(--text-primary);border:1px solid var(--border-active);border-radius:var(--radius-md);width:130px;font-size:13px;font-family:var(--font);transition:var(--transition);outline:none;padding:6px 12px}.app-ws-input:focus{box-shadow:var(--shadow-glow)}.app-user{border-radius:var(--radius-lg);align-items:center;gap:10px;padding:3px 4px 3px 3px;display:flex}.app-user-avatar{background:var(--accent-gradient);color:#fff;text-transform:uppercase;border-radius:50%;justify-content:center;align-items:center;width:30px;height:30px;font-size:12px;font-weight:700;display:flex;box-shadow:0 0 10px #3b82f61f}.app-user-name{color:var(--text-secondary);font-size:13px;font-weight:500}.app-user-logout{color:var(--text-muted);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);background:0 0;align-items:center;padding:5px 7px;display:flex}.app-user-logout:hover{color:var(--danger);background:#ef44440f;border-color:#ef444433}.app-content{flex:1;padding:24px;animation:.3s fadeIn;overflow-y:auto}@keyframes fadeIn{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.app-shell{flex-direction:column}.app-sidebar{border-right:none;border-bottom:1px solid var(--border);flex-direction:row;width:100%;height:auto;padding:8px 12px;position:static}.app-sidebar-logo{margin-bottom:0;margin-right:12px}.app-sidebar-nav{flex-direction:row;gap:4px}.app-user-name{display:none}.app-content{padding:16px}}.step-indicator{justify-content:center;align-items:center;gap:0;margin-bottom:32px;padding:16px 0;display:flex}.step-item-row{align-items:center;gap:0;display:flex}.step-item{border-radius:var(--radius-md);transition:var(--transition);align-items:center;gap:10px;padding:8px 16px;display:flex}.step-item.active{background:var(--accent-glow)}.step-circle{background:var(--bg-card);border:2px solid var(--border);width:36px;height:36px;transition:var(--transition);border-radius:50%;justify-content:center;align-items:center;font-size:1rem;display:flex}.step-item.active .step-circle{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.step-item.completed .step-circle{background:var(--accent-dim);border-color:var(--accent-dim);color:#fff;font-weight:600}.step-label{color:var(--text-secondary);transition:var(--transition);font-size:.875rem;font-weight:500}.step-item.active .step-label{color:var(--text-primary);font-weight:600}.step-item.completed .step-label{color:var(--accent-dim)}.step-connector{background:var(--border);width:48px;height:2px;transition:var(--transition)}.step-connector.completed{background:var(--accent-dim)}.btn-primary{background:var(--accent);color:#000;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);font-size:.875rem;font-weight:600;font-family:var(--font);white-space:nowrap;border:none;align-items:center;gap:8px;padding:10px 20px;display:inline-flex}.btn-primary:hover:not(:disabled){background:var(--accent-dim)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-primary.btn-lg{border-radius:var(--radius-md);padding:14px 28px;font-size:1rem}.btn-secondary{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);font-size:.875rem;font-weight:500;font-family:var(--font);align-items:center;gap:8px;padding:10px 20px;display:inline-flex}.btn-secondary:hover{background:var(--bg-card-hover);border-color:var(--text-muted)}.btn-ghost{color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);font-size:.875rem;font-weight:500;font-family:var(--font);background:0 0;border:none;align-items:center;gap:6px;padding:8px 12px;display:inline-flex}.btn-ghost:hover{color:var(--text-primary);background:#ffffff0d}.btn-ghost-sm{color:var(--text-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);font-size:.75rem;font-family:var(--font);background:0 0;padding:4px 8px}.btn-ghost-sm:hover{border-color:var(--text-muted);color:var(--text-primary)}.btn-icon{border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;width:32px;height:32px;transition:var(--transition);background:0 0;justify-content:center;align-items:center;font-size:.875rem;display:flex}.btn-icon:hover{background:var(--bg-card-hover);border-color:var(--text-muted)}.btn-icon-active{background:var(--accent);border-color:var(--accent);color:#fff}.btn-icon-active:hover{opacity:.85}.btn-icon-sm{cursor:pointer;width:24px;height:24px;transition:var(--transition);color:var(--text-secondary);background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;font-size:.75rem;display:flex}.btn-icon-sm:hover{color:var(--text-primary);background:#ffffff14}.upload-zone-container{max-width:900px;margin:0 auto}.upload-dropzone{border-radius:var(--radius-lg);text-align:center;cursor:pointer;transition:var(--transition);background:var(--bg-secondary);border:2px dashed #ffffff1a;padding:64px 40px}.upload-dropzone:hover,.upload-dropzone.drag-active{border-color:var(--accent);background:var(--accent-glow)}.upload-dropzone.uploading{pointer-events:none;opacity:.7}.upload-content{flex-direction:column;align-items:center;gap:12px;display:flex}.upload-icon{color:var(--text-muted);margin-bottom:8px}.upload-dropzone:hover .upload-icon,.upload-dropzone.drag-active .upload-icon{color:var(--accent)}.upload-content h3{color:var(--text-primary);font-size:1.125rem;font-weight:600}.upload-content p{color:var(--text-secondary);font-size:.875rem}.upload-formats{color:var(--text-muted);background:#ffffff0a;border-radius:20px;padding:4px 12px;font-size:.75rem}.upload-loading{color:var(--text-secondary);flex-direction:column;align-items:center;gap:12px;display:flex}.upload-preview{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);gap:24px;padding:24px;animation:.3s fadeIn;display:flex}.preview-image-wrap{border-radius:var(--radius-md);background:var(--bg-card);flex-shrink:0;justify-content:center;align-items:center;width:240px;height:240px;display:flex;overflow:hidden}.preview-image-wrap img{object-fit:contain;max-width:100%;max-height:100%}.preview-image-wrap.zoomable{cursor:zoom-in;position:relative}.preview-image-wrap.zoomable .zoom-overlay{opacity:0;transition:var(--transition);pointer-events:none;border-radius:var(--radius-md);background:#0006;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.preview-image-wrap.zoomable .zoom-overlay span{filter:drop-shadow(0 2px 4px #00000080);font-size:2rem}.preview-image-wrap.zoomable:hover .zoom-overlay{opacity:1}.preview-info{flex-direction:column;justify-content:center;gap:8px;display:flex}.preview-info h4{word-break:break-all;font-size:1rem;font-weight:600}.preview-info p{color:var(--text-secondary);font-size:.875rem}.preview-actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.variation-container{animation:.3s fadeIn}.variation-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;display:flex}.variation-header-left{align-items:center;gap:12px;display:flex}.variation-header-left h2{font-size:1.25rem;font-weight:600}.variation-header-right{align-items:center;gap:10px;display:flex}.selected-count{color:var(--accent);font-size:.875rem;font-weight:600}.style-picker{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);margin-bottom:20px;padding:20px}.style-picker-header{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.style-picker-header h3{color:var(--text-primary);font-size:.95rem;font-weight:600}.style-picker-actions{align-items:center;gap:8px;display:flex}.style-picker-count{color:var(--accent);background:var(--accent-glow);border-radius:20px;padding:2px 10px;font-size:.8rem;font-weight:600}.style-chips{flex-wrap:wrap;gap:10px;display:flex}.style-chip{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius-xl);cursor:pointer;transition:var(--transition);font-family:var(--font);color:var(--text-secondary);-webkit-user-select:none;user-select:none;align-items:center;gap:8px;padding:10px 16px;font-size:.85rem;font-weight:500;display:inline-flex}.style-chip:hover:not(:disabled){border-color:var(--text-muted);background:var(--bg-card-hover);color:var(--text-primary)}.style-chip.picked{border-color:var(--accent);background:var(--accent-glow);color:var(--accent)}.style-chip.picked:hover:not(:disabled){background:var(--accent-glow-strong)}.style-chip:disabled{opacity:.6;cursor:not-allowed}.style-chip-icon{font-size:1.1rem;line-height:1}.style-chip-name{line-height:1}.prompt-section{margin-bottom:24px}.prompt-section label{color:var(--text-secondary);margin-bottom:8px;font-size:.8rem;font-weight:500;display:block}.prompt-input-row{gap:12px;display:flex}.prompt-input-row input{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.875rem;font-family:var(--font);transition:var(--transition);flex:1;padding:10px 16px}.prompt-input-row input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #3b82f614}.toggle-group{flex-shrink:0;align-items:center;display:flex}.toggle-switch{cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);transition:var(--transition);align-items:center;gap:10px;padding:8px 14px;display:inline-flex}.toggle-switch:hover{border-color:var(--text-muted)}.toggle-switch input{display:none}.toggle-slider{background:var(--bg-card);border:1px solid var(--border);width:40px;height:22px;transition:var(--transition);border-radius:11px;flex-shrink:0;position:relative}.toggle-slider:after{content:"";background:var(--text-muted);width:16px;height:16px;transition:var(--transition);border-radius:50%;position:absolute;top:2px;left:2px}.toggle-switch input:checked+.toggle-slider{background:var(--accent);border-color:var(--accent)}.toggle-switch input:checked+.toggle-slider:after{background:#fff;left:20px}.toggle-label{color:var(--text-secondary);white-space:nowrap;font-size:.8rem;font-weight:500}.toggle-switch input:checked~.toggle-label{color:var(--accent)}.prompt-input-row input::placeholder{color:var(--text-muted)}.count-selector{flex-direction:column;flex-shrink:0;gap:4px;display:flex}.count-selector label{color:var(--text-muted);margin-bottom:0;font-size:.7rem}.count-selector select{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-primary);font-size:.875rem;font-family:var(--font);cursor:pointer;transition:var(--transition);appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239898aa' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-position:right 10px center;background-repeat:no-repeat;min-width:70px;padding:10px 28px 10px 12px}.count-selector select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #3b82f614}.count-selector select option{background:var(--bg-card);color:var(--text-primary)}.source-preview-mini{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:10px;margin-bottom:24px;padding:8px 14px;display:inline-flex}.source-preview-mini img{object-fit:cover;border-radius:6px;width:36px;height:36px}.source-preview-mini span{color:var(--text-secondary);font-size:.8rem}.source-preview-mini.zoomable{cursor:zoom-in;transition:var(--transition)}.source-preview-mini.zoomable:hover{border-color:var(--accent);background:var(--accent-glow)}.zoom-hint{opacity:0;transition:var(--transition);margin-left:auto}.source-preview-mini.zoomable:hover .zoom-hint{opacity:1}.variation-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:24px;display:grid}.variation-card{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);position:relative;overflow:hidden}.variation-card:hover{border-color:var(--text-muted);box-shadow:var(--shadow-sm)}.variation-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.variation-card.loading{pointer-events:none}.variation-image-wrap{aspect-ratio:1;background:var(--bg-secondary);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.variation-image-wrap.checkerboard{background-image:var(--checkerboard)}.variation-image-wrap img{object-fit:cover;width:100%;height:100%}.variation-toolbar{opacity:0;pointer-events:none;background:linear-gradient(#0000,#000000b3);justify-content:center;gap:4px;padding:8px 6px;transition:opacity .2s,translate .2s;display:flex;position:absolute;bottom:0;left:0;right:0;translate:0 6px}.variation-image-wrap:hover .variation-toolbar{opacity:1;pointer-events:auto;translate:0}.vtool-btn{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#fff;cursor:pointer;background:#ffffff1f;border:1px solid #fff3;border-radius:8px;justify-content:center;align-items:center;width:34px;height:34px;font-size:.9rem;text-decoration:none;transition:background .15s,transform .15s;display:flex}.vtool-btn:hover{background:#ffffff47}.vtool-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.vtool-active{background:var(--accent);border-color:var(--accent)}.vtool-active:hover{background:var(--accent-hover)}.variation-check{z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;cursor:pointer;background:#00000059;border:2px solid #fff9;border-radius:6px;justify-content:center;align-items:center;width:22px;height:22px;font-size:.7rem;font-weight:700;transition:background .15s,border-color .15s,transform .15s;display:flex;position:absolute;top:8px;left:8px}.variation-check:hover{border-color:#fff}.variation-check.checked{background:var(--accent);border-color:var(--accent)}.variation-badge-nobg{z-index:10;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;letter-spacing:.03em;pointer-events:none;background:#0000008c;border-radius:6px;padding:2px 8px;font-size:.65rem;font-weight:600;position:absolute;top:8px;right:8px}.variation-loading{aspect-ratio:1;background:var(--bg-secondary);color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:12px;font-size:.8rem;display:flex}.variation-error{aspect-ratio:1;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:8px;display:flex}.variation-error span{font-size:2rem}.variation-error p{font-size:.8rem}.variation-card-footer{justify-content:center;align-items:center;padding:8px 12px;display:flex}.variation-label{color:var(--text-secondary);text-align:center;font-size:.8rem;font-weight:500}.checkbox{border:2px solid var(--text-muted);color:#000;width:20px;height:20px;transition:var(--transition);border-radius:4px;justify-content:center;align-items:center;font-size:.7rem;font-weight:700;display:flex}.checkbox.checked{background:var(--accent);border-color:var(--accent)}.variation-deselect-btn{z-index:10;color:#fff;cursor:pointer;width:24px;height:24px;transition:var(--transition);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#000000b3;border:none;border-radius:50%;justify-content:center;align-items:center;font-size:.75rem;font-weight:700;display:flex;position:absolute;top:6px;right:6px}.variation-deselect-btn:hover{background:var(--danger)}.variation-empty{text-align:center;color:var(--text-muted);padding:80px 40px}.empty-icon{margin-bottom:16px;font-size:3rem}.variation-empty h3{color:var(--text-secondary);margin-bottom:8px;font-size:1.125rem}.variation-empty p{max-width:400px;margin:0 auto;font-size:.875rem}.variation-footer{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;padding-top:8px;display:flex}.btn-icon.removing{opacity:.7;cursor:wait}.generation-progress{align-items:center;gap:10px;margin-top:8px;display:flex}.generation-progress-bar{background:var(--bg-elevated);border-radius:3px;flex:1;height:6px;overflow:hidden}.generation-progress-fill{background:var(--accent);border-radius:3px;height:100%;transition:width .3s}.generation-progress-text{color:var(--text-muted);white-space:nowrap;font-size:.75rem}.mockup-container{animation:.3s fadeIn}.mockup-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:24px;display:flex}.badge{background:var(--accent-glow);color:var(--accent);border:1px solid #3b82f633;border-radius:20px;padding:6px 14px;font-size:.8rem;font-weight:600}.mockup-layout{grid-template-columns:300px 1fr;gap:24px;min-height:500px;display:grid}.mockup-sidebar{flex-direction:column;gap:16px;display:flex}.mockup-sidebar h3{color:var(--text-secondary);font-size:.9rem;font-weight:600}.mockup-upload-mini{border:2px dashed var(--border);border-radius:var(--radius-sm);text-align:center;cursor:pointer;color:var(--text-muted);transition:var(--transition);padding:16px;font-size:.8rem}.mockup-upload-mini:hover,.mockup-upload-mini.drag-active{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}.template-list{flex-direction:column;gap:8px;display:flex}.template-item{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);align-items:center;gap:10px;padding:8px 10px;display:flex}.template-item:hover{border-color:var(--text-muted)}.template-item.active{border-color:var(--accent);background:var(--accent-glow)}.template-item img{object-fit:cover;border-radius:6px;width:48px;height:48px}.template-item-info{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.template-name{white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;font-weight:500;overflow:hidden}.template-status{color:var(--warning);font-size:.7rem}.template-status.has-mask{color:var(--accent)}.selected-variations-mini{flex-wrap:wrap;gap:8px;display:flex}.mini-variation{flex-direction:column;align-items:center;gap:4px;display:flex;position:relative}.mini-variation img{object-fit:cover;border:1px solid var(--border);border-radius:6px;width:52px;height:52px}.mini-variation span{color:var(--text-muted);text-align:center;white-space:nowrap;text-overflow:ellipsis;max-width:60px;font-size:.65rem;overflow:hidden}.mini-remove{opacity:0;transition:var(--transition);justify-content:center;align-items:center;position:absolute;top:-6px;right:-6px;background:var(--error)!important;color:#fff!important;border:2px solid var(--bg-secondary)!important;border-radius:50%!important;width:20px!important;height:20px!important;font-size:.6rem!important;display:flex!important}.mini-variation:hover .mini-remove{opacity:1}.mockup-canvas-area{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;align-items:center;gap:12px;padding:16px;display:flex}.canvas-instructions{color:var(--text-muted);background:var(--bg-card);border-radius:var(--radius-sm);padding:8px 16px;font-size:.8rem}.canvas-wrapper{max-width:100%;position:relative;overflow:auto}.canvas-wrapper canvas{border-radius:var(--radius-sm);max-width:100%;height:auto}.canvas-empty{text-align:center;color:var(--text-muted);flex-direction:column;flex:1;justify-content:center;align-items:center;padding:60px 40px;display:flex}.canvas-empty h3{color:var(--text-secondary);margin-bottom:8px;font-size:1.1rem}.canvas-empty p{max-width:360px;font-size:.875rem}.mockup-generate-bar{flex-wrap:wrap;justify-content:center;gap:12px;padding:24px 0;display:flex}.generated-mockups-section{margin-top:24px}.generated-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.generated-header h3{font-size:1rem;font-weight:600}.generated-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;display:grid}.generated-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);transition:var(--transition);overflow:hidden}.generated-card:hover{border-color:var(--text-muted);box-shadow:var(--shadow-sm)}.generated-card img{aspect-ratio:1;object-fit:cover;width:100%}.generated-image-wrap{cursor:zoom-in;position:relative}.generated-image-wrap .zoom-overlay{border-radius:var(--radius-md)var(--radius-md)0 0}.generated-card.selected{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}.generated-card-footer{color:var(--text-secondary);justify-content:space-between;align-items:center;gap:6px;padding:10px 12px;font-size:.75rem;display:flex}.generated-card-info{flex:1;align-items:center;gap:4px;min-width:0;display:flex;overflow:hidden}.generated-card-info span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.generated-card-actions{flex-shrink:0;align-items:center;gap:6px;display:flex}.generated-card-footer .dot{color:var(--text-muted);flex-shrink:0}.generated-header-actions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.rotation-controls{background:var(--bg-card);border-radius:var(--radius-sm);border:1px solid var(--border);align-items:center;gap:8px;padding:8px 12px;display:flex}.rotation-controls label{color:var(--text-secondary);white-space:nowrap;font-size:.8rem}.rotation-controls input[type=range]{min-width:100px;accent-color:var(--accent);flex:1}.rotation-value{color:var(--accent);text-align:center;min-width:40px;font-size:.8rem;font-weight:600}.rotation-btns{gap:4px;display:flex}.undo-redo-bar{align-items:center;gap:6px;display:flex}.design-overlay{transition:outline-color .15s}.design-overlay:focus{outline:2px solid var(--accent)!important}.overlay-handle{border:2px solid var(--accent);z-index:11;touch-action:none;background:#fff;border-radius:50%;width:12px;height:12px}.overlay-handle:hover{background:var(--accent)}.overlay-handle-rotate{border:2px solid var(--accent);width:22px;height:22px;color:var(--accent);z-index:11;touch-action:none;background:#fff;border-radius:50%;justify-content:center;align-items:center;font-size:12px;font-weight:700;display:flex}.overlay-handle-rotate:hover{background:var(--accent);color:#fff}.overlay-remove-btn{background:var(--error,#ef4444);color:#fff;cursor:pointer;z-index:12;opacity:0;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:10px;transition:opacity .15s;display:flex}.design-overlay:hover .overlay-remove-btn,.design-overlay:hover .overlay-reset-crop-btn{opacity:1}.overlay-crop-handle{z-index:1;background:#ffa50099;transition:background .15s;position:absolute}.overlay-crop-handle:hover{background:#ffa500e6}.overlay-crop-top{cursor:n-resize;border-radius:0 0 3px 3px;height:6px;left:10%;right:10%}.overlay-crop-bottom{cursor:s-resize;border-radius:3px 3px 0 0;height:6px;left:10%;right:10%}.overlay-crop-left{cursor:w-resize;border-radius:0 3px 3px 0;width:6px;top:10%;bottom:10%}.overlay-crop-right{cursor:e-resize;border-radius:3px 0 0 3px;width:6px;top:10%;bottom:10%}.overlay-reset-crop-btn{color:#fff;cursor:pointer;z-index:12;opacity:0;background:#ffa500e6;border:2px solid #fff;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;transition:opacity .15s;display:flex;position:absolute;bottom:-10px;left:50%;transform:translate(-50%)}.ai-options-panel{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);max-width:600px;margin:0 auto;padding:16px 20px;animation:.2s fadeIn}.ai-options-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.ai-options-header h4{-webkit-text-fill-color:transparent;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;font-size:.95rem;font-weight:600}.ai-options-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;display:grid}.ai-option-group{flex-direction:column;gap:6px;display:flex}.ai-option-group label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.75rem;font-weight:600}.ai-option-chips{flex-wrap:wrap;gap:4px;display:flex}.ai-chip{border:1px solid var(--border);background:var(--bg-secondary);color:var(--text-secondary);cursor:pointer;transition:var(--transition);border-radius:16px;padding:4px 10px;font-size:.78rem}.ai-chip:hover{border-color:var(--text-muted)}.ai-chip.active{color:#fff;background:linear-gradient(135deg,#667eea,#764ba2);border-color:#0000}.ai-prompt-input{border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--bg-secondary);width:100%;color:var(--text-primary);resize:vertical;transition:var(--transition);padding:10px 12px;font-family:inherit;font-size:.85rem}.ai-prompt-input:focus{border-color:#667eea;outline:none;box-shadow:0 0 0 2px #667eea26}.ai-prompt-input::placeholder{color:var(--text-muted)}.blend-controls{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);flex-wrap:wrap;align-items:center;gap:16px;margin-top:12px;padding:12px 16px;display:flex}.blend-control-group{align-items:center;gap:8px;display:flex}.blend-control-group label{color:var(--text-secondary);white-space:nowrap;align-items:center;gap:4px;font-size:.8rem;display:flex}.blend-control-group select{background:var(--bg-elevated);color:var(--text-primary);border:1px solid var(--border);border-radius:4px;padding:4px 8px;font-size:.8rem}.blend-control-group input[type=range]{width:100px;accent-color:var(--accent)}.blend-control-group input[type=checkbox]{accent-color:var(--accent);margin-right:4px}.blend-value{color:var(--text-muted);min-width:32px;font-size:.75rem}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.7s linear infinite spin}.spinner-sm{border:2px solid #0003;border-top-color:#000c;border-radius:50%;width:16px;height:16px;animation:.7s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}.error-message{border-radius:var(--radius-sm);color:var(--danger);background:#ff4d6a1a;border:1px solid #ff4d6a4d;margin-top:12px;padding:12px 16px;font-size:.875rem}.error-banner{border-radius:var(--radius-sm);color:var(--danger);background:#ff4d6a1a;border:1px solid #ff4d6a4d;justify-content:space-between;align-items:center;margin-bottom:20px;padding:12px 16px;font-size:.875rem;animation:.3s fadeIn;display:flex}.error-banner button{color:var(--danger);cursor:pointer;background:0 0;border:none;padding:0 4px;font-size:1rem}@media (max-width:768px){.app-container{padding:0 16px 60px}.mockup-layout{grid-template-columns:1fr}.upload-preview{flex-direction:column;align-items:center}.preview-image-wrap{width:200px;height:200px}.variation-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.step-indicator{overflow-x:auto}.prompt-input-row{flex-direction:column}}.variation-image-wrap{cursor:zoom-in;position:relative}.zoom-overlay{opacity:0;transition:var(--transition);pointer-events:none;background:#0006;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.zoom-overlay span{filter:drop-shadow(0 2px 4px #00000080);font-size:2rem}.variation-image-wrap:hover .zoom-overlay{opacity:1}.lightbox-overlay{z-index:var(--z-modal);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);cursor:zoom-out;background:#000000eb;justify-content:center;align-items:center;animation:.2s lightboxFadeIn;display:flex;position:fixed;inset:0}@keyframes lightboxFadeIn{0%{opacity:0}to{opacity:1}}.lightbox-close{color:#fff;cursor:pointer;width:44px;height:44px;transition:var(--transition);z-index:var(--z-modal);background:#ffffff1a;border:1px solid #ffffff26;border-radius:50%;justify-content:center;align-items:center;font-size:1.25rem;display:flex;position:absolute;top:20px;right:24px}.lightbox-close:hover{background:#fff3}.lightbox-content{cursor:default;flex-direction:column;align-items:center;gap:16px;max-width:min(90vw,1200px);max-height:90vh;display:flex}.lightbox-image{object-fit:contain;border-radius:var(--radius-md);width:100%;max-height:80vh;animation:.25s lightboxZoomIn;box-shadow:0 20px 60px #00000080}@keyframes lightboxZoomIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.lightbox-caption{color:var(--text-secondary);background:#ffffff14;border-radius:20px;padding:6px 16px;font-size:.9rem;font-weight:500}.toast-container{z-index:var(--z-toast);flex-direction:column;gap:8px;max-width:420px;display:flex;position:fixed;top:20px;right:20px}.toast{border-radius:var(--radius-sm);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:var(--shadow-md);align-items:center;gap:10px;padding:12px 16px;font-size:.875rem;animation:.3s toastSlideIn;display:flex}@keyframes toastSlideIn{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.toast-error{color:var(--danger);background:#ff4d6a26;border:1px solid #ff4d6a4d}.toast-success{color:#22c55e;background:#22c55e1f;border:1px solid #22c55e40}.toast-warning{color:var(--warning);background:#ffb84d26;border:1px solid #ffb84d4d}.toast-info{color:var(--info);background:#4dacff26;border:1px solid #4dacff4d}.toast-icon{flex-shrink:0;font-size:1rem}.toast-message{flex:1;line-height:1.4}.toast-close{color:inherit;cursor:pointer;opacity:.6;background:0 0;border:none;flex-shrink:0;padding:2px;font-size:.8rem}.toast-close:hover{opacity:1}.btn-remove-bg{background:var(--bg-card);color:var(--text-primary);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);font-size:.85rem;font-weight:600;font-family:var(--font);white-space:nowrap;align-items:center;gap:8px;padding:10px 18px;display:inline-flex;position:relative;overflow:hidden}.btn-remove-bg:hover:not(:disabled){border-color:var(--warning);color:var(--warning);background:#ffb84d1a}.btn-remove-bg:disabled{opacity:.85;cursor:wait;border-color:var(--warning);color:var(--warning)}.remove-bg-icon{font-size:1rem}.remove-bg-progress{background:#ffb84d26;height:3px;position:absolute;bottom:0;left:0;right:0}.remove-bg-progress-bar{background:var(--warning);border-radius:0 3px 3px 0;height:100%;transition:width .3s}.cropper-overlay{z-index:var(--z-modal-backdrop);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000d9;justify-content:center;align-items:center;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.cropper-modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;gap:16px;max-width:90vw;max-height:90vh;padding:24px;display:flex}.cropper-canvas-wrap{border-radius:var(--radius-sm);cursor:crosshair;position:relative;overflow:hidden}.cropper-actions{justify-content:flex-end;gap:10px;display:flex}:root{--checkerboard:repeating-conic-gradient(#ffffff0d 0% 25%,#ffffff05 0% 50%)0 0/20px 20px}.removebg-panel-overlay{z-index:var(--z-modal);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000c;justify-content:center;align-items:center;padding:20px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.removebg-panel{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:720px;max-height:90vh;box-shadow:var(--shadow-lg);padding:28px;animation:.25s fadeIn;position:relative;overflow-y:auto}.removebg-panel-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.removebg-panel-header h2{letter-spacing:-.02em;font-size:1.25rem;font-weight:600}.removebg-mode-grid{grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:20px;display:grid}.removebg-mode-btn{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);font-family:var(--font);color:var(--text-secondary);flex-direction:column;align-items:center;gap:6px;padding:14px 8px;display:flex}.removebg-mode-btn:hover:not(:disabled){border-color:var(--text-muted);background:var(--bg-card-hover);color:var(--text-primary)}.removebg-mode-btn.active{border-color:var(--accent);background:var(--accent-glow);color:var(--accent)}.removebg-mode-btn:disabled{opacity:.6;cursor:not-allowed}.removebg-mode-icon{font-size:1.5rem;line-height:1}.removebg-mode-label{white-space:nowrap;font-size:.75rem;font-weight:600;line-height:1}.removebg-options{min-height:48px;margin-bottom:16px}.removebg-options label{color:var(--text-secondary);margin-bottom:10px;font-size:.8rem;font-weight:500;display:block}.removebg-color-swatches{flex-wrap:wrap;gap:8px;display:flex}.removebg-swatch{border:2px solid var(--border);cursor:pointer;width:36px;height:36px;transition:var(--transition);border-radius:8px;padding:0;position:relative}.removebg-swatch:hover{border-color:var(--text-muted)}.removebg-swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent);transform:scale(1.1)}.removebg-swatch-custom{border-style:dashed;justify-content:center;align-items:center;display:flex;overflow:hidden;background:var(--bg-card)!important}.removebg-swatch-custom input[type=color]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.removebg-swatch-custom span{color:var(--text-muted);pointer-events:none;font-size:1.1rem}.removebg-gradient-grid{grid-template-columns:repeat(5,1fr);gap:10px;display:grid}.removebg-gradient-swatch{border:2px solid var(--border);cursor:pointer;height:48px;transition:var(--transition);border-radius:10px;padding:0}.removebg-gradient-swatch:hover{border-color:var(--text-muted)}.removebg-gradient-swatch.active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent);transform:scale(1.05)}.removebg-blur-info{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:14px 18px}.removebg-blur-info p{color:var(--text-secondary);font-size:.85rem;line-height:1.6}.removebg-custom-upload{margin-top:4px}.removebg-upload-btn{background:var(--bg-card);border:2px dashed var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);font-family:var(--font);color:var(--text-secondary);justify-content:center;align-items:center;gap:8px;width:100%;padding:14px 24px;font-size:.875rem;font-weight:500;display:flex}.removebg-upload-btn:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}.removebg-custom-preview-wrap{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:12px;padding:8px;display:flex}.removebg-custom-preview-wrap img{object-fit:cover;border-radius:6px;width:60px;height:40px}.removebg-edge-toggle{margin-bottom:20px}.removebg-preview-area{align-items:stretch;gap:12px;margin-bottom:24px;display:flex}.removebg-preview-card{flex-direction:column;flex:1;gap:8px;display:flex}.removebg-preview-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:.75rem;font-weight:600}.removebg-preview-img{aspect-ratio:1;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.removebg-preview-img img{object-fit:contain;max-width:100%;max-height:100%}.removebg-preview-arrow{color:var(--text-muted);align-items:center;padding-top:20px;font-size:1.5rem;display:flex}.removebg-processing{color:var(--text-secondary);flex-direction:column;align-items:center;gap:10px;font-size:.85rem;display:flex}.removebg-placeholder{color:var(--text-muted);text-align:center;flex-direction:column;align-items:center;gap:8px;padding:20px;display:flex}.removebg-placeholder span{opacity:.5;font-size:2rem}.removebg-placeholder p{font-size:.8rem}.removebg-actions{justify-content:space-between;align-items:center;gap:12px;display:flex}.removebg-result-actions{gap:10px;display:flex}.removebg-progress-bar-wrap{border-radius:0 0 var(--radius-lg)var(--radius-lg);background:#3b82f61a;height:3px;position:absolute;bottom:0;left:0;right:0;overflow:hidden}.removebg-progress-bar{background:var(--accent);height:100%;transition:width .3s}@media (max-width:640px){.removebg-mode-grid,.removebg-gradient-grid{grid-template-columns:repeat(3,1fr)}.removebg-preview-area{flex-direction:column}.removebg-preview-arrow{justify-content:center;padding-top:0;transform:rotate(90deg)}.removebg-panel{padding:20px}}.removebg-panel-colorkey{width:95vw;max-width:820px}.colorkey-layout{grid-template-columns:1fr 280px;gap:20px;margin:16px 0;display:grid}.colorkey-canvas-section{flex-direction:column;gap:8px;display:flex}.colorkey-canvas-header{justify-content:space-between;align-items:center;min-height:28px;display:flex}.colorkey-instruction{color:var(--text-muted);font-size:.8rem}.colorkey-cursor-badge{background:var(--bg-card);border:1px solid var(--border);border-radius:6px;align-items:center;gap:6px;padding:3px 10px;font-size:.75rem;display:flex}.colorkey-cursor-dot{border:2px solid var(--border);border-radius:50%;flex-shrink:0;width:14px;height:14px}.colorkey-cursor-hex{color:var(--text-secondary);font-family:monospace}.colorkey-canvas{border:1px solid var(--border);cursor:crosshair;background:var(--bg-secondary);border-radius:10px;max-width:100%;display:block}.colorkey-controls-section{flex-direction:column;gap:16px;display:flex}.colorkey-controls-section label{color:var(--text-secondary);font-size:.8rem;font-weight:500}.colorkey-selected{flex-direction:column;gap:8px;display:flex}.colorkey-color-display{align-items:center;gap:8px;display:flex}.colorkey-color-swatch{border:2px solid var(--border);border-radius:8px;flex-shrink:0;width:36px;height:36px}.colorkey-color-input{cursor:pointer;border:none;border-radius:6px;flex-shrink:0;width:36px;height:36px;padding:0}.colorkey-hex-input{border:1px solid var(--border);background:var(--bg-card);color:var(--text-primary);border-radius:8px;flex:1;min-width:0;padding:6px 10px;font-family:monospace;font-size:.85rem}.colorkey-no-color{background:var(--bg-secondary);color:var(--text-muted);text-align:center;border-radius:8px;padding:12px;font-size:.8rem}.colorkey-slider-group{flex-direction:column;gap:4px;display:flex}.colorkey-slider-header{justify-content:space-between;align-items:center;display:flex}.colorkey-slider-value{color:var(--accent);text-align:right;min-width:28px;font-family:monospace;font-size:.8rem;font-weight:600}.colorkey-range{width:100%;accent-color:var(--accent)}.colorkey-slider-labels{color:var(--text-muted);justify-content:space-between;font-size:.65rem;display:flex}.colorkey-toggle{color:var(--text-secondary);cursor:pointer;align-items:center;gap:8px;font-size:.8rem;display:flex}.colorkey-toggle input{accent-color:var(--accent)}.colorkey-result-preview{flex-direction:column;gap:6px;display:flex}.colorkey-result-img{background-image:var(--checkerboard);border:1px solid var(--border);border-radius:8px;overflow:hidden}.colorkey-result-img img{width:100%;display:block}.colorkey-error{color:#e63946;background:#e639461a;border-radius:8px;padding:10px;font-size:.8rem}@media (max-width:700px){.colorkey-layout{grid-template-columns:1fr}}.skeleton{background:linear-gradient(90deg,var(--bg-card)25%,var(--bg-card-hover)50%,var(--bg-card)75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s ease-in-out infinite shimmer}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.skeleton-text{background:linear-gradient(90deg,var(--bg-card)25%,var(--bg-card-hover)50%,var(--bg-card)75%);background-size:200% 100%;border-radius:6px;width:60%;height:12px;margin:0 auto;animation:1.5s ease-in-out infinite shimmer}.step-circle{letter-spacing:-.02em;font-size:.85rem;font-weight:600}.batch-preview-overlay{z-index:var(--z-modal-backdrop);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000d9;justify-content:center;align-items:center;padding:20px;animation:.2s fadeIn;display:flex;position:fixed;inset:0}.batch-preview-modal{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:800px;max-height:85vh;box-shadow:var(--shadow-lg);padding:28px;overflow-y:auto}.batch-preview-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin:16px 0 24px;display:grid}.batch-preview-item{border-radius:var(--radius-sm);border:2px solid var(--border);cursor:pointer;transition:var(--transition);opacity:.5;position:relative;overflow:hidden}.batch-preview-item.checked{border-color:var(--accent);opacity:1}.batch-preview-item:hover{border-color:var(--text-muted)}.batch-preview-item img{aspect-ratio:1;object-fit:cover;width:100%;display:block}.batch-preview-item-label{color:var(--text-secondary);text-align:center;white-space:nowrap;text-overflow:ellipsis;padding:4px 6px;font-size:.65rem;overflow:hidden}.batch-preview-check{background:var(--accent);color:#000;border-radius:4px;justify-content:center;align-items:center;width:18px;height:18px;font-size:.65rem;font-weight:700;display:flex;position:absolute;top:4px;right:4px}.upload-thumbnails-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;margin-bottom:16px;display:grid}.upload-thumbnail-card{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);flex-direction:column;display:flex;overflow:hidden}.upload-thumbnail-img{aspect-ratio:1;background:var(--bg-card);justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.upload-thumbnail-img img{object-fit:contain;max-width:100%;max-height:100%}.upload-thumbnail-info{flex-direction:column;gap:2px;padding:8px 10px 4px;display:flex}.upload-thumbnail-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:.75rem;overflow:hidden}.upload-thumbnail-size{color:var(--text-muted);font-size:.65rem}.upload-thumbnail-actions{flex-wrap:wrap;gap:4px;padding:4px 10px 8px;display:flex}.upload-add-more{cursor:pointer;min-height:160px;transition:var(--transition);background:0 0;border:2px dashed #ffffff1a;justify-content:center;align-items:center;display:flex}.upload-add-more:hover{border-color:var(--accent);background:var(--accent-glow)}.upload-add-more-content{color:var(--text-muted);flex-direction:column;align-items:center;gap:4px;font-size:.875rem;display:flex}.upload-bottom-bar{justify-content:space-between;align-items:center;gap:12px;padding:16px 0;display:flex}.upload-count{color:var(--text-secondary);font-size:.875rem}.upload-dropzone-mini{height:4px;transition:var(--transition);border-radius:2px}.upload-dropzone-mini.drag-active{border:2px dashed var(--accent);background:var(--accent-glow);border-radius:var(--radius-md);height:60px}.btn-danger-sm{color:#ef4444}.btn-danger-sm:hover{background:#ef44441a}.source-previews-row{flex-wrap:wrap;gap:12px;margin-bottom:8px;display:flex}.variation-group{margin-bottom:24px}.variation-group-header{background:var(--bg-secondary);border-radius:var(--radius-md);border:1px solid var(--border);align-items:center;gap:10px;margin-bottom:12px;padding:8px 12px;display:flex}.variation-group-thumb{object-fit:contain;border-radius:var(--radius-sm);background:var(--bg-card);width:40px;height:40px}.variation-group-header span{color:var(--text-primary);font-size:.875rem;font-weight:500}