.Logo{flex-grow:2}@keyframes logoGlow{0%,to{filter:invert(1) drop-shadow(0 0 10px #00f5ff) drop-shadow(0 0 20px rgba(0,245,255,.4))}50%{filter:invert(1) drop-shadow(0 0 20px #00f5ff) drop-shadow(0 0 45px rgba(0,245,255,.65)) drop-shadow(0 0 70px rgba(0,245,255,.2))}}.Logo img{display:block;width:100%;max-height:45vh;filter:invert(1) drop-shadow(0 0 10px #00f5ff) drop-shadow(0 0 20px rgba(0,245,255,.4));animation:logoGlow 7s ease-in-out infinite}@keyframes decoFloat{0%,to{transform:translateY(0);text-shadow:0 0 12px #ff2079,0 0 35px rgba(255,32,121,.4),0 0 60px rgba(255,32,121,.15)}50%{transform:translateY(-10px);text-shadow:0 0 24px #ff2079,0 0 60px rgba(255,32,121,.65),0 0 95px rgba(255,32,121,.28)}}.Decoration{font-family:KidsDrawings;font-size:calc(25px + 15vmin);flex-grow:1;color:var(--cyber-magenta);margin-left:3vmin;margin-right:3vmin;text-shadow:0 0 12px #ff2079,0 0 35px rgba(255,32,121,.4),0 0 60px rgba(255,32,121,.15);cursor:pointer;-webkit-user-select:none;user-select:none;animation:decoFloat 5s ease-in-out infinite}.Decoration:last-of-type{animation-delay:-2.5s}@keyframes typeEnter{0%{opacity:0;transform:translateY(2.5vmin)}to{opacity:1;transform:translateY(0)}}@keyframes typeWaitPulse{0%,to{opacity:.55;letter-spacing:.1em}50%{opacity:1;letter-spacing:.16em}}@keyframes imgBounceIn{0%{opacity:0;transform:scale(.7) rotate(-5deg)}70%{transform:scale(1.08) rotate(2deg)}to{opacity:1;transform:scale(1) rotate(0)}}.Type{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-around;animation:typeEnter .4s ease-out}.Type textarea{width:80vw;height:20vh;margin:2vmin 0;text-align:left;resize:none;line-height:1.5;transition:border-color .2s,box-shadow .2s}.Type textarea:focus{box-shadow:0 0 14px #00f5ff4d}.Type h1 img{width:25vmin;margin-top:2.3vmin;filter:invert(1) sepia(1) saturate(5) hue-rotate(150deg) drop-shadow(0 0 8px #00f5ff);animation:imgBounceIn .5s cubic-bezier(.34,1.56,.64,1)}.Type button{margin-bottom:3vmin}.Type-waiting{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:3.5vmin;color:var(--cyber-cyan);text-shadow:var(--cyber-glow);background-color:var(--cyber-bg);letter-spacing:.1em;animation:typeWaitPulse 1.6s ease-in-out infinite}.Draw{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:var(--cyber-bg)}@keyframes toolbarSlideIn{0%{opacity:0;transform:translate(-4vmin)}to{opacity:1;transform:translate(0)}}@keyframes popupIn{0%{opacity:0;transform:translate(-8px) scale(.94)}to{opacity:1;transform:translate(0) scale(1)}}@keyframes waitingPulse{0%,to{opacity:.55;letter-spacing:.1em}50%{opacity:1;letter-spacing:.16em}}.Draw-tools{position:relative;z-index:1;flex-grow:1;display:flex;flex-direction:column;align-items:center;animation:toolbarSlideIn .35s ease-out}.Draw-tools .tool-color{margin:1.5vmin}.Draw-tools>.tool-button{margin:1.5vmin}.Draw-tools .tool-button-done{margin:2vmin 1.5vmin 1.5vmin}.Draw-canvas{flex-grow:1}.Draw-waiting{display:flex;align-items:center;justify-content:center;width:100%;height:100%;font-size:3.5vmin;color:var(--cyber-cyan);text-shadow:var(--cyber-glow);background-color:var(--cyber-bg);letter-spacing:.1em;animation:waitingPulse 1.6s ease-in-out infinite}.Draw-canvas canvas{touch-action:none;display:block;max-width:100%;max-height:100vh;border-radius:.5vmin;border:1.5px solid rgba(0,245,255,.25);box-shadow:0 0 20px #00f5ff14}.tool-button{background-color:#000014d9;border:1.5px solid var(--cyber-cyan);color:var(--cyber-cyan);text-align:center;display:inline-flex;border-radius:50%;box-shadow:var(--cyber-glow);cursor:pointer;outline:none;width:12vmin;height:12vmin;align-items:center;justify-content:center;text-shadow:var(--cyber-glow);transition:background-color .15s,box-shadow .15s,transform .1s}.tool-button:hover{background-color:#00f5ff1f;box-shadow:0 0 16px #00f5ff,0 0 40px #00f5ff4d}.tool-button:active{transform:scale(.88)}.tool-button-sm{width:8vmin;height:8vmin;font-size:2.5vmin;margin:0}.tool-button-help{border-color:var(--cyber-magenta);color:var(--cyber-magenta);box-shadow:var(--cyber-glow-magenta);text-shadow:var(--cyber-glow-magenta)}.tool-button-help:hover{background-color:#ff20791f;box-shadow:0 0 16px #ff2079,0 0 40px #ff20794d}.tool-button-done{border-color:var(--cyber-green);color:var(--cyber-green);box-shadow:var(--cyber-glow-green);text-shadow:var(--cyber-glow-green)}.tool-button-done:hover{background-color:#39ff141f;box-shadow:0 0 16px #39ff14,0 0 40px #39ff144d}.tool-button-eraser{border-color:var(--cyber-magenta);color:var(--cyber-magenta);box-shadow:var(--cyber-glow-magenta);text-shadow:var(--cyber-glow-magenta)}.tool-button-fill{border-color:var(--cyber-yellow);color:var(--cyber-yellow);box-shadow:0 0 8px #f7c800,0 0 20px #f7c80033;text-shadow:0 0 8px #f7c800}.tool-button-shape{border-color:#00f5ff99}.tool-button-active{background-color:#00f5ff2e!important;box-shadow:0 0 16px #00f5ff,0 0 40px #00f5ff66!important}.tool-button-eraser.tool-button-active{background-color:#ff20792e!important;box-shadow:0 0 16px #ff2079,0 0 40px #ff207966!important}.tool-button-fill.tool-button-active{background-color:#f7c8002e!important;box-shadow:0 0 16px #f7c800,0 0 40px #f7c80066!important}.tool-button-shape.tool-button-active{background-color:#00f5ff2e!important;box-shadow:0 0 16px #00f5ff,0 0 40px #00f5ff66!important}.tool-button-row{display:flex;flex-direction:row;gap:1vmin;margin:.8vmin 0}.tool-button img{width:6vmin;height:6vmin;filter:invert(1) sepia(1) saturate(5) hue-rotate(150deg) drop-shadow(0 0 3px #00f5ff)}.tool-button-help img{filter:invert(1) sepia(1) saturate(5) hue-rotate(290deg) drop-shadow(0 0 3px #ff2079)}.tool-button-done img{filter:invert(1) sepia(1) saturate(5) hue-rotate(65deg) drop-shadow(0 0 3px #39ff14)}.tool-button-brush{cursor:pointer;margin:1vmin;border:1.5px solid rgba(0,245,255,.35);box-shadow:0 0 6px #00f5ff26}.tool-popup{position:absolute;z-index:10;margin-left:2vmin;padding:1vmin;border-radius:2vmin;background-color:#060614f2;border:1.5px solid rgba(0,245,255,.4);box-shadow:var(--cyber-glow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:.5vmin;animation:popupIn .18s ease-out}.tool-color{width:12vmin;height:12vmin;position:relative;border-radius:50%;border:1.5px solid var(--cyber-cyan);box-shadow:var(--cyber-glow);cursor:pointer}.tool-color .tool-color-selectedcolor{position:absolute;width:10vmin;height:10vmin;left:1vmin;top:1vmin;border-radius:50%}.tool-color img{width:12vmin;height:12vmin;filter:invert(1) sepia(1) saturate(3) hue-rotate(150deg)}.ColorPicker{width:100%;height:100%;display:flex}.ColorPicker>div{display:flex;flex-direction:column;flex-grow:1}.ColorPicker>div>div{flex-grow:1;cursor:pointer}.tool-noir-swatches{display:grid;grid-template-columns:1fr 1fr;gap:.8vmin;margin:1vmin 0;justify-items:center}.tool-noir-swatch{width:7vmin;height:7vmin;border-radius:50%;border:1.5px solid rgba(0,245,255,.4);cursor:pointer;transition:transform .1s,box-shadow .1s}.tool-noir-swatch:hover{transform:scale(1.12);box-shadow:0 0 8px #00f5ff99}.DrawHelp{min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;background-color:var(--cyber-bg)}.DrawHelp h1 img{height:12vmin;margin-top:2.3vmin;filter:invert(1) sepia(1) saturate(5) hue-rotate(150deg) drop-shadow(0 0 8px #00f5ff)}.BeforeGameStartScreen{display:flex;width:100%;height:100%;align-items:center}.BeforeGameStartScreen-left{width:50vw;height:100%;display:flex;flex-direction:column;text-align:left}.BeforeGameStartScreen-right{height:100%;width:50vw;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly}.BeforeGameStartScreen-right .field{white-space:nowrap;-webkit-user-select:all;user-select:all;max-width:44vw;overflow:auto}.BeforeGameStartScreen-right .Logo{flex-grow:0}.BeforeGameStartScreen-right .Logo img{width:30vmin}.Players-title{padding-left:2vmin;color:var(--cyber-cyan);text-shadow:var(--cyber-glow);font-size:.75em;text-transform:uppercase;letter-spacing:.15em}.Players{flex:1 1 0;min-height:8vmin;border:1.5px solid rgba(0,245,255,.5);border-left-width:0;border-bottom-width:0;border-radius:1vmin;border-top-left-radius:0;border-bottom-left-radius:0;border-bottom-right-radius:0;padding:2vmin;margin-right:5vmin;background-color:#00f5ff08;box-shadow:var(--cyber-glow),inset 0 0 20px #00f5ff05;overflow:auto}@keyframes playerJoin{0%{opacity:0;transform:translate(-2vmin)}to{opacity:1;transform:translate(0)}}.Players .Player{margin-bottom:2vmin;animation:playerJoin .35s ease-out both}@keyframes slideInRight{0%{opacity:0;transform:translate(3vmin)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-3vmin)}to{opacity:1;transform:translate(0)}}.Join{display:flex;width:100%;height:100%;align-items:center}.Join-logo{height:100%;flex-grow:1;flex-basis:50%;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;animation:slideInLeft .45s ease-out}.Join-logo .Logo{flex-grow:0}.Join-logo .Logo img{max-height:75vh;width:40vw}.Join-content{flex-grow:1;flex-basis:50%;animation:slideInRight .45s ease-out}.Join-content .SelectFace{margin-top:.5vmin;margin-bottom:3vmin}.Join-content label{display:block;margin-bottom:.9vmin;color:var(--cyber-text-muted);font-size:.75em;text-transform:uppercase;letter-spacing:.12em}.Join-content input{width:80%;margin-bottom:4vmin}.SelectFace{cursor:pointer;width:24vmin;height:24vmin;vertical-align:middle;margin:0 auto}.SelectFace:hover .Face{box-shadow:var(--cyber-glow-magenta),inset 0 0 14px #ff207914,0 0 35px #ff207966;transform:scale(1.04)}.App{text-align:center;height:100%;width:100%}.App>div{width:100%;height:100%}.Player{display:flex;align-items:center;white-space:nowrap;color:var(--cyber-text)}.Player .Face{flex:none;margin-right:2vmin}.Face{font-family:TheFreakyFace;font-size:30vmin;border:1.5px solid var(--cyber-magenta);border-radius:50%;background-color:#ff20790f;width:24vmin;height:24vmin;line-height:21vmin;-webkit-user-select:none;user-select:none;box-shadow:var(--cyber-glow-magenta),inset 0 0 14px #ff207914;text-align:center;overflow:hidden;transition:transform .18s ease,box-shadow .18s ease}.Face-small{width:8vmin;height:8vmin;font-size:10vmin;line-height:7.1vmin}.buttons{width:100%;display:flex;justify-content:space-evenly;flex-wrap:wrap;padding:1vmin}.buttons .button{margin:1vmin}.button{background:linear-gradient(135deg,#00f5ff1f,#00f5ff0d);border:1.5px solid var(--cyber-cyan);color:var(--cyber-cyan);padding:2vmin 5vmin;text-align:center;text-decoration:none;display:inline-block;border-radius:100px;font-size:1em;font-weight:600;box-shadow:var(--cyber-glow);cursor:pointer;outline:none;text-shadow:0 0 8px #00f5ff;letter-spacing:.06em;transition:background .2s,box-shadow .2s,transform .1s}.button:hover{background:linear-gradient(135deg,#00f5ff38,#00f5ff1a);box-shadow:0 0 18px #00f5ff,0 0 50px #00f5ff4d;transform:translateY(-1px)}.button:active{transform:translateY(1px) scale(.97);box-shadow:0 0 6px #00f5ff}.button-red:active{box-shadow:0 0 6px #ff2079}.button-red{background:linear-gradient(135deg,#ff20791f,#ff20790d);border-color:var(--cyber-magenta);color:var(--cyber-magenta);box-shadow:var(--cyber-glow-magenta);text-shadow:0 0 8px #ff2079}.button-red:hover{background:linear-gradient(135deg,#ff207938,#ff20791a);box-shadow:0 0 18px #ff2079,0 0 50px #ff20794d}.button-blue{background:linear-gradient(135deg,#00f5ff1f,#00f5ff0d);border-color:var(--cyber-cyan);color:var(--cyber-cyan);box-shadow:var(--cyber-glow);text-shadow:0 0 8px #00f5ff}.button:disabled{background:#ffffff05;border-color:#1e2c3a;color:#1e2c3a;box-shadow:none;text-shadow:none;cursor:not-allowed;transform:none}.Drawing{display:block;margin:2vmin 0;max-height:100vh;max-width:90vw;border:1.5px solid rgba(0,245,255,.5);border-radius:1vmin;box-shadow:var(--cyber-glow)}@keyframes tooltipIn{0%{opacity:0;transform:translate(-50%) translateY(4px)}to{opacity:1;transform:translate(-50%) translateY(0)}}[data-tooltip]{position:relative}[data-tooltip]:hover:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:#080818f2;color:#00f5ff;border:1px solid rgba(0,245,255,.6);padding:3px 8px;border-radius:4px;font-size:1.4vmin;min-font-size:10px;white-space:nowrap;pointer-events:none;z-index:500;box-shadow:0 0 8px #00f5ff4d;font-family:monospace;letter-spacing:.05em;animation:tooltipIn .15s ease-out}:root{--cyber-bg: #080818;--cyber-bg-panel: #0c0c20;--cyber-cyan: #00f5ff;--cyber-magenta: #ff2079;--cyber-green: #39ff14;--cyber-yellow: #f7c800;--cyber-text: #c8d8f0;--cyber-text-muted: #3d5570;--cyber-glow: 0 0 8px #00f5ff, 0 0 20px rgba(0, 245, 255, .2);--cyber-glow-magenta: 0 0 8px #ff2079, 0 0 20px rgba(255, 32, 121, .2);--cyber-glow-green: 0 0 8px #39ff14, 0 0 20px rgba(57, 255, 20, .2)}html,body,#root{margin:0;width:100%;height:100%;overflow:hidden}@font-face{font-family:Comic Neue;src:url(/assets/ComicNeue-Regular-T33zOu0n.woff) format("woff")}@font-face{font-family:KidsDrawings;src:url(/assets/KidsDrawings-DrND27pd.woff) format("woff");font-display:block}@font-face{font-family:TheFreakyFace;src:url(/assets/TheFreakyFace-BxX77vxV.woff) format("woff");font-display:block}body{background-color:var(--cyber-bg);background-image:linear-gradient(rgba(0,245,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,245,255,.04) 1px,transparent 1px);background-size:40px 40px}body,button,input,textarea{font-family:Comic Neue,sans-serif;font-size:calc(14px + 3vmin);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--cyber-text)}a{color:var(--cyber-cyan);text-shadow:var(--cyber-glow)}h1{font-size:calc(16px + 4vmin);font-weight:700;margin:1vmin 0;color:var(--cyber-cyan);text-shadow:var(--cyber-glow)}input,textarea,.field{outline:none;border:1.5px solid var(--cyber-cyan);border-radius:1vmin;padding:1vmin 2vmin;background-color:#00f5ff0d;box-shadow:var(--cyber-glow),inset 0 0 12px #00f5ff0d;text-align:center;color:var(--cyber-text);caret-color:var(--cyber-cyan);transition:box-shadow .2s,border-color .2s}input:focus,textarea:focus{box-shadow:0 0 18px #00f5ff66,inset 0 0 12px #00f5ff14;border-color:var(--cyber-cyan)}.field{word-break:break-word;overflow-wrap:anywhere;color:var(--cyber-cyan);text-shadow:var(--cyber-glow)}.field-label{font-size:.7em;color:var(--cyber-text-muted);text-transform:uppercase;letter-spacing:.12em}.hidden{display:none!important}.small{font-size:.7em;color:var(--cyber-text-muted)}