:root{color-scheme:light dark}html,body{margin:0;padding:0}#app{display:flex;justify-content:center;align-items:center;width:100vw;height:100vh}*{background-color:light-dark(#e4eacf,#21231b);color:light-dark(#414635,#ccd3b6)}section{background-color:light-dark(#b3bb9d,#626950);box-shadow:2px 2px 6px #21231b}section *{background-color:transparent}section input[type=number]{padding:.5rem;border:2px solid light-dark(#414635,#ccd3b6);transition:border .2s ease,background .2s ease}section input[type=number]:disabled{border:2px solid light-dark(#ccd3b6,#414635)}section input[type=number]:focus{background-color:light-dark(#9ba384,#828b6a);outline:none}section button{background-color:light-dark(#9ba384,#828b6a);padding:.5rem;border-radius:.5rem;border:none;transition:background .2s ease,color .2s ease}section button:hover{background-color:light-dark(#626950,#b3bb9d);color:light-dark(#ccd3b6,#414635)}.light{color-scheme:light}.dark{color-scheme:dark}section[data-v-ecae1c6f]{display:flex;gap:.5rem;flex-direction:column;position:absolute;margin:1rem;padding:1rem;top:0;left:0;border-radius:1rem}#buttons[data-v-ecae1c6f]{display:flex;gap:.5rem}fieldset[data-v-ecae1c6f]{display:grid;grid-template-columns:1.75rem 6rem 1fr;row-gap:.5rem}fieldset input[type=radio][data-v-ecae1c6f]{margin-right:.5rem}fieldset label[data-v-ecae1c6f]{display:flex;align-items:center;-webkit-user-select:none;user-select:none}fieldset button[data-v-ecae1c6f]{grid-column:1 / 4}section[data-v-0585072b]{display:flex;flex-direction:column;gap:.5rem;position:absolute;top:1rem;right:1rem;bottom:1rem;padding:1rem;overflow:auto;border-radius:1rem}.color[data-v-0585072b]{display:grid;grid-template-columns:2rem 1.5rem 3.5rem 1fr 4rem;align-items:center;gap:.5rem}.preview[data-v-0585072b]{display:block;width:1rem;height:1rem;border:2px solid black}#container[data-v-210b663b]{display:flex;flex-direction:column;align-items:center;gap:1rem;position:absolute;left:0;bottom:0;margin:1rem;padding:1rem;border-radius:1rem}#spinner[data-v-210b663b]{border:12px solid light-dark(#828b6a,#9ba384);border-top:12px solid lightblue;border-radius:50%;width:40px;height:40px;animation:spin-210b663b 2s linear infinite}.v-leave-to[data-v-210b663b]{opacity:0}.v-leave-active[data-v-210b663b]{transition:opacity .2s ease}@keyframes spin-210b663b{0%{transform:rotate(0)}to{transform:rotate(360deg)}}