:root{color-scheme:dark;background:#000;color:#fff}#app{display:grid;height:100vh;place-items:center}body{font-variant-numeric:slashed-zero tabular-nums;margin:0}*{font-family:Space Grotesk,sans-serif;font-optical-sizing:auto}button{&[data-v-22567a93]{font-family:inherit;font-size:1.25rem;font-weight:600;background-color:#000;border:.25rem solid #fff;border-radius:100vw;padding:.5rem 2rem;cursor:pointer}&[data-v-22567a93]:hover{background-color:#222}&[data-v-22567a93]:active{background-color:#555}}.under-game[data-v-22567a93]{display:flex;justify-content:space-between}.info[data-v-22567a93]{display:inline-block;width:1.25em;height:1.25em;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='M12 16v-4'/%3E%3Cpath d='M12 8h.01'/%3E%3C/svg%3E");background-size:contain;background-position:center;background-repeat:no-repeat}label[data-v-22567a93]{display:flex;gap:.5em;align-items:center;user-select:none;cursor:pointer;padding:.25em}input[type=checkbox][data-v-22567a93]:has(+.checkbox){display:none}.checkbox[data-v-22567a93]{display:inline-block;width:1.5em;height:1.5em;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2'/%3E%3C/svg%3E");background-size:contain;background-position:center;background-repeat:no-repeat}input[type=checkbox]:checked+.checkbox[data-v-22567a93]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='18' height='18' x='3' y='3' rx='2'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E")}.wrapper[data-v-22567a93]{width:720px;display:grid;gap:3rem}.display{&[data-v-22567a93]{display:grid;grid-template-columns:repeat(2,1fr);gap:3rem;position:relative}.color[data-v-22567a93]{box-shadow:0 .5rem 1.5rem #fff2}#restart{&[data-v-22567a93]{width:5rem;height:5rem;border-radius:50%;background-color:#0008;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8'/%3E%3Cpath d='M3 3v5h5'/%3E%3C/svg%3E");background-size:80%;background-position:center;background-repeat:no-repeat;cursor:pointer;filter:drop-shadow(0 0 .25rem black);position:absolute;bottom:0;left:50%;z-index:1000;translate:-50% 75%;transition:all .15s}&[data-game-over=false][data-v-22567a93]{width:3rem;height:3rem}&[data-v-22567a93]:hover{scale:1.1}}}.color{&[data-v-22567a93]{min-width:6rem;height:6rem;border-radius:1rem;background-color:var(--color-bg);outline-offset:-2px;outline:2px dashed #444}&[data-v-22567a93]:not([data-placeholder=true]){outline-color:transparent}.guess &[data-placeholder=true][data-v-22567a93]{outline-color:#222}[data-current=true] &[data-placeholder=true][data-v-22567a93]{outline-color:#444}.label[data-v-22567a93]{font-size:1.5rem;font-weight:900;text-transform:uppercase;translate:0 -125%}}.guesses[data-v-22567a93]{display:grid;grid-template-columns:repeat(7,1fr);gap:.5rem;position:relative}.guess[data-v-22567a93]{display:contents}.tile{&[data-v-22567a93]{display:grid;align-content:center;gap:.5rem;place-items:center;aspect-ratio:1;background-color:#111;border-radius:.5rem;font-size:2rem;font-weight:700;outline-offset:-2px;outline:4px solid transparent;transition:all .1s ease}[data-current=true] &[data-v-22567a93]{background-color:#222}&[data-selected=true][data-v-22567a93]{background-color:#333;outline-color:#555}&[data-tw=true]{&[data-v-22567a93]{outline-color:#b00}&[data-selected=true][data-v-22567a93]{outline-color:red}}&:not([data-diff=""]){&[data-v-22567a93]{--icon: none}&[data-v-22567a93]:after{content:"";display:block;width:1.5rem;height:1.5rem;background-image:var(--icon);background-size:contain;background-position:center;background-repeat:no-repeat}&[data-diff="-3"][data-v-22567a93]{--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m17 11-5-5-5 5'/%3E%3Cpath d='m17 18-5-5-5 5'/%3E%3C/svg%3E")}&[data-diff="-1"][data-v-22567a93]{--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m18 15-6-6-6 6'/%3E%3C/svg%3E")}&[data-diff="0"][data-v-22567a93]{--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%2300ff00' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E")}&[data-diff="1"][data-v-22567a93]{--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}&[data-diff="3"][data-v-22567a93]{--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m7 6 5 5 5-5'/%3E%3Cpath d='m7 13 5 5 5-5'/%3E%3C/svg%3E")}}}#gameover{&[data-v-22567a93]{display:grid;justify-items:center;align-content:center;gap:3rem;position:absolute;inset:0;background-image:radial-gradient(circle closest-side,black 50%,transparent)}>div[data-v-22567a93]{display:flex;gap:2rem;align-items:center}#lucky[data-v-22567a93],#sniped[data-v-22567a93],#trophy[data-v-22567a93],#fail[data-v-22567a93]{width:6rem;height:6rem;background-size:contain;background-position:center;background-repeat:no-repeat}#lucky[data-v-22567a93]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 24 24' fill='none' stroke='%233EA055' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16.17 7.83 2 22'/%3E%3Cpath d='M4.02 12a2.827 2.827 0 1 1 3.81-4.17A2.827 2.827 0 1 1 12 4.02a2.827 2.827 0 1 1 4.17 3.81A2.827 2.827 0 1 1 19.98 12a2.827 2.827 0 1 1-3.81 4.17A2.827 2.827 0 1 1 12 19.98a2.827 2.827 0 1 1-4.17-3.81A1 1 0 1 1 4 12'/%3E%3Cpath d='m7.83 7.83 8.34 8.34'/%3E%3C/svg%3E")}#sniped[data-v-22567a93]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='22' x2='18' y1='12' y2='12'/%3E%3Cline x1='6' x2='2' y1='12' y2='12'/%3E%3Cline x1='12' x2='12' y1='6' y2='2'/%3E%3Cline x1='12' x2='12' y1='22' y2='18'/%3E%3C/svg%3E")}#trophy[data-v-22567a93]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14.66v1.626a2 2 0 0 1-.976 1.696A5 5 0 0 0 7 21.978'/%3E%3Cpath d='M14 14.66v1.626a2 2 0 0 0 .976 1.696A5 5 0 0 1 17 21.978'/%3E%3Cpath d='M18 9h1.5a1 1 0 0 0 0-5H18'/%3E%3Cpath d='M4 22h16'/%3E%3Cpath d='M6 9a6 6 0 0 0 12 0V3a1 1 0 0 0-1-1H7a1 1 0 0 0-1 1z'/%3E%3Cpath d='M6 9H4.5a1 1 0 0 1 0-5H6'/%3E%3C/svg%3E")}#fail[data-v-22567a93]{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18.12 10 14H4.17a2 2 0 0 1-1.92-2.56l2.33-8A2 2 0 0 1 6.5 2H20a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2h-2.76a2 2 0 0 0-1.79 1.11L12 22a3.13 3.13 0 0 1-3-3.88Z'/%3E%3Cpath d='M17 14V2'/%3E%3C/svg%3E")}#usage-count[data-v-22567a93]{font-size:2rem;font-weight:900}#color-name{&[data-v-22567a93]{--contrast-color: white;display:grid;gap:.25rem;padding:.75rem 3rem;border-radius:1rem;background-color:var(--color);color:var(--contrast-color);text-align:center;cursor:pointer;transition:all .1s ease}&[data-v-22567a93]:after{content:"";background-color:var(--color);opacity:0}&[data-v-22567a93]:active{translate:0 15%;scale:.875}#color-name-name[data-v-22567a93]{font-weight:500}#color-name-text{&[data-v-22567a93]{display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;gap:.5rem}&[data-v-22567a93]:after{content:"";display:block;width:1.5rem;height:1.5rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3C/svg%3E");background-size:contain;background-position:center;background-repeat:no-repeat}}&[data-contrast=black] #color-name-text[data-v-22567a93]:after{filter:invert(1)}}span[data-v-22567a93]{font-size:3rem;font-weight:700}}#toasts{&[data-v-22567a93]{position:fixed;bottom:1rem}.toast{&[data-v-22567a93]{background:#000;color:#fff;border:.25rem solid white;border-radius:.5rem;position:relative}>div[data-v-22567a93]:not(:empty){padding:.75rem 1.25rem}.title{&[data-v-22567a93]{background:#333;font-weight:600;font-size:1.25rem}&[data-v-22567a93]:not(:empty){border-bottom:.25em solid white}}.close[data-v-22567a93]{width:2rem;height:2rem;border-radius:50%;background-color:#000;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cpath d='m15 9-6 6'/%3E%3Cpath d='m9 9 6 6'/%3E%3C/svg%3E");background-size:75%;background-position:center;background-repeat:no-repeat;position:absolute;top:0;right:0;translate:50% -50%;cursor:pointer}}}.toast-move[data-v-22567a93],.toast-enter-active[data-v-22567a93],.toast-leave-active[data-v-22567a93]{transition:all .3s ease}.toast-enter-from[data-v-22567a93],.toast-leave-to[data-v-22567a93]{opacity:0;translate:0 2em}#focus-warning[data-v-22567a93]{font-size:1.5rem;font-weight:900;letter-spacing:.0625em;white-space:nowrap;padding:1rem 2.5rem;border:.5rem solid white;background-color:#111;border-radius:100vw;position:fixed;top:1rem;left:50%;z-index:1000;translate:-50% 0;pointer-events:none}