.tool-wrapper[data-v-63978af0]{display:flex;flex-direction:column;gap:2rem}.mode-selector[data-v-63978af0]{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.mode-btn[data-v-63978af0]{background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:500;padding:.75rem 2rem;transition:all .3s ease}.mode-btn.active[data-v-63978af0]{background:linear-gradient(135deg,var(--primary-color) 0,var(--primary-color) 100%);color:#fff}.mode-btn.active[data-v-63978af0],.mode-btn[data-v-63978af0]:hover:not(.active){border-color:var(--primary-color)}.section-title[data-v-63978af0]{color:#333;font-size:1.1rem;font-weight:600;margin:0 0 1rem}.pattern-grid[data-v-63978af0]{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}.pattern-card[data-v-63978af0]{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;display:flex;flex-direction:column;gap:.5rem;padding:1rem;transition:all .3s ease}.pattern-card[data-v-63978af0]:hover{border-color:var(--primary-color);transform:translateY(-2px)}.pattern-card.active[data-v-63978af0]{background:#f0f4ff;border-color:var(--primary-color)}.pattern-preview[data-v-63978af0]{border:1px solid #e0e0e0;border-radius:4px;height:80px;width:80px}.pattern-name[data-v-63978af0]{color:#666;font-size:.875rem;font-weight:500}.config-section[data-v-63978af0]{background:#f9fafb;border-radius:8px;padding:1.5rem}.config-grid[data-v-63978af0]{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.config-item[data-v-63978af0]{display:flex;flex-direction:column;gap:.5rem}.config-item label[data-v-63978af0]{color:#666;font-size:.9rem;font-weight:500}.config-item input[type=color][data-v-63978af0]{border:2px solid #e0e0e0;border-radius:6px;cursor:pointer;height:40px;width:100%}.config-item input[type=range][data-v-63978af0]{width:100%}.config-item input[type=text][data-v-63978af0]{border:2px solid #e0e0e0;border-radius:6px;box-sizing:border-box;font-size:.9rem;padding:.5rem}.color-input[data-v-63978af0]{font-family:monospace}.value-display[data-v-63978af0]{color:#666;font-size:.875rem;text-align:center}.gradient-buttons[data-v-63978af0]{display:flex;flex-wrap:wrap;gap:1rem}.gradient-btn[data-v-63978af0]{background:#fff;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;font-size:.9rem;font-weight:500;padding:.75rem 1.5rem;text-transform:capitalize;transition:all .3s ease}.gradient-btn.active[data-v-63978af0]{background:var(--primary-color);color:#fff}.gradient-btn.active[data-v-63978af0],.gradient-btn[data-v-63978af0]:hover:not(.active){border-color:var(--primary-color)}.gradient-colors[data-v-63978af0]{display:flex;flex-direction:column;gap:1rem;margin-bottom:1.5rem}.color-item[data-v-63978af0]{align-items:center;display:flex;gap:.5rem}.color-item input[type=color][data-v-63978af0]{border:2px solid #e0e0e0;border-radius:6px;cursor:pointer;height:40px;width:60px}.color-item .color-input[data-v-63978af0]{box-sizing:border-box;flex:1}.remove-btn[data-v-63978af0]{background:#fee;border:none;border-radius:50%;color:#c33;cursor:pointer;font-size:1.2rem;height:32px;transition:all .3s ease;width:32px}.remove-btn[data-v-63978af0]:hover{background:#fcc}.add-color-btn[data-v-63978af0]{background:#fff;border:2px dashed var(--primary-color);border-radius:6px;color:var(--primary-color);cursor:pointer;font-size:.9rem;padding:.5rem 1rem;transition:all .3s ease}.add-color-btn[data-v-63978af0]:hover{background:#f0f4ff}.stops-container[data-v-63978af0]{display:flex;flex-direction:column;gap:.5rem}.stop-item[data-v-63978af0]{align-items:center;display:flex;gap:.5rem}.stop-item input[type=range][data-v-63978af0]{flex:1}.preview-section[data-v-63978af0]{display:flex;flex-direction:column;gap:1rem}.preview-container[data-v-63978af0]{background:#fff;border:2px solid #e0e0e0;border-radius:8px;overflow:hidden;width:100%}.preview-box[data-v-63978af0]{height:400px;transition:all .3s ease;width:100%}.preview-actions[data-v-63978af0]{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center}.css-section[data-v-63978af0]{display:flex;flex-direction:column;gap:.75rem}.section-header[data-v-63978af0]{align-items:center;display:flex;justify-content:space-between}.css-textarea[data-v-63978af0]{background:#f5f7fa;border:2px solid #e0e0e0;border-radius:8px;box-sizing:border-box;font-family:Courier New,monospace;font-size:.9rem;padding:1rem;resize:vertical;width:100%}.btn[data-v-63978af0]{border:none;border-radius:8px;cursor:pointer;font-size:1rem;font-weight:500;padding:.75rem 2rem;transition:all .3s ease}.btn-sm[data-v-63978af0]{font-size:.875rem;padding:.5rem 1rem}.btn-primary[data-v-63978af0]{background:linear-gradient(135deg,var(--primary-color) 0,var(--primary-color) 100%);color:#fff}.btn-primary[data-v-63978af0]:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.btn-secondary[data-v-63978af0]{background:#e0e0e0;color:#333}.btn-secondary[data-v-63978af0]:hover{background:#d0d0d0}@media(max-width:768px){.tool-wrapper[data-v-63978af0]{gap:1.5rem}.pattern-grid[data-v-63978af0]{grid-template-columns:repeat(2,1fr)}.config-grid[data-v-63978af0]{grid-template-columns:1fr}.preview-box[data-v-63978af0]{height:300px}.preview-actions[data-v-63978af0]{flex-direction:column}.btn[data-v-63978af0]{width:100%}}