:root{--highlight-hue: 0;--highlight-color: hsl(var(--highlight-hue), 100%, 50%);--trans-time: .2s;--trans-ease: ease-in-out;--swatch-size: 150px;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:hsl(var(--highlight-hue),100%,6%);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media screen and (min-width: 350px){:root{--swatch-size: 200px}}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;align-items:flex-start;justify-content:center;min-width:320px;min-height:100vh}h1{font-size:1.8em;line-height:1.1;text-decoration:underline;text-decoration-style:wavy;text-decoration-thickness:2px;text-decoration-color:var(--highlight-color);transition:text-decoration-color var(--trans-time) var(--trans-ease)}@media screen and (min-width: 350px){h1{font-size:3.2em}}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:hsl(var(--highlight-hue),100%,15%);cursor:pointer;transition:all var(--trans-time) var(--trans-ease);color:hsl(var(--highlight-hue),100%,75%)}button.active,button:hover{border-color:var(--highlight-color)}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}#app{max-width:1280px;margin:0 auto;text-align:center}.swatch{width:100%;height:200px;transition:background-color var(--trans-time) var(--trans-ease);border:1px solid white;border-radius:7px}.mask[data-v-c1f12019]{position:fixed;left:0;top:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background-color:#000000e6;padding:1rem;overflow-x:auto}.instructions[data-v-c1f12019]{width:100%;max-width:350px}ol[data-v-c1f12019]{display:block;margin-inline:auto;text-align:left}h1[data-v-ae07cd3f]{margin-top:3rem}.tabs[data-v-ae07cd3f]{display:flex;justify-content:center;flex-wrap:wrap;gap:1rem;margin-bottom:2rem}.instructions-button[data-v-ae07cd3f]{position:absolute;top:1rem;right:1rem}.wrapper[data-v-7ea3e8b0]{padding-inline:1rem;max-width:100vw}.swatch[data-v-7ea3e8b0]{margin-bottom:1rem;width:100%;max-width:400px;cursor:pointer}.controls[data-v-7ea3e8b0]{align-items:center;justify-content:center;display:flex;flex-wrap:wrap;gap:2rem}.output[data-v-7ea3e8b0]{text-align:left}.output p[data-v-7ea3e8b0]{margin-block:.5rem}h2[data-v-7ea3e8b0]{text-decoration:underline;text-decoration-style:wavy;text-decoration-thickness:2px;text-decoration-color:var(--highlight-color);transition:text-decoration-color var(--trans-time) var(--trans-ease)}.guesses[data-v-7ea3e8b0]{max-width:400px;margin-top:4rem}.guesses .colors[data-v-7ea3e8b0]{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.guesses .color[data-v-7ea3e8b0]{display:flex;flex-direction:column}.guesses input[data-v-7ea3e8b0]{font-size:2rem;width:100%}.guesses .score[data-v-7ea3e8b0]{font-size:2rem}.picker-container[data-v-a049ed57]{display:grid;grid-template-columns:3rem var(--swatch-size);position:relative;gap:3px}.picker-swatch[data-v-a049ed57]{position:relative}.picker-swatch[data-v-a049ed57]:after{content:"";position:absolute;pointer-events:none;top:0;left:0;bottom:0;right:0;background-image:linear-gradient(to top,#000,#80808000 50%,#fff)}.picker-swatch[data-v-a049ed57]{height:var(--swatch-size);transition:background var(--trans-time) var(--trans-ease);width:var(--swatch-size)}.picker-marker[data-v-a049ed57]{border-radius:50%;border:2px solid white;background:#00000080;height:1rem;position:absolute;pointer-events:none;transform:translate(-50%,50%);width:1rem;z-index:1}.label[data-v-a049ed57]{display:flex;justify-content:space-between}input[type=range][data-v-a049ed57]{width:100%}input[type=range][data-v-a049ed57]::-webkit-slider-runnable-track,input[type=range][data-v-a049ed57]::-moz-range-track{background:transparent}.hue input[data-v-a049ed57]{background:linear-gradient(to right,red,#ff8000,#ff0,#80ff00,#0f0,#00ff80,#0ff,#0080ff,#00f,#7f00ff,#f0f,#ff0080,red)}.lightness[data-v-a049ed57]{position:relative}.lightness input[data-v-a049ed57]{background:linear-gradient(to right,#000,#fff)}.lightness .rotator[data-v-a049ed57]{position:absolute;right:0;top:0;transform:translateY(-100%) rotate(-90deg);transform-origin:bottom right;width:var(--swatch-size)}.nudge[data-v-a049ed57]{align-items:center;background:transparent;color:currentColor;display:inline-flex;height:1.5rem;justify-content:center;padding:0;width:2rem}.container[data-v-7f65d823]{display:flex;column-gap:4rem;flex-wrap:wrap;justify-content:center}.result[data-v-7f65d823]{padding-top:3rem}.preview-swatch[data-v-7f65d823]{width:var(--swatch-size);height:var(--swatch-size)}.wrapper[data-v-631983c7]{display:grid;grid-template-columns:1fr 1fr;gap:2rem}.swatch[data-v-631983c7]{margin-top:6rem}