.switcher-wrapper{display:flex;align-items:center;gap:10px;width:200px;margin:0 auto;margin-bottom:1rem}.switcher-wrapper p{margin:0;padding:0}.switcher-wrapper .switch{position:relative;display:inline-block;width:60px;height:34px}.switcher-wrapper .switch input{opacity:0;width:0;height:0}.switcher-wrapper .switch input:hover+.slider{background-color:#987dba}.switcher-wrapper .switch input:checked+.slider{background-color:#8e008b}.switcher-wrapper .switch input:focus+.slider{box-shadow:0 0 1px #2196f3}.switcher-wrapper .switch input:checked+.slider:before{-webkit-transform:translateX(26px);-ms-transform:translateX(26px);transform:translate(26px)}.switcher-wrapper .switch .slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;-webkit-transition:.4s;transition:.4s}.switcher-wrapper .switch .slider:before{position:absolute;content:"";height:26px;width:26px;left:4px;bottom:4px;background-color:#fff;-webkit-transition:.4s;transition:.4s}.switcher-wrapper .switch .slider.round{border-radius:34px}.switcher-wrapper .switch .slider.round:before{border-radius:50%}.border-radius-sample-shapes{width:550px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr);gap:30px}.shape{width:100px;height:100px;background:linear-gradient(135deg,#f093fb,#f5576c);transition:transform .2s ease;cursor:pointer}.shape:hover{transform:scale(1.1)}.s1{border-radius:50%}.s2{border-radius:70% 30%/30% 70%}.s3{border-radius:60% 40%/40% 60%}.s4{border-radius:80% 20%/60% 40%}.s5{border-radius:20% 80%}.s6{border-radius:90% 10%/10% 90%}.s7{border-radius:10% 90%/90% 10%}.s8{border-radius:40% 60%/70% 30%}.s9{border-radius:30% 70%/60% 40%}.s10{border-radius:25% 75%}.s11{border-radius:50% 50% 0 0}.s12{border-radius:0 0 50% 50%}.s13{border-radius:0 50% 50% 0}.s14{border-radius:50% 0 0 50%}.s15{border-radius:50% 50% 50% 0}.s16{border-radius:50% 0}.s17{border-radius:0 50%}.s18{border-radius:60% 40%/40% 60%}.s19{border-radius:10% 40% 90%/60% 10% 40% 90%}.s20{border-radius:40% 40% 80% 80%/60% 60% 20% 20%}.s21{border-radius:50% 10% 10% 50%/40% 80% 20% 60%}.s22{border-radius:60% 20% 40% 80%/70% 30% 60% 40%}.s23{border-radius:100% 0 0}.s24{border-radius:0 100% 0 0}.s25{border-radius:0 0 100%}.s26{border-radius:0 0 0 100%}.s27{border-radius:20% 40% 60% 80%/80% 60% 40% 20%}.s28{border-radius:75% 25% 25% 75%/60% 60% 40% 40%}.s29{border-radius:30% 50% 70% 90%/90% 70% 50% 30%}.s30{border-radius:20% 60% 40% 80%/80% 40% 60% 20%}.s31{border-radius:60% 10% 30% 50%/50% 30% 10% 60%}.s32{border-radius:0 100% 100% 0}.s33{border-radius:100% 0 0 100%}.s34{border-radius:40% 40% 0 0}.s35{border-radius:0 0 40% 40%}.s36{border-radius:100% 100% 0 0}.s37{border-radius:0 0 100% 100%}.s38{border-radius:40% 0/0 40%}.s39{border-radius:80% 0 0 80%/20% 50% 50% 20%}.s40{border-radius:10% 90%/90% 10%}.s41{border-radius:0 100%/100% 0}.s42{border-radius:25% 25% 75% 75%/50%}.s43{border-radius:60% 30% 20% 50%/20% 40% 60% 80%}.s44{border-radius:40% 60%/60% 40%}.s45{border-radius:20% 80%/80% 20%}.s46{border-radius:90% 10%/10% 90%}.s47{border-radius:0 90% 90% 0/0 50% 50% 0}.s48{border-radius:80% 50% 30% 10%/10% 30% 50% 80%}.s49{border-radius:40% 70%/50% 90%}.s50{border-radius:50%/60% 60% 40% 40%}body .border-radius-block-wrapper{position:relative;width:454px;padding:0 3rem;margin:0 auto;margin-bottom:4rem}body .border-radius-block-wrapper .handle{position:absolute;width:20px;height:20px;border-radius:50%;background:#987dba;cursor:pointer;transition:background .3s ease,box-shadow .3s ease}body .border-radius-block-wrapper .handle:hover{background:#fff;box-shadow:0 0 0 6px #987dba}body .border-radius-block-wrapper .handle.top-left-top-right{top:-9px;margin-left:-11px}body .border-radius-block-wrapper .handle.top-right-bottom-right{right:-9px;margin-top:-9px}body .border-radius-block-wrapper .handle.bottom-right-bottom-left{bottom:0;margin-bottom:-9px;margin-right:-9px}body .border-radius-block-wrapper .handle.bottom-right-top-left{left:-10px;margin-bottom:-9px}body .border-radius-block-wrapper .border-radius-input{position:absolute;width:30px;height:30px;border:1px solid #ddd;text-align:center}body .border-radius-block-wrapper .border-radius-input.top-left{top:0;left:0}body .border-radius-block-wrapper .border-radius-input.top-right{top:0;right:0}body .border-radius-block-wrapper .border-radius-input.bottom-right{bottom:0;right:0}body .border-radius-block-wrapper .border-radius-input.bottom-left{bottom:0;left:0}body .border-radius-canvas{position:relative;width:100%;height:454px;margin:0 auto 20px}body .border-radius-canvas div.main{box-sizing:border-box;height:100%;background:#fff;border:2px dashed #8d99ae;padding:2rem}body .border-radius-canvas div.main .border-radius-preview{border:1px solid #8d99ae;width:50vmin;height:50vmin}body .border-radius-result{width:550px;margin:0 auto}body .border-radius-result fieldset{justify-content:center;align-items:center;display:flex;border:0;padding:0;margin:0 0 3rem}body .border-radius-result fieldset textarea{flex:1;box-sizing:border-box;resize:none;display:block;margin:0 auto;padding:0;height:50px;text-indent:10px;font-size:14px;line-height:50px;border:0;border-radius:5px 0 0 5px}body .border-radius-result fieldset textarea:active{border:none}body .border-radius-result fieldset button{flex-shrink:0;cursor:pointer;height:50px;border:0;border-radius:0 5px 5px 0;background:#8e008b;color:#fff;text-transform:uppercase;font-size:20px;padding:0 20px}body .border-radius-result fieldset button:hover{background:#987dba}body .border-radius-result .copy-popup{font-size:18px;background:#8e008b;color:#fff;border-radius:5px;opacity:70%;padding:30px;box-sizing:border-box;z-index:9}body .border-radius-result.tailwind fieldset textarea{line-height:16px;text-indent:0;padding:10px}body .generate-random{width:300px;margin:0 auto;font-weight:600;text-transform:uppercase;border:1px solid #8e008b;color:#8e008b;text-align:center;padding:1rem 0}body.extended .border-radius-canvas div.main{background:linear-gradient(135deg,#f093fb,#f5576c)}