#controlPanel[data-v-0756bb27]{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:1% 1rem 0;background-color:#0beef9;background-image:linear-gradient(315deg,#0beef9 0%,#48a9fe 74%);box-shadow:0 0 5px #0006;position:relative}@media (min-width: 1500px){#controlPanel[data-v-0756bb27]{padding:5% 1rem 0}}@media (min-width: 1600px){#controlPanel[data-v-0756bb27]{gap:.5rem;padding:15% 1rem 0}}@media (min-width: 1800px){#controlPanel[data-v-0756bb27]{padding:25% 1rem 0}}#controlPanel .label[data-v-0756bb27]{padding:.5rem 0 0;font-size:1.1rem;font-weight:700;color:#fff;text-align:center}@media (min-width: 1600px){#controlPanel .label[data-v-0756bb27]{padding:1rem 0 0}}.color-div[data-v-49427536]{min-width:0;min-height:0;max-width:100%;max-height:100%;display:grid;padding:min(10%,10px);gap:10px;box-shadow:0 0 3px #0006;transition:all .2s}#playground[data-v-f41f01f2]{max-height:100%;padding:50px;background-color:#b8c6db;background-image:linear-gradient(315deg,#b8c6db 0%,#f5f7fa 74%)}#playground .main-color-div[data-v-f41f01f2]{width:100%;height:100%}#playground .main-color-div.main-color-div--active[data-v-f41f01f2]{cursor:crosshair}/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}abbr[title]{text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}:root{font-family:"Open Sans",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:16px;line-height:1.3;font-weight:500}@media (min-width: 1500px){:root{font-size:17px}}@media (min-width: 1600px){:root{font-size:18px}}#app{width:100vw;height:100vh;position:relative;overflow:hidden;display:grid;grid-template-columns:16rem 1fr;grid-template-rows:1fr}#app>*{min-width:0;min-height:0}.base-button[data-v-49d2f47d]{width:fit-content;height:fit-content;max-width:100%;max-height:100%;padding:.5rem 1rem;margin:0;cursor:pointer;user-select:none;box-shadow:0 0 8px #0009;border-radius:5px;text-align:center;line-height:1;background:#fff;transition:background .2s}.base-button[data-v-49d2f47d]:hover{background:#fffb}.base-color-input__wrapper[data-v-03671d7f]{position:relative;width:fit-content;height:fit-content;border-radius:9999px}.base-color-input__wrapper .base-color-input[data-v-03671d7f]{-webkit-appearance:none;box-sizing:border-box;border:none;width:7rem;height:7rem;border-radius:inherit;overflow:hidden;padding:0;margin:0;box-shadow:0 0 8px #0009;cursor:pointer}.base-color-input__wrapper .base-color-input[data-v-03671d7f]::-webkit-color-swatch-wrapper{margin:0;padding:0}.base-color-input__wrapper .base-color-input[data-v-03671d7f]::-webkit-color-swatch{margin:0;padding:0;border:none}.base-color-input__wrapper .base-color-input__cover[data-v-03671d7f]{position:absolute;inset:0;display:flex;align-items:center;pointer-events:none}.base-color-input__wrapper .base-color-input__cover .base-color-input__value[data-v-03671d7f]{width:100%;text-align:center;font-weight:700;color:#fff;text-shadow:-1px 0 black,0 1px black,1px 0 black,0 -1px black}.base-number-input[data-v-69ab10eb]{box-sizing:border-box;width:9rem;height:auto;max-width:100%;max-height:100%;padding:.1rem 0;margin:0;outline:none;box-shadow:0 0 8px #0009;border-radius:5px;border:none;line-height:1.4;text-align:center;background:#fff;-moz-appearance:textfield}.base-number-input[data-v-69ab10eb]:focus{outline:none}.base-number-input[data-v-69ab10eb]::-webkit-outer-spin-button,.base-number-input[data-v-69ab10eb]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.base-select-list[data-v-52086a2c]{width:100%;display:flex;flex-direction:column;gap:1px;border-radius:5px;box-shadow:0 0 8px #0009;text-align:center;user-select:none;overflow:hidden}.base-select-list .base-select-list__item[data-v-52086a2c]{padding:2px 3px;cursor:pointer;transition:background .2s,color .2s;background:#fff;color:#000}.base-select-list .base-select-list__item.base-select-list__item--active[data-v-52086a2c]{background:#fff0;color:#fff}.base-select-list .base-select-list__item[data-v-52086a2c]:hover:not(.base-select-list__item--active){background:#fffb}