@font-face{font-family:Poppins;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/poppins-devanagari-400-normal-478b3ab7.woff2) format("woff2"),url(/assets/poppins-devanagari-400-normal-aa135e25.woff) format("woff");unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+20A8,U+20B9,U+25CC,U+A830-A839,U+A8E0-A8FF}@font-face{font-family:Poppins;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/poppins-latin-ext-400-normal-cb8bdeab.woff2) format("woff2"),url(/assets/poppins-latin-ext-400-normal-8090b590.woff) format("woff");unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Poppins;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/poppins-latin-400-normal-7d93459d.woff2) format("woff2"),url(/assets/poppins-latin-400-normal-2db0a254.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}*{padding:0;margin:0;box-sizing:border-box}button{border:none;outline:none;background:none}button:not(:disabled){cursor:pointer}@font-face{font-family:Poppins Regular;src:url(/assets/Poppins-Regular-707fdc5c.ttf)}@font-face{font-family:Poppins Bold;src:url(/assets/Poppins-Bold-7219547e.ttf)}@font-face{font-family:Poppins Semi Bold;src:url(/assets/Poppins-SemiBold-248c0244.ttf)}@font-face{font-family:Poppins Medium Italic;src:url(/assets/Poppins-MediumItalic-449f6bd9.ttf)}.App{--x-scale: 1;--y-scale: 1;--scale: min(var(--x-scale), var(--y-scale));position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden;display:flex;justify-content:center;align-items:center}@media screen and (max-width: 1400px){.App{--x-scale: .9}}@media screen and (max-width: 1200px){.App{--x-scale: .8}}@media screen and (max-width: 1000px){.App{--x-scale: .7}}@media screen and (max-width: 900px){.App{--x-scale: .6}}@media screen and (max-width: 800px){.App{--x-scale: .5}}@media screen and (max-width: 650px){.App{--x-scale: .45}}.App .Overlay{position:absolute;top:0;left:0;width:100%;height:100%}.Drawing{display:grid;grid-template-areas:"r h ." "p c ." ". t .";grid-template-rows:0fr 1fr 0fr;grid-template-columns:400px 700px 0fr;gap:21px;position:relative;width:100%;height:100%}.Drawing .CanvasRenderer{grid-area:c}.Drawing .DrawingHint{grid-area:h}.Drawing .DrawingTools,.Drawing .DrawingGuessForm{grid-area:t}.Drawing .PlayersView{grid-area:p}.Drawing .RemainingTime{grid-area:r}.Drawing .Overlay{position:absolute;left:0;top:0;width:100%;height:100%}.PlayersView{display:flex;flex-direction:column;gap:9px}.PlayerView{display:grid;grid-template-areas:"head icon" "score icon";padding:18px 21px;border:4px solid black;border-radius:21px;gap:9px;grid-template-columns:1fr 0fr}.PlayerView>small{grid-area:score}.PlayerView>header{grid-area:head;display:flex;align-items:center;gap:9px;height:27px}.PlayerView>.Icon{grid-area:icon;align-self:center;width:42px;height:42px}.PlayerView[data-guessed=true]{background:black;color:#fff}.Pill{display:inline-block;border-radius:600px;--background: unset;--color: unset;background:var(--background);color:var(--color);padding:6px 12px}.Pill[data-contrast=false]{--background: black;--color: white}.Pill[data-contrast=true]{--background: white;--color: black}.Icon{width:24px;height:24px}.Icon svg{width:100%;height:100%}.Icon *[fill]:not([fill=none]){fill:currentColor}.Icon *[stroke]:not([stroke=none]){stroke:currentColor}.CanvasRenderer{border:4px solid black;border-radius:21px;background:var(--background)}.CanvasRenderer canvas{width:100%;height:100%;border-radius:17px;image-rendering:optimizeSpeed;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:optimize-contrast;image-rendering:pixelated;-ms-interpolation-mode:nearest-neighbor}.DrawingHint{height:52px;border:4px solid black;border-radius:600px;display:flex;align-items:center;justify-content:center}.DrawingTools{display:flex;gap:21px}.DrawingTools__tools{display:grid;grid-template-columns:0fr 0fr;gap:9px}.DrawingTools__utils{display:flex;flex-direction:column;gap:9px}.DrawingSection{display:flex;flex-direction:column;gap:3px}.DrawingToolButton{width:54px;height:54px;display:flex;align-items:center;justify-content:center;border-radius:12px;border:4px solid black;transition:all .1s ease-in-out;background:white;color:#000}.DrawingToolButton[data-active=true]{background:black;color:#fff}.DrawingToolButton .Icon{width:32px;height:32px}.DrawingToolButton:active{transform:scale(.9)}.DrawingSize{display:flex;flex-direction:column;padding:4px 0;border:4px solid black;border-radius:12px;height:117px;width:54px;align-items:center;justify-content:space-between}.DrawingSize .Icon{width:32px;height:32px}.DrawingSize button{transition:all .1s ease-in-out;border-radius:9px}.DrawingSize button:active{background:black;color:#fff}.DrawingPalette{display:grid;grid-template-rows:repeat(var(--rows),0fr);grid-template-columns:repeat(var(--columns),0fr);border:4px solid black;border-radius:12px;padding:14px;gap:27px;width:fit-content;height:fit-content;position:relative}.DrawingPalette button{width:27px;height:27px;background-color:var(--color);border-radius:100%;transition:all .1s ease-in-out}.DrawingPalette button[data-white=true]{border:4px solid black}.DrawingPalette button:active{transform:scale(.9)}.DrawingPalette__cursor{position:absolute;width:45px;height:45px;border-radius:100%;border:4px solid black;pointer-events:none;left:calc(5px + var(--column) * 54px);top:calc(5px + var(--row) * 54px);transition:all .15s ease-in-out}.DrawingGuessForm{height:54px;border-radius:600px;border:4px solid black;display:flex;align-items:center;justify-content:center;position:relative}.DrawingGuessForm input{font-family:Poppins Regular,sans-serif;font-size:24px;line-height:24px;height:100%;width:100%;border:none;outline:none;background:none;text-align:center}.DrawingGuessForm[data-guessed=true]{background:black;color:#fff}.DrawingGuessForm[data-guessed=true] input{display:none}@keyframes error{0%{border-color:red;background:#ffdada;transform:translate(30px)}25%{transform:translate(-15px)}50%{transform:translate(10px)}75%{transform:translate(-5px)}to{border-color:#000;background:white;transform:translate(0)}}.DrawingGuessForm[data-error=true]{animation:error .3s ease-in-out}.DrawingGuessForm .Icon{position:absolute;right:2px;top:2px;width:42px;height:42px}.RemainingTime{border:4px solid black;height:52px;display:flex;align-items:center;width:100px;padding:0 12px;border-radius:600px}.RemainingTime label{display:inline-block;flex:1;text-align:center}.Overlay{display:flex;align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:rgba(255,255,255,.5);animation:show .4s ease-in-out}@keyframes show{0%{opacity:0}to{opacity:1}}.Overlay__banner{width:100%;padding:60px 0;background:white;display:flex;flex-direction:column;align-items:center;border:4px solid black;border-left:none;border-right:none;animation:showFromRight .4s ease-in-out}@keyframes showFromRight{0%{transform:translate(100%);opacity:.5}to{transform:translate(0);opacity:1}}.CanvasLayout{display:grid;grid-template-areas:". . . . ." ". r h . ." ". p c . ." ". . t . ." ". . . . .";grid-template-rows:1fr 0fr 0fr 0fr 1fr;grid-template-columns:1fr 400px 700px 400px 1fr;gap:21px;position:relative;height:100%;width:100%;padding:21px;transform:scale(var(--scale));transform-origin:0 25%}.CanvasLayout .CanvasRenderer{grid-area:c}.CanvasLayout .DrawingHint{grid-area:h}.CanvasLayout .DrawingTools,.CanvasLayout .DrawingGuessForm{grid-area:t}.CanvasLayout .PlayersView{grid-area:p}.CanvasLayout .RemainingTime{grid-area:r;justify-self:end}.CanvasLayout .Overlay{position:absolute;left:0;top:0;width:100%;height:100%}.Lobby{display:flex;flex-direction:column;justify-content:center;gap:21px}.Lobby .Button{width:300px;display:flex;gap:9px;justify-content:center}.Button{border:4px solid black;border-radius:9px;padding:11px 18px;background:white;transition:all .1s ease-in-out;font-family:Poppins Regular,sans-serif;font-size:24px;line-height:24px;text-transform:lowercase;--color: black;--background: white;color:var(--color);background:var(--background)}.Button:active:not(:disabled){transform:scale(.9)}.Button:disabled{border-color:gray;color:gray}.Button[data-contrast=true]{--color: white;--background: black}.ChoosingWord__words{display:flex;flex-wrap:wrap;max-width:500px;gap:9px;justify-content:center;padding-top:9px}body{font-family:Poppins Regular,sans-serif}*{font-family:inherit;font-size:inherit}h1{font-family:Poppins Bold,sans-serif;font-size:32px;line-height:48px}h2{font-family:Poppins Bold,sans-serif;font-size:24px;line-height:32px}h3{font-family:Poppins Bold,sans-serif;font-size:18px;line-height:24px}h4{font-family:Poppins Semi Bold,sans-serif;font-size:15px;line-height:21px}p{font-family:Poppins Regular,sans-serif;font-size:24px;line-height:24px}small{font-family:Poppins Regular,sans-serif;font-size:15px;line-height:15px}label{font-family:Poppins Medium Italic,sans-serif;font-size:15px;line-height:15px;text-transform:lowercase}.Auth form{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:21px}.Auth form input{height:54px;border:4px solid black;border-radius:600px;text-align:center;padding:0 18px;font-family:Poppins Regular,sans-serif;font-size:24px;line-height:24px;outline:none}
