:root{font-family:Inter,Avenir,Helvetica,Arial,sans-serif;font-size:16px;line-height:16px;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%;overflow-x:hidden;text-align:center}#background{position:relative;display:flex;justify-content:center;align-items:center}.circle{position:fixed;z-index:-1;border-radius:50%;border:solid .1em #FFF8BC;margin:4em auto}#app,.nodeContainer{justify-content:center;align-items:center}.members{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;width:90%;margin:0 auto}.node{margin:auto auto 3em;border-radius:70%;height:6em;width:6em;background-color:#ffd56f;align-self:center}#localNode{background-color:#ff6e31}.member{margin-right:min(100px,4em);margin-left:min(100px,4em)}.node a{display:flex;justify-content:center;align-items:center;height:100%;width:100%;color:#fff;font-size:3.5em;font-weight:700;text-decoration:none}.node h2{font-size:1.6em;line-height:1em;color:#3fa796;margin:.4em;text-shadow:1px 0 #000,-1px 0 #000,0 1px #000,0 -1px #000,1px 1px #000,-1px -1px #000,1px -1px #000,-1px 1px #000}input[type=file]{opacity:0;visibility:hidden}button{font-size:1.3em;font-weight:550;background-color:#fff8bc;border:none;color:#242424;transition:all .2s ease-out;border-radius:.5em}.intro{position:fixed;z-index:2;top:0;left:0;right:0;bottom:0;background-color:#0009;overflow-y:scroll}.hideIntro{visibility:hidden;opacity:0;margin-top:-10%;transition:ease-in-out .5s}.hideIntroNoAnim{visibility:hidden;opacity:0;margin-top:-10%}.intro-wrapper{margin-left:20%;margin-right:20%;margin-top:1rem;padding:2em;background-color:#383638;border-radius:.5em;position:relative}@media screen and (max-width: 768px){.intro-wrapper{margin-left:5%;margin-right:5%}}#helpBtn{padding:.45rem;border-radius:2em;font-size:1.5em;font-weight:530;margin-right:.5rem;width:fit-content}.intro h1{font-size:3em;font-weight:700;color:#cfca99;margin-top:.2em;margin-bottom:1em}.intro h2{font-size:1.5em;font-weight:700;color:#e9e3b3;margin-top:.2em;margin-bottom:.5em}.intro h3{font-size:1.2em;font-weight:500;color:#eee9c4;margin-top:.2em;margin-bottom:.5em}.desc{text-align:left}#logo{width:5rem;height:5rem}.joinRoom{position:fixed;z-index:2;top:0;left:0;right:0;bottom:0;background-color:#0009;visibility:hidden;opacity:0}.showRoom{transition:ease-in-out opacity .5s;visibility:visible;opacity:1}.wrapper{margin:10em auto;padding:2em;background-color:#383638;border-radius:.5em;width:30%;position:relative;transition:all .5s ease-out}@media (max-width: 768px){.wrapper{width:70%}:root{overflow-x:hidden}}.wrapper .content{max-height:30%;overflow:auto}.wrapper h2{font-size:1.5em;font-weight:500;color:#e6e0aa;margin-top:.2em;margin-bottom:.5em}.container{border-radius:1em;background-color:#242424;padding:1em}.container label{font-size:1.5em;font-weight:500;color:#fff8bc}input[type=text]{width:85%;border-radius:1em;padding:.5em;border:solid .1em #FFF8BC;margin:.7em 0;box-sizing:border-box;font-size:1em;font-weight:500;text-align:center}button[type=submit]{width:70%;padding:.5em;border:none;cursor:pointer;font-size:1.5em;font-weight:500}button:hover{background-color:#fec260;color:#242424}button:focus{border:#000 solid .1em}@keyframes animate-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes animate-out{0%{transform:scale(1);opacity:1}to{transform:scale(0);opacity:0}}.message{position:absolute;z-index:1;margin:-6em 0 0 4em;border:solid .1em #FFF8BC;background-color:#ac4425;box-shadow:.5em .5em 1em #000;transform-origin:0% 0%;animation:animate-in .3s ease-in-out}.messageOut{animation:animate-out .3s ease-in-out}.message p{margin:.4em;font-size:1.1em;font-weight:500;color:#fff8bc}.message span{font-weight:600;color:#f0c929}.messageBtn{margin:.1em;font-size:1.2em;font-weight:800}.createRoom{position:absolute;z-index:1;right:1em;top:1em;font-size:1em;text-align:end}.createRoom h2{font-size:1.7em;color:#0081c9;line-height:1em;text-shadow:1px 0 #000,-1px 0 #000,0 1px #000,0 -1px #000,1px 1px #000,-1px -1px #000,1px -1px #000,-1px 1px #000;max-width:5ch;text-align:center}.createRoom span{color:#fec260;max-width:5ch}#createBtn{padding:.45rem;font-size:1.5em;font-weight:530;display:inline-block}:root{--dot-diameter: 7em;--circle-border-width: 2px;--default-color: gainsboro;--completion-color: #C55300}.circle-container{position:absolute;margin-top:-.5em;margin-left:-3.5em;width:var(--dot-diameter);height:var(--dot-diameter);transform:rotate(-90deg)}.circle-container__background{fill:none;stroke-width:var(--circle-border-width)}.circle-container__progress{fill:none;stroke:var(--completion-color);stroke-dasharray:100 100;stroke-dashoffset:100;stroke-linecap:round;stroke-width:var(--circle-border-width);transition:stroke-dashoffset 1s ease-in-out;will-change:transform}