@import"https://fonts.googleapis.com/css2?family=Rubik&display=swap";@import"https://fonts.googleapis.com/css2?family=Ubuntu+Mono&display=swap";.ps{overflow:hidden!important;overflow-anchor:none;-ms-overflow-style:none;touch-action:auto;-ms-touch-action:auto}.ps__rail-x{display:none;opacity:0;transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;height:15px;bottom:0px;position:absolute}.ps__rail-y{display:none;opacity:0;transition:background-color .2s linear,opacity .2s linear;-webkit-transition:background-color .2s linear,opacity .2s linear;width:15px;right:0;position:absolute}.ps--active-x>.ps__rail-x,.ps--active-y>.ps__rail-y{display:block;background-color:transparent}.ps:hover>.ps__rail-x,.ps:hover>.ps__rail-y,.ps--focus>.ps__rail-x,.ps--focus>.ps__rail-y,.ps--scrolling-x>.ps__rail-x,.ps--scrolling-y>.ps__rail-y{opacity:.6}.ps .ps__rail-x:hover,.ps .ps__rail-y:hover,.ps .ps__rail-x:focus,.ps .ps__rail-y:focus,.ps .ps__rail-x.ps--clicking,.ps .ps__rail-y.ps--clicking{background-color:#eee;opacity:.9}.ps__thumb-x{background-color:#aaa;border-radius:6px;transition:background-color .2s linear,height .2s ease-in-out;-webkit-transition:background-color .2s linear,height .2s ease-in-out;height:6px;bottom:2px;position:absolute}.ps__thumb-y{background-color:#aaa;border-radius:6px;transition:background-color .2s linear,width .2s ease-in-out;-webkit-transition:background-color .2s linear,width .2s ease-in-out;width:6px;right:2px;position:absolute}.ps__rail-x:hover>.ps__thumb-x,.ps__rail-x:focus>.ps__thumb-x,.ps__rail-x.ps--clicking .ps__thumb-x{background-color:#999;height:11px}.ps__rail-y:hover>.ps__thumb-y,.ps__rail-y:focus>.ps__thumb-y,.ps__rail-y.ps--clicking .ps__thumb-y{background-color:#999;width:11px}@supports (-ms-overflow-style: none){.ps{overflow:auto!important}}@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none){.ps{overflow:auto!important}}/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-weight:400;font-size:100%}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}img,video{max-width:100%;height:auto}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:left}a{color:inherit;text-decoration:none}button{padding:0;font-family:inherit;border:none}@font-face{font-family:Fallback;src:local(system-ui),local(-apple-system),local(BlinkMacSystemFont),local(Segoe UI),local(Roboto),local(Ubuntu),local(Helvetica),local(Arial),local(sans-serif)}:root{color-scheme:dark}html,body{height:100%;margin:0;font-size:16px;font-family:Rubik,Fallback;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}img{user-select:none;-webkit-user-drag:none}::selection{background:rgba(163.965,178.0155,193.035,.15)}#app{width:100%;height:100%}.action-menu[data-v-2c7ddc61]{display:flex;align-items:center;margin-top:5rem;padding:.5rem;background-color:#2a2f37;border-radius:2rem}.action-menu .menu-item[data-v-2c7ddc61]{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;margin:0 .5rem;background-color:#404854;border-radius:50%;cursor:pointer;transition:opacity .2s}.action-menu .menu-item.disabled[data-v-2c7ddc61]{cursor:default;opacity:.6}.avatar-background[data-v-6050a99e]{position:absolute;top:0;left:0;width:100%;height:100%;transition:background-color .1s}.avatar-border[data-v-ceb3dab8]{position:absolute;top:0;left:0;z-index:3;width:100%;height:100%;border-style:solid;border-width:10px;transition:border-color .1s}.vue-color-avatar[data-v-77345064]{position:relative;overflow:hidden}.vue-color-avatar .avatar-payload[data-v-77345064]{position:relative;z-index:2;width:100%;height:100%}.container[data-v-434f1076]{height:100%;padding-right:20rem}.container.full[data-v-434f1076]{padding-right:0}@media screen and (max-width: 976px){.container[data-v-434f1076]{padding-right:0}}@media (prefers-reduced-motion: no-preference){.container[data-v-434f1076]{transition:padding-right .2s}}.main[data-v-65973d8c]{width:100%;height:100%;overflow:hidden;color:#a4b2c1;background-color:#14161a}.main .content-warpper[data-v-65973d8c]{height:100%;transform:scale(1)}.main .content-warpper .content-view[data-v-65973d8c]{position:relative;z-index:110;display:flex;flex-direction:column;height:100%;overflow-y:auto}.playground[data-v-65973d8c]{display:flex;flex:1;flex-direction:column;align-items:center;justify-content:center;padding:2rem 0}.playground .avatar-wrapper[data-v-65973d8c]{display:flex;align-items:center;justify-content:center}@media screen and (max-width: 480px){.playground .avatar-wrapper[data-v-65973d8c]{transform:scale(.85)}}.playground .action-group[data-v-65973d8c]{display:flex;align-items:center;justify-content:center;margin-top:4rem;column-gap:1rem}@supports not (column-gap: 1rem){.playground .action-group .action-btn[data-v-65973d8c]{margin:0 .5rem}}.playground .action-group .action-btn[data-v-65973d8c]{min-width:6rem;height:2.5rem;padding:0 1rem;color:#a4b2c1;font-weight:700;background:hsl(216,14%,19%);border-radius:.6rem;cursor:pointer;transition:color .2s;user-select:none}.playground .action-group .action-btn[data-v-65973d8c]:hover{color:#c2ccd6}.playground .action-group .action-btn[data-v-65973d8c]:disabled,.playground .action-group .action-btn[disabled][data-v-65973d8c]{color:#a4b2c180;cursor:default}@media screen and (max-width: 480px){.playground .action-group .action-multiple[data-v-65973d8c]{display:none}}@supports (filter: blur(4rem)) or (-webkit-filter: blur(4rem)) or (-moz-filter: blur(4rem)){.gradient-bg[data-v-65973d8c]{position:fixed;top:0;left:0;width:100%;height:100%}.gradient-bg .gradient-top[data-v-65973d8c]{position:absolute;width:100vh;height:100vh;background-image:radial-gradient(rgba(133.008,233.2536,244.392,.8) 20%,rgba(133.008,233.2536,244.392,.6) 40%,rgba(133.008,233.2536,244.392,.4) 60%,rgba(133.008,233.2536,244.392,.2) 80%,transparent 100%);border-radius:50%;opacity:.2;filter:blur(4rem);top:-50%;right:-20%}.gradient-bg .gradient-bottom[data-v-65973d8c]{position:absolute;width:100vh;height:100vh;background-image:radial-gradient(rgba(105.2895,102.765,254.235,.8) 20%,rgba(105.2895,102.765,254.235,.6) 40%,rgba(105.2895,102.765,254.235,.4) 60%,rgba(105.2895,102.765,254.235,.2) 80%,transparent 100%);border-radius:50%;opacity:.2;filter:blur(4rem);bottom:-50%;left:-20%}}