@media(max-width:640px){body{font-size:14px}}@media(max-width:640px){#root{padding:1rem}}@media(max-width:768px){#root{padding:1.5rem}}@media(max-width:640px){.wizard-container{padding:1rem}}@media(max-width:640px){.wizard-header h1{font-size:1.5rem}.wizard-header p{font-size:.875rem}}@media(max-width:640px){.form-field{margin-bottom:1rem}}.grid-2-cols{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}@media(max-width:768px){.grid-2-cols{grid-template-columns:1fr;gap:1rem}}@media(max-width:640px){.image-upload-field .image-preview-container{width:100%;max-width:200px}}@media(max-width:640px){.image-upload-field .upload-zone{padding:1.5rem}}@media(max-width:640px){.wizard-navigation{flex-direction:column;gap:.75rem}.wizard-navigation button{width:100%}}@media(max-width:768px){.preview-mockup .mockup-content{flex-direction:column!important;height:auto!important}.preview-mockup .hero-column{min-height:250px}.preview-mockup .form-column{padding:2rem!important}}@media(max-width:640px){.preview-mockup .hero-column{min-height:200px}.preview-mockup .form-column{padding:1.5rem!important}}.wizard-layout{max-width:800px;margin:0 auto;padding:3rem 1.5rem;display:flex;flex-direction:column;gap:3rem;min-height:80vh;justify-content:center}.wizard-layout .wizard-header{text-align:center}.wizard-layout .wizard-header h1{font-size:2.5rem;color:#1e293b;margin-bottom:.5rem;font-weight:700}.wizard-layout .wizard-header p{color:#64748b;font-size:1.1rem}.wizard-layout .wizard-content{background:#fff;padding:3rem;border-radius:12px;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;display:flex;flex-direction:column;gap:2rem}.progress-container{position:fixed;top:0;left:0;width:100%;height:6px;background:#e2e8f0;z-index:100}.progress-container .progress-bar{height:100%;background:linear-gradient(90deg,#6366f1,#ec4899);transition:width .5s ease}.wizard-navigation{display:flex;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:2rem;border-top:1px solid #e2e8f0}.wizard-navigation button{display:flex;align-items:center;gap:.5rem}.wizard-navigation button.btn-primary{background:#6366f1;color:#fff}.wizard-navigation button.btn-primary:hover{background:#4f46e5}.wizard-navigation button.btn-primary:disabled{opacity:.5;cursor:not-allowed}.wizard-navigation button.btn-secondary{background:transparent;color:#64748b}.wizard-navigation button.btn-secondary:hover{color:#1e293b;background:#e2e8f0}.wizard-navigation button.btn-finish{background:#22c55e}.wizard-navigation button.btn-finish:hover{filter:brightness(.9)}.form-field,.color-field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}.form-field .field-label,.color-field .field-label{display:flex;flex-direction:column;gap:4px}.form-field .field-label .label-text,.color-field .field-label .label-text{font-weight:600;color:#1e293b}.form-field .field-label .label-text .required-indicator,.color-field .field-label .label-text .required-indicator{color:#ef4444}.form-field .field-label .label-sub,.color-field .field-label .label-sub{font-size:.875rem;color:#64748b}.form-field .input-wrapper,.color-field .input-wrapper{position:relative;display:flex;align-items:center}.form-field .text-input,.color-field .text-input,.color-field .color-input-wrapper .color-hex-input{width:100%;padding:1rem 2.5rem 1rem 1rem;border:1px solid #e2e8f0;border-radius:8px;font-size:1rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.form-field .text-input:focus,.color-field .text-input:focus,.color-field .color-input-wrapper .color-hex-input:focus{border-color:#6366f1;outline:none;box-shadow:0 0 0 3px #6366f11a}.form-field .text-input.error,.color-field .text-input.error,.color-field .color-input-wrapper .error.color-hex-input{border-color:#ef4444}.form-field .text-input.error:focus,.color-field .text-input.error:focus,.color-field .color-input-wrapper .error.color-hex-input:focus{box-shadow:0 0 0 3px #ef44441a}.form-field .text-input.valid,.color-field .text-input.valid,.color-field .color-input-wrapper .valid.color-hex-input{border-color:#22c55e}.form-field .text-input.valid:focus,.color-field .text-input.valid:focus,.color-field .color-input-wrapper .valid.color-hex-input:focus{box-shadow:0 0 0 3px #22c55e1a}.form-field .input-icon,.color-field .input-icon{position:absolute;right:12px;pointer-events:none}.form-field .input-icon.success-icon,.color-field .input-icon.success-icon{color:#22c55e}.form-field .input-icon.error-icon,.color-field .input-icon.error-icon{color:#ef4444}.form-field .character-count,.color-field .character-count{font-size:.75rem;color:#64748b;text-align:right;margin-top:4px}.color-field .color-input-wrapper{display:flex;align-items:center;gap:1rem}.color-field .color-input-wrapper .color-preview{width:40px;height:40px;border-radius:8px;border:1px solid #e2e8f0;flex-shrink:0}.color-field .color-input-wrapper .color-hex-input{width:120px;font-family:monospace}.color-field .color-input-wrapper .color-piker-native{width:40px;height:40px;padding:0;border:0;background:none;cursor:pointer}.image-upload-field .upload-zone{position:relative;border:2px dashed #e2e8f0;border-radius:12px;padding:3rem;text-align:center;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;background:#f8fafc}.image-upload-field .upload-zone:hover{border-color:#6366f1;background:#6366f105}.image-upload-field .upload-zone.dragging{border-color:#6366f1;background:#6366f114;border-style:solid}.image-upload-field .upload-zone.error{border-color:#ef4444;background:#ef444405}.image-upload-field .upload-zone.disabled{opacity:.6;cursor:not-allowed;border-style:solid;background:#f1f5f9}.image-upload-field .upload-zone.disabled:hover{border-color:#e2e8f0}.image-upload-field .upload-zone .file-input-hidden{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.image-upload-field .upload-zone .upload-placeholder{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#64748b}.image-upload-field .upload-zone .upload-placeholder .upload-icon{color:#6366f1}.image-upload-field .upload-zone .upload-placeholder .upload-hint{font-size:.75rem;color:#94a3b8;margin-top:-4px}.image-upload-field .upload-zone .upload-placeholder .spinner{width:24px;height:24px;border:3px solid rgba(99,102,241,.2);border-top-color:#6366f1;border-radius:50%;animation:spin .8s linear infinite}.image-upload-field .field-error{display:flex;align-items:center;gap:6px;color:#ef4444;font-size:.875rem;margin-top:4px;animation:shake .3s ease-in-out}.image-upload-field .skip-option{margin-top:.5rem;display:flex;align-items:center;gap:.5rem}.image-upload-field .skip-option input[type=checkbox]{width:auto;cursor:pointer}.image-upload-field .skip-option label{font-size:.9rem;color:#64748b;cursor:pointer;-webkit-user-select:none;user-select:none}.image-upload-field .image-preview-container{position:relative;width:200px;height:120px;overflow:hidden;border-radius:12px;border:1px solid #e2e8f0}.image-upload-field .image-preview-container .image-preview{width:100%;height:100%;object-fit:cover}.image-upload-field .image-preview-container .file-name{position:absolute;bottom:0;left:0;right:0;background:#000000b3;color:#fff;padding:4px 8px;font-size:.75rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.image-upload-field .image-preview-container .remove-image-btn{position:absolute;top:8px;right:8px;background:#0009;color:#fff;border:none;border-radius:50%;width:28px;height:28px;display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.image-upload-field .image-preview-container .remove-image-btn:hover{background:#000c}.toggle-card{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;border:1px solid #e2e8f0;border-radius:12px;cursor:pointer;background:#fff;transition:all .3s cubic-bezier(.4,0,.2,1)}.toggle-card:hover{border-color:#6366f1;transform:translateY(-2px);box-shadow:0 1px 3px #0000001a}.toggle-card.selected{border-color:#6366f1;background:#6366f10a;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.toggle-card.selected .card-check{color:#6366f1}.toggle-card .card-content{display:flex;align-items:center;gap:1.5rem}.toggle-card .card-content .card-icon{color:#64748b}.toggle-card .card-content .card-text h3{margin:0;font-size:1.1rem;font-weight:600}.toggle-card .card-content .card-text p{margin:4px 0 0;color:#64748b;font-size:.9rem}:root{font-family:Inter,system-ui,-apple-system,sans-serif;line-height:1.5;font-weight:400;color:#1e293b;background-color:#f8fafc;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#root{width:100%;margin:0 auto;text-align:center}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#fff;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}button:hover{border-color:#6366f1}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}*{box-sizing:border-box}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-4px)}75%{transform:translate(4px)}}.tooltip-container{position:relative;display:inline-flex;align-items:center;cursor:help}.tooltip-container .tooltip-icon{color:#64748b;transition:color .2s ease}.tooltip-container .tooltip-icon:hover{color:#6366f1}.tooltip-container .tooltip-content{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);background:#1e293b;color:#fff;padding:8px 12px;border-radius:8px;font-size:.875rem;white-space:nowrap;max-width:250px;white-space:normal;text-align:center;box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d;z-index:1000;animation:tooltipFadeIn .2s ease}.tooltip-container .tooltip-content:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border:6px solid transparent;border-top-color:#1e293b}@keyframes tooltipFadeIn{0%{opacity:0;transform:translate(-50%) translateY(-4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}