:root{--white: #181a1b;--black: #fff;--app-red: red;--app-green: green;--guess-black: #fff;--guess-gray: #919191;--guess-yellow: #fc0;--guess-green: #0c8;--guess-text-red: red;--app-width: min(100vw, var(--app-max-width));--app-max-width: 600px
}body,html{height:100%}body{background:#fff;background:var(--black);color:#181a1b;color:var(--white);font-family:Outfit,sans-serif;font-size:calc(min(100vw,600px)/30);font-size:calc(var(--app-width)/30)}#root{height:100%}p,ul{margin:0}a,button{color:#181a1b;color:var(--white)}button{background-color:#fff;background-color:var(--black);border:double;cursor:pointer;font-size:calc(min(100vw,600px)/30);font-size:calc(var(--app-width)/30);padding:calc(min(100vw,600px)/75);padding:calc(var(--app-width)/75)}.game{display:grid;grid-template-rows:auto 1fr auto;height:100%;margin:auto;max-width:600px;max-width:var(--app-max-width)}.game.win{background:green;background:var(--app-green)}.game.lose{background-color:red;background-color:var(--app-red)}.game.color-blind{--guess-yellow: #60a5fa;--guess-green: #fb923c
}.game.wide{max-width:1200px;max-width:calc(var(--app-max-width)*2)}.header{display:grid;grid-template-rows:auto auto;padding:4px}.row-1{grid-column-gap:8px;align-items:center;-webkit-column-gap:8px;column-gap:8px;display:grid;grid-template-columns:auto auto 1fr auto auto auto;justify-content:center}.title{font-size:calc(min(100vw,600px)/18.5);font-size:calc(var(--app-width)/18.5);margin:0;text-align:center}.icon{cursor:pointer;width:calc(min(100vw,600px)/18.5);width:calc(var(--app-width)/18.5)}.row-2{display:flex;justify-content:space-between}.cannot-win{color:red;color:var(--guess-text-red)}.timer{font-family:monospace}.boards{grid-column-gap:calc(min(100vw,600px)/75);grid-column-gap:calc(var(--app-width)/75);grid-row-gap:calc(min(100vw,600px)/25);grid-row-gap:calc(var(--app-width)/25);align-content:start;-webkit-column-gap:calc(min(100vw,600px)/75);column-gap:calc(min(100vw,600px)/75);-webkit-column-gap:calc(var(--app-width)/75);column-gap:calc(var(--app-width)/75);display:grid;grid-template-columns:repeat(4,auto);overflow-y:scroll;padding:0 calc(min(100vw,600px)/75) calc(min(100vw,600px)/25);padding:0 calc(var(--app-width)/75) calc(var(--app-width)/25) calc(var(--app-width)/75);row-gap:calc(min(100vw,600px)/25);row-gap:calc(var(--app-width)/25)}.game.wide .boards{grid-template-columns:repeat(8,auto)}.board{grid-gap:calc(min(100vw,600px)/600);grid-gap:calc(var(--app-width)/600);background:#181a1b;background:var(--white);display:grid;gap:calc(min(100vw,600px)/600);gap:calc(var(--app-width)/600);grid-template-columns:repeat(5,1fr);padding:calc(min(100vw,600px)/600);padding:calc(var(--app-width)/600)}.board.complete{-webkit-filter:contrast(.5) brightness(.5);filter:contrast(.5) brightness(.5)}.game.hide-completed-boards .board.complete{display:none}.cell{align-items:center;aspect-ratio:1/1;background:#fff;background:var(--guess-black);display:flex;font-size:calc(min(100vw,600px)/25);font-size:calc(var(--app-width)/25);justify-content:center;line-height:.75;position:relative;-webkit-user-select:none;-ms-user-select:none;user-select:none}.cell.yellow{background:#fc0;background:var(--guess-yellow)}.cell.green,.cell.yellow{color:#fff;color:var(--black)}.cell.green{background:#0c8;background:var(--guess-green)}.cell.text-red{color:red;color:var(--guess-text-red)}.letter{position:absolute}.keyboard{grid-row-gap:2px;grid-column-gap:2px;-webkit-column-gap:2px;column-gap:2px;display:grid;font-size:calc(min(100vw,600px)/20);font-size:calc(var(--app-width)/20);grid-template-columns:repeat(10,1fr);padding:2px;row-gap:2px}.keyboard.hidden{display:none}.game.wide .keyboard{justify-self:center;width:600px;width:var(--app-max-width)}.key{align-items:center;aspect-ratio:1/1;border:1px solid #181a1b;cursor:pointer;display:flex;justify-content:center;-webkit-user-select:none;-ms-user-select:none;user-select:none}.key.enter-1{border-bottom:none}.key.enter-2{border-right:none}.key.enter-3{border-left:none;border-top:none}.result{grid-column-gap:calc(min(100vw,600px)/75);grid-column-gap:calc(var(--app-width)/75);-webkit-column-gap:calc(min(100vw,600px)/75);column-gap:calc(min(100vw,600px)/75);-webkit-column-gap:calc(var(--app-width)/75);column-gap:calc(var(--app-width)/75);display:grid;font-size:calc(min(100vw,600px)/30);font-size:calc(var(--app-width)/30);grid-template-columns:1fr auto;padding:calc(min(100vw,600px)/75);padding:calc(var(--app-width)/75)}.result.hidden{display:none}.share{grid-row-gap:calc(min(100vw,600px)/75);grid-row-gap:calc(var(--app-width)/75);display:grid;grid-template-rows:1fr auto;row-gap:calc(min(100vw,600px)/75);row-gap:calc(var(--app-width)/75)}.text{background-color:#fff;background-color:var(--black);border:1px solid;color:#181a1b;font-size:calc(min(100vw,600px)/50);font-size:calc(var(--app-width)/50);margin:0;text-align:center}.text .emoji{width:calc(min(100vw,600px)/50);width:calc(var(--app-width)/50)}.words{grid-column-gap:calc(min(100vw,600px)/75);grid-column-gap:calc(var(--app-width)/75);-webkit-column-gap:calc(min(100vw,600px)/75);column-gap:calc(min(100vw,600px)/75);-webkit-column-gap:calc(var(--app-width)/75);column-gap:calc(var(--app-width)/75);display:grid;grid-template-columns:1fr 1fr 1fr 1fr;text-align:center}.popup-wrapper{align-items:center;background:hsla(0,0%,8%,.6);bottom:0;display:flex;flex-direction:column;justify-content:center;left:0;position:fixed;right:0;top:0}.popup-wrapper.hidden{display:none}.popup{background-color:#fff;background-color:var(--black);border:1px solid #181a1b;display:flex;flex-direction:column;overflow:auto;padding:calc(min(100vw,600px)/20);padding:calc(var(--app-width)/20);width:min(450px,100vw);width:min(calc(var(--app-max-width)*.75),100vw)}.separator{width:100%}.close{margin-top:calc(min(100vw,600px)/30);margin-top:calc(var(--app-width)/30)}.group label{margin-left:calc(min(100vw,600px)/75);margin-left:calc(var(--app-width)/75)}