.app-header{display:flex;align-items:center;justify-content:space-between;height:40px;width:100%;padding:8px;background-color:var(--background1);font-weight:700;color:var(--text1)}.app-header .app-header-name{display:flex;align-items:center}.app-header .app-header-name img{width:24px;height:24px;margin-right:8px}.app-header .close{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:2px;background-color:transparent}.app-header .close svg{display:block;width:16px;height:16px}.app-header .close:hover{background-color:var(--background2);color:var(--text1)}.preview{width:100%;height:262px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.preview .box-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden;width:100%;height:100%;padding-bottom:32px}.preview .box{width:124px;height:124px;border-radius:8px}.preview .color-picker-container{position:absolute;bottom:auto;top:0;right:100%;z-index:11;padding-right:4px}.preview .preview-footer{position:absolute;top:254px;left:0;width:100%;padding:0 16px 16px;display:flex;align-items:center;justify-content:space-between}.preview .preview-footer .preview-colors{display:flex}.preview .preview-footer .color-inner{width:32px;height:32px;border:1px solid rgba(0,0,0,.2);box-shadow:0 8px 8px -4px #00000040,0 4px 4px -2px #00000040,inset 0 0 0 1px #fff;border-radius:32px;cursor:pointer}.preview .preview-footer .color{position:relative;z-index:2}.preview .preview-footer .color+.color{margin-left:-16px;z-index:1}.preview .preview-footer .color.active{z-index:20}.preview .presets-trigger{display:flex;align-items:center;padding:4px 12px 4px 8px;background-color:var(--background1);border:none;border-radius:32px;color:var(--text1);line-height:1;font-weight:var(--font-weight-medium);cursor:pointer}.preview .presets-trigger:hover{background-color:var(--background2)}.preview .presets-trigger svg{display:block;width:16px;height:16px;margin-right:4px}.slider-target,.slider-target *{-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing:border-box;touch-action:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.slider-target{position:relative}.slider-base,.slider-connects{height:100%;position:relative;width:100%;z-index:1}.slider-connects{overflow:hidden;z-index:0}.slider-connect,.slider-origin{height:100%;position:absolute;right:0;top:0;-ms-transform-origin:0 0;-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform-style:preserve-3d;transform-style:flat;width:100%;will-change:transform;z-index:1}.slider-txt-dir-rtl.slider-horizontal .slider-origin{left:0;right:auto}.slider-vertical .slider-origin{top:-100%;width:0}.slider-horizontal .slider-origin{height:0}.slider-handle{-webkit-backface-visibility:hidden;backface-visibility:hidden;position:absolute}.slider-touch-area{height:100%;width:100%}.slider-state-tap .slider-connect,.slider-state-tap .slider-origin{transition:transform .3s}.slider-state-drag *{cursor:inherit!important}.slider-tooltip-drag .slider-tooltip,.slider-tooltip-focus .slider-tooltip{display:none!important}.slider-tooltip-drag .slider-active .slider-tooltip,.slider-tooltip-drag.slider-state-drag .slider-tooltip:not(.slider-tooltip-hidden),.slider-tooltip-focus.slider-focused .slider-tooltip:not(.slider-tooltip-hidden){display:block!important}.slider-horizontal{height:var(--slider-height,6px)}.slider-horizontal .slider-handle{height:var(--slider-handle-height,16px);right:calc(var(--slider-handle-width, 16px)/2*-1);top:calc((var(--slider-handle-height, 16px) - var(--slider-height, 6px))/2*-1 + -1px);width:var(--slider-handle-width,16px)}.slider-vertical{height:var(--slider-vertical-height,300px);width:var(--slider-height,6px)}.slider-vertical .slider-handle{bottom:calc(var(--slider-handle-width, 16px)/2*-1);height:var(--slider-handle-width,16px);right:calc((var(--slider-handle-height, 16px) - var(--slider-height, 6px))/2*-1 + -1px);width:var(--slider-handle-height,16px)}.slider-txt-dir-rtl.slider-horizontal .slider-handle{left:calc(var(--slider-handle-width, 16px)/2*-1);right:auto}.slider-base{background-color:var(--slider-bg,#d1d5db)}.slider-base,.slider-connects{border-radius:var(--slider-radius,9999px)}.slider-connect{background:var(--slider-connect-bg,#10b981);cursor:pointer}.slider-draggable{cursor:ew-resize}.slider-vertical .slider-draggable{cursor:ns-resize}.slider-handle{background:var(--slider-handle-bg,#fff);border:var(--slider-handle-border,0);border-radius:var(--slider-handle-radius,9999px);box-shadow:var(--slider-handle-shadow,.5px .5px 2px 1px rgba(0,0,0,.32));cursor:-webkit-grab;cursor:grab;height:var(--slider-handle-height,16px);width:var(--slider-handle-width,16px)}.slider-handle:focus{box-shadow:0 0 0 var(--slider-handle-ring-width,3px) var(--slider-handle-ring-color,rgba(16,185,129,.188)),var(--slider-handle-shadow,.5px .5px 2px 1px rgba(0,0,0,.32));outline:none}.slider-active{box-shadow:var(--slider-handle-shadow-active,.5px .5px 2px 1px rgba(0,0,0,.42));cursor:-webkit-grabbing;cursor:grabbing}[disabled] .slider-connect{background:var(--slider-connect-bg-disabled,#9ca3af)}[disabled] .slider-handle,[disabled].slider-handle,[disabled].slider-target{cursor:not-allowed}[disabled] .slider-tooltip{background:var(--slider-tooltip-bg-disabled,#9ca3af);border-color:var(--slider-tooltip-bg-disabled,#9ca3af)}.slider-tooltip{background:var(--slider-tooltip-bg,#10b981);border:1px solid var(--slider-tooltip-bg,#10b981);border-radius:var(--slider-tooltip-radius,5px);color:var(--slider-tooltip-color,#fff);display:block;font-size:var(--slider-tooltip-font-size,.875rem);font-weight:var(--slider-tooltip-font-weight,600);line-height:var(--slider-tooltip-line-height,1.25rem);min-width:var(--slider-tooltip-min-width,20px);padding:var(--slider-tooltip-py,2px) var(--slider-tooltip-px,6px);position:absolute;text-align:center;white-space:nowrap}.slider-horizontal .slider-tooltip-top{bottom:calc(var(--slider-handle-height, 16px) + var(--slider-tooltip-arrow-size, 5px) + var(--slider-tooltip-distance, 3px));left:50%;transform:translate(-50%)}.slider-horizontal .slider-tooltip-top:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-top-color:inherit;bottom:calc(var(--slider-tooltip-arrow-size, 5px)*-2);content:"";height:0;left:50%;position:absolute;transform:translate(-50%);width:0}.slider-horizontal .slider-tooltip-bottom{left:50%;top:calc(var(--slider-handle-height, 16px) + var(--slider-tooltip-arrow-size, 5px) + var(--slider-tooltip-distance, 3px));transform:translate(-50%)}.slider-horizontal .slider-tooltip-bottom:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-bottom-color:inherit;content:"";height:0;left:50%;position:absolute;top:calc(var(--slider-tooltip-arrow-size, 5px)*-2);transform:translate(-50%);width:0}.slider-vertical .slider-tooltip-left{right:calc(var(--slider-handle-height, 16px) + var(--slider-tooltip-arrow-size, 5px) + var(--slider-tooltip-distance, 3px));top:50%;transform:translateY(-50%)}.slider-vertical .slider-tooltip-left:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-left-color:inherit;content:"";height:0;position:absolute;right:calc(var(--slider-tooltip-arrow-size, 5px)*-2);top:50%;transform:translateY(-50%);width:0}.slider-vertical .slider-tooltip-right{left:calc(var(--slider-handle-height, 16px) + var(--slider-tooltip-arrow-size, 5px) + var(--slider-tooltip-distance, 3px));top:50%;transform:translateY(-50%)}.slider-vertical .slider-tooltip-right:before{border:var(--slider-tooltip-arrow-size,5px) solid transparent;border-right-color:inherit;content:"";height:0;left:calc(var(--slider-tooltip-arrow-size, 5px)*-2);position:absolute;top:50%;transform:translateY(-50%);width:0}.slider-horizontal .slider-origin>.slider-tooltip{left:auto;transform:translate(50%)}.slider-horizontal .slider-origin>.slider-tooltip-top{bottom:calc(var(--slider-tooltip-arrow-size, 5px) + (var(--slider-handle-height, 16px) - var(--slider-height, 6px))/2 + var(--slider-tooltip-distance, 3px) + 1px)}.slider-horizontal .slider-origin>.slider-tooltip-bottom{top:calc(var(--slider-tooltip-arrow-size, 5px) + (var(--slider-handle-height, 16px) - var(--slider-height, 6px))/2 + var(--slider-tooltip-distance, 3px) + var(--slider-height, 6px) - 1px)}.slider-vertical .slider-origin>.slider-tooltip{top:auto;transform:translateY(calc((var(--slider-tooltip-line-height, 1.25rem) - var(--slider-tooltip-py, 2px))*-1 + 1px))}.slider-vertical .slider-origin>.slider-tooltip-left{right:calc(var(--slider-tooltip-arrow-size, 5px) + var(--slider-height, 6px) + (var(--slider-handle-height, 16px) - var(--slider-height, 6px))/2 + var(--slider-tooltip-distance, 3px) - 1px)}.slider-vertical .slider-origin>.slider-tooltip-right{left:calc(var(--slider-tooltip-arrow-size, 5px) + var(--slider-height, 6px) + (var(--slider-handle-height, 16px) - var(--slider-height, 6px))/2 + var(--slider-tooltip-distance, 3px) - var(--slider-height, 6px) + 1px)}.control-group,.control-input-wrapper{display:flex;align-items:center;justify-content:space-between;border-radius:var(--border-radius)}.control-group{width:100%;color:var(--text1);font-weight:var(--font-weight-medium);font-size:var(--font-size-small)}.control-group .control{width:100%;display:flex;align-items:center}.control-group .control-slider{width:100%;margin:0 8px 0 24px}.control-group label{width:100%;max-width:80px}.control-group .control-input{width:100%;max-width:64px;border:none;background-color:transparent;color:var(--text1);padding:4px 8px;--webkit-appearance: none}.control-group .control-input:focus{outline:none}.control-group .control-input::-webkit-outer-spin-button,.control-group .control-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.control-group .control-input[type=number]{-moz-appearance:textfield}.control-input-wrapper{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:64px;background-color:var(--background4);color:var(--text4);border:1px solid var(--border3)}.control-input-wrapper.active{box-shadow:0 0 0 1px var(--blueBorder)}.control-input-wrapper .suffix{display:block;font-size:10px;text-transform:uppercase;color:var(--textInactive);padding-right:4px}.control.color{position:relative;z-index:10;width:100%;display:flex;justify-content:flex-end}.control.color.active{z-index:20}.control.color.active .color-trigger{box-shadow:0 0 0 1px var(--blueBorder)}.control.color .color-control{position:relative}.control.color .color-trigger{width:64px;height:28px;border-radius:var(--border-radius);border:1px solid var(--border3);cursor:pointer}.control.color .color-picker-container{position:absolute;bottom:100%;right:0;z-index:1;padding-bottom:4px}.presets-modal{width:100%;max-height:100%;display:flex;flex-direction:column;background-color:var(--background1);overflow:hidden;border-radius:4px;box-shadow:0 40px 80px -40px #000,0 24px 40px -24px #00000040,0 16px 24px -16px #00000040,0 4px 8px -4px #00000040}.presets-modal header{display:flex;flex-shrink:0;align-items:center;justify-content:space-between;padding:8px;line-height:1.1;font-weight:600;font-size:var(--font-size-large);color:var(--text1);border-bottom:1px solid var(--border1)}.presets-modal header .close{padding:0;margin:0;background-color:transparent;border:none;outline:none;cursor:pointer;color:var(--text3)}.presets-modal header .close svg{width:16px;height:16px}.presets-modal header .close:hover{color:var(--text1)}.presets-modal .presets-list{height:100%;margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:1px;overflow:auto}.presets-modal .presets-list li{position:relative;z-index:1;width:100%;padding-bottom:100%}.presets-modal .presets-list li:hover{z-index:2}.presets-modal .presets-list li:hover .preset-item{box-shadow:0 0 0 1px var(--blueBorder),inset 0 0 0 1px var(--blueBorder)}.presets-modal .presets-list .preset-item{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:24px 8px 8px;overflow:hidden;cursor:pointer;box-shadow:0 0 0 1px var(--border2)}.presets-modal .presets-list .preset-item .box-preview{width:124px;height:124px;margin:-32px 0;flex-shrink:0;border-radius:8px;transform:scale(.5)}.presets-modal .presets-list .preset-item .preset-label{position:relative;z-index:1;text-align:center;font-family:var(--font-stack);font-weight:700;font-size:var(--font-size-small);letter-spacing:-.04em;color:#00000080}.presets-modal .presets-list .preset-item.dark .preset-label{color:#ffffffb3}.app-wrapper{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;width:320px;height:500px;overflow:hidden;background-color:var(--background1)}.app-wrapper .controls{width:100%;flex-grow:1;display:grid;grid-template-columns:1fr;gap:8px;padding:16px}.app-wrapper .presets-modal-wrapper{display:flex;align-items:center;justify-content:center;padding:24px;position:absolute;top:0;left:0;right:0;bottom:0;z-index:30}.app-wrapper .presets-modal-wrapper .presets-modal-backdrop{position:absolute;top:0;left:0;width:100%;height:100%;z-index:0;background-color:var(--background5);opacity:.5;transition:opacity ease-in-out .5s;transition-delay:1s}.app-wrapper .presets-modal-wrapper .presets-modal{z-index:2;transition:all ease .3s}.app-wrapper .presets-modal-wrapper.v-enter-active,.app-wrapper .presets-modal-wrapper.v-leave-active{transition:opacity .3s ease}.app-wrapper .presets-modal-wrapper.v-enter-from,.app-wrapper .presets-modal-wrapper.v-leave-to{opacity:0}.app-wrapper .presets-modal-wrapper.v-enter-from .presets-modal,.app-wrapper .presets-modal-wrapper.v-leave-to .presets-modal{transform:translate3d(0,50%,0) scale(.9);opacity:0}@font-face{font-family:Inter;src:url(./inter-variable-b9a8e5e2.ttf) format("truetype-variations");font-weight:100 1000}:root{--background1: #404040;--background2: #4d4d4d;--background3: #363636;--background4: #2b2b2b;--background5: #212121;--backgroundInactive: #4d4d4d;--backgroundInverse: #EBEBEB;--actionSecondaryBackground: #5e5e5e;--actionSecondaryBackgroundHover: #696969;--actionPrimaryText: #FFFFFF;--actionPrimaryTextHover: #F6F6F6;--actionSecondaryText: #EBEBEB;--actionSecondaryTextHover: #F6F6F6;--actionPrimaryBackground: #0073E6;--actionPrimaryBackgroundHover: #1280EE;--border1: #363636;--border2: #2b2b2b;--border3: #212121;--border4: #5e5e5e;--text1: #d9d9d9;--text2: #ababab;--text3: #757575;--text4: #696969;--textInactive: #757575;--textInverse: #363636;--blueText: #8AC2FF;--blueIcon: #2496FF;--blueBorder: #2496FF;--greenBackground: #008547;--greenBackgroundHover: #00944F;--greenText: #63D489;--greenIcon: #2FC862;--greenBorder: #2FC862;--yellowBackground: #996E00;--yellowBackgroundHover: #AD7D00;--yellowText: #FFC700;--yellowIcon: #FFC700;--yellowBorder: #FFC700;--redBackground: #CF313B;--redBackgroundHover: #DB434C;--redText: #FF8A8A;--redIcon: #FF424D;--redBorder: #FF424D;--orangeBackground: #C75300;--orangeBackgroundHover: #DD7124;--orangeText: #FFAB66;--orangeIcon: #F67E28;--orangeBorder: #F67E28;--purpleBackground: #7F5AE9;--purpleBackgroundHover: #8A61FF;--purpleText: #B89EFF;--purpleIcon: #A484FF;--purpleBorder: #A484FF;--font-stack: "Inter", sans-serif;--font-size-small: 11px;--font-size-large: 12px;--font-weight-normal: 400;--font-weight-medium: 500;--border-radius: 2px;--slider-bg: rgb(94, 94, 94);--slider-connect-bg: #fff;--slider-connect-bg-disabled: #5e5e5e;--slider-height: 2px;--slider-vertical-height: 300px;--slider-radius: 9999px;--slider-handle-bg: #fff;--slider-handle-border: 0;--slider-handle-width: 10px;--slider-handle-height: 10px;--slider-handle-radius: 9999px;--slider-handle-shadow: rgba(0, 0, 0, 0) 0px 0px 0px 1px, rgba(0, 0, 0, .3) 0px 0px 0px .5px;--slider-handle-shadow-active: rgba(0, 0, 0, 0) 0px 0px 0px 1px, rgba(0, 0, 0, .3) 0px 0px 0px .5px;--slider-handle-ring-width: 0px;--slider-handle-ring-color: transparent}.app-wrapper{margin:0;font-family:var(--font-stack);font-weight:var(--font-weight-normal);font-size:var(--font-size-small);border-radius:4px}.app-wrapper *,.app-wrapper *:before,.app-wrapper *:after{box-sizing:border-box}.app-wrapper *{margin:0}.app-wrapper body{line-height:1.5;-webkit-font-smoothing:antialiased}.app-wrapper img,.app-wrapper picture,.app-wrapper video,.app-wrapper canvas,.app-wrapper svg{display:block;max-width:100%}.app-wrapper input,.app-wrapper button,.app-wrapper textarea,.app-wrapper select{font:inherit}.app-wrapper p,.app-wrapper h1,.app-wrapper h2,.app-wrapper h3,.app-wrapper h4,.app-wrapper h5,.app-wrapper h6{overflow-wrap:break-word}.app-wrapper #root,.app-wrapper #__next{isolation:isolate}.app-wrapper button{color:var(--actionPrimaryText);background:var(--actionPrimaryBackground);padding:4px 8px;border:2px solid var(--border1);border-radius:var(--border-radius-small)}.app-wrapper button:focus{outline:none;border-color:#1280ee}.vc-chrome-body{font-family:var(--font-stack);background-color:var(--background1)!important;color:var(--text1)}.vc-chrome-body .vc-chrome-fields .vc-chrome-field:nth-child(4){display:none}.vc-chrome-body .vc-chrome-fields .vc-input__input{background-color:var(--background4);box-shadow:inset 0 0 0 1px var(--border3);color:var(--text1)}.vc-chrome-body .vc-chrome-fields .vc-input__input:focus{box-shadow:0 0 0 1px var(--blueBorder)}.vc-chrome-body .vc-chrome-alpha-wrap{display:none}.vc-chrome-body .vc-chrome-hue-wrap{margin-bottom:0;margin-left:8px}.vc-chrome-body .vc-chrome-controls{align-items:center}.vc-chrome-body .vc-chrome-active-color{box-shadow:0 0 0 1px var(--border3)}.vc-chrome-body .vc-chrome-toggle-btn{display:flex;justify-content:center;align-items:center;margin-left:4px}.vc-chrome-body .vc-chrome-toggle-btn .vc-chrome-toggle-icon{margin-top:0;margin-right:0}.vc-chrome-body .vc-chrome-toggle-btn .vc-chrome-toggle-icon svg path{fill:var(--text1)!important}.vc-chrome-body .vc-chrome-toggle-btn .vc-chrome-toggle-icon-highlight{left:0;top:0;width:100%;height:100%;background-color:var(--background2)}