@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)}}@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,#49b4a8,#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:#49b4a8;color:#fff}.wizard-navigation button.btn-primary:hover{background:#3c9e93}.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:#49b4a8}.wizard-navigation button.btn-finish:hover{filter:brightness(.9)}.form-field,.color-field{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem;align-items:flex-start}.form-field .field-label,.color-field .field-label{display:flex;flex-direction:column;gap:4px;font-weight:600}.form-field .field-label .label-text,.color-field .field-label .label-text{font-weight:600;color:#1e293b;text-align:left}.form-field .field-label .label-text .required-indicator,.color-field .field-label .label-text .required-indicator{color:#ef4444}.form-field .field-label .field-sublabel,.color-field .field-label .field-sublabel{font-weight:400;font-size:.875rem;color:#64748b}.form-field .field-label .label-sub,.color-field .field-label .label-sub{font-size:.875rem;color:#64748b}.form-field .label-left,.color-field .label-left{align-items:flex-start;font-weight:600}.form-field .input-wrapper,.color-field .input-wrapper{position:relative;display:flex;align-items:center;width:100%}.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:#49b4a8;outline:none;box-shadow:0 0 0 3px #49b4a81a}.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{align-items:flex-start}.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:260px;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{align-items:center}.image-upload-field .label-text{font-weight:600;color:#1e293b;text-align:center!important}.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;width:100%}.image-upload-field .upload-zone:hover{border-color:#49b4a8;background:#49b4a805}.image-upload-field .upload-zone.dragging{border-color:#49b4a8;background:#49b4a814;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:#49b4a8}.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(73,180,168,.2);border-top-color:#49b4a8;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;display:flex;align-items:center;background:#ddd}.image-upload-field .image-preview-container .image-preview{width:100%}.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}.card-text{text-align:left}.toggle-card{display:flex;align-items:center;justify-content:space-between;padding:1.5rem;border:1px solid #e2e8f0;border-radius:12px;margin-bottom:1rem;cursor:pointer;background:#fff;transition:all .3s cubic-bezier(.4,0,.2,1)}.toggle-card:hover{border-color:#49b4a8;transform:translateY(-2px);box-shadow:0 1px 3px #0000001a}.toggle-card.selected{border-color:#49b4a8;background:#49b4a80a;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.toggle-card.selected .card-check{color:#49b4a8}.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}.basicInfo{text-align:left;width:100%}.basicInfo .form-field,.basicInfo .color-field{align-items:self-start}.question-block{display:flex;flex-direction:column;gap:12px}.question-title{font-weight:500}.radio-group{display:flex;gap:24px;margin:1rem 0}.radio-option{display:flex;align-items:center;gap:8px;cursor:pointer}.radio-option input{display:none}.radio-custom{width:18px;height:18px;border:2px solid #9ca3af;border-radius:50%;position:relative}.radio-option input:checked+.radio-custom{border-color:#49b4a8}.radio-option input:checked+.radio-custom:after{content:"";width:10px;height:10px;background:#49b4a8;border-radius:50%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.radio-label{font-size:14px}textarea{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)}.nmb{margin-bottom:0}: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:#49b4a8}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}*{box-sizing:border-box}