.qr-tabs{flex-wrap:wrap;gap:.35rem;margin-bottom:1.5rem;display:flex}.qr-tab{color:#474849;cursor:pointer;white-space:nowrap;background:#fff;border:2px solid #e2e8f0;border-radius:8px;align-items:center;gap:.3rem;padding:.45rem .75rem;font-size:.76rem;font-weight:600;transition:all .2s;display:flex}.qr-tab:hover{background:#fff;border-color:#cbd5e1}.qr-tab.active{color:#553ffe;background:#f0ecff;border-color:#553ffe}.qr-layout{text-align:left;gap:2rem;display:flex}.qr-form-col{flex-direction:column;flex:55%;gap:1.25rem;display:flex}.qr-preview-col{flex-direction:column;flex:40%;align-items:center;gap:1.5rem;display:flex}.qr-field{flex-direction:column;gap:.5rem;display:flex}.qr-field label{color:#475569;font-size:.85rem;font-weight:600}.qr-field input,.qr-field select,.qr-field textarea{color:#0f172a;background:#fff;border:2px solid #e2e8f0;border-radius:10px;outline:none;padding:.7rem 1rem;font-family:inherit;font-size:.9rem;transition:border-color .2s}.qr-field input[type=checkbox]{accent-color:#553ffe;border:none;width:auto;padding:0}.qr-field input:focus,.qr-field select:focus,.qr-field textarea:focus{border-color:#553ffe}.qr-fields-row{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.qr-field-hint{margin-top:-.25rem}.qr-field-hint span{color:#94a3b8;font-size:.78rem;line-height:1.5}.qr-customize{background:#fff;border:1px solid #f1f5f9;border-radius:14px;padding:1.25rem}.qr-customize-title{color:#0f172a;align-items:center;gap:.5rem;margin-bottom:1rem;font-size:.95rem;font-weight:700;display:flex}.qr-design-tabs{background:#e2e8f0;border-radius:8px;gap:.25rem;margin-bottom:1.25rem;padding:3px;display:flex}.qr-design-tab{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;padding:.5rem;font-size:.8rem;font-weight:600;transition:all .2s}.qr-design-tab.active{color:#fff;background:linear-gradient(#897fff 0%,#4a3aff 100%);box-shadow:0 4px 12px #4a3aff33}.qr-panels-stack{display:grid}.qr-panels-stack>.qr-design-panel{grid-area:1/1}.qr-design-panel{animation:.2s fadeInPanel}.qr-panel-visible{visibility:visible;opacity:1;pointer-events:auto;z-index:1;position:relative}.qr-panel-hidden{visibility:hidden;opacity:0;pointer-events:none;z-index:0;position:relative}@keyframes fadeInPanel{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}.qr-color-row{gap:1.25rem;margin-bottom:1rem;display:flex}.qr-gradient-row{align-items:flex-end;gap:1.25rem;margin-bottom:1rem;display:flex}.qr-color-field{flex:1;align-items:center;gap:.5rem;display:flex}.qr-color-field label{color:#64748b;white-space:nowrap;font-size:.78rem;font-weight:600}.qr-color-input{cursor:pointer;background:0 0;border:2px solid #e2e8f0;border-radius:8px;flex-shrink:0;width:36px;height:36px;padding:2px}.qr-color-hex{border:1px solid #e2e8f0;border-radius:6px;outline:none;width:80px;padding:.45rem .6rem;font-family:monospace;font-size:.8rem}.qr-size-field{margin-bottom:.75rem}.qr-size-field label{color:#64748b;justify-content:space-between;margin-bottom:.4rem;font-size:.78rem;font-weight:600;display:flex}.qr-size-field input[type=range]{accent-color:#553ffe;width:100%}.qr-ec-row{gap:.4rem;display:flex}.qr-ec-btn{color:#64748b;cursor:pointer;background:#fff;border:1px solid #e2e8f0;border-radius:6px;flex:1;padding:.45rem;font-size:.78rem;font-weight:600;transition:all .2s}.qr-ec-btn.active{color:#fff;background:#553ffe;border-color:#553ffe}.qr-style-picker{gap:.4rem;display:flex}.qr-style-btn{color:#64748b;cursor:pointer;background:#fff;border:2px solid #e2e8f0;border-radius:8px;flex:1;padding:.55rem .5rem;font-size:.78rem;font-weight:600;transition:all .2s}.qr-style-btn:hover{border-color:#cbd5e1}.qr-style-btn.active{color:#553ffe;background:#f0ecff;border-color:#553ffe}.qr-logo-upload{min-height:120px}.qr-logo-dropzone{cursor:pointer;color:#64748b;background:#fff;border:2px dashed #d1d5db;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;padding:2rem;transition:all .2s;display:flex}.qr-logo-dropzone:hover{color:#553ffe;background:#faf5ff;border-color:#553ffe}.qr-logo-dropzone span{font-size:.85rem;font-weight:600}.qr-logo-hint{margin-top:.25rem;color:#94a3b8!important;font-size:.72rem!important;font-weight:400!important}.qr-logo-preview{background:#fff;border:2px solid #e2e8f0;border-radius:12px;align-items:center;gap:1rem;padding:1rem;display:flex;position:relative}.qr-logo-preview img{object-fit:cover;border:1px solid #f1f5f9;border-radius:8px;width:64px;height:64px}.qr-logo-remove{color:#fff;cursor:pointer;background:#ef4444;border:none;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;transition:background .2s;display:flex;position:absolute;top:8px;right:8px}.qr-logo-remove:hover{background:#dc2626}.qr-frame-grid{grid-template-columns:repeat(4,1fr);gap:.4rem;display:grid}.qr-frame-btn{color:#64748b;cursor:pointer;text-align:center;white-space:nowrap;background:#fff;border:2px solid #e2e8f0;border-radius:8px;padding:.55rem .4rem;font-size:.7rem;font-weight:600;transition:all .2s}.qr-frame-btn:hover{border-color:#cbd5e1}.qr-frame-btn.active{color:#553ffe;background:#f0ecff;border-color:#553ffe}.qr-preview-col{flex:0 0 280px;align-self:flex-start;max-width:280px;position:sticky;top:90px}.qr-preview-box{background:#fff;border:2px solid #f1f5f9;border-radius:16px;flex-direction:column;align-items:center;gap:1rem;width:100%;padding:1.25rem;display:flex}.qr-preview-box canvas,.qr-preview-box img{border-radius:8px;max-width:100%}.qr-placeholder{aspect-ratio:1;color:#cbd5e1;background:#fff;border-radius:12px;justify-content:center;align-items:center;width:100%;max-width:240px;display:flex}.qr-preview-controls{flex-direction:column;gap:.75rem;width:100%;display:flex}.qr-preview-field{flex-direction:column;gap:.35rem;display:flex}.qr-preview-field label{color:#64748b;font-size:.78rem;font-weight:600}.qr-preview-field select{color:#0f172a;cursor:pointer;background:#fff;border:2px solid #e2e8f0;border-radius:10px;outline:none;padding:.6rem .85rem;font-family:inherit;font-size:.85rem;transition:border-color .2s}.qr-preview-field select:focus{border-color:#553ffe}.qr-action-btn{cursor:pointer;border:none;border-radius:10px;justify-content:center;align-items:center;gap:.4rem;padding:.7rem;font-size:.85rem;font-weight:600;transition:all .2s;display:flex}.qr-action-full{width:100%}.qr-action-btn.primary{color:#fff;background:linear-gradient(#897fff 0%,#4a3aff 100%)}.qr-action-btn.primary:hover{opacity:.95}.qr-action-btn.secondary{color:#475569;background:#f1f5f9}.qr-action-btn.secondary:hover{background:#e2e8f0}.qr-action-btn:disabled{opacity:.5;cursor:not-allowed}@media (width<=768px){.qr-layout{flex-direction:column}.qr-preview-col{flex:100%;max-width:100%}.qr-fields-row{grid-template-columns:1fr}.qr-color-row,.qr-gradient-row{flex-direction:column;gap:.75rem}.qr-tabs{gap:.25rem}.qr-tab{gap:.2rem;padding:.4rem .55rem;font-size:.7rem}.qr-tab svg{display:none}.qr-preview-box{position:static}.qr-frame-grid{grid-template-columns:repeat(2,1fr)}.qr-style-picker{flex-wrap:wrap}}