:root{--yellow:#ffd232}body{background-color:#fafafa}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-align:center;color:#2c3e50}nav{padding:30px}nav a{font-weight:700;color:#2c3e50}nav a.router-link-exact-active{color:#42b983}#app::-webkit-scrollbar{width:4px}#app::-webkit-scrollbar-track{background:transparent}#app::-webkit-scrollbar-thumb{background:#888}#app::-webkit-scrollbar-thumb:hover{background:#555}.btn{position:relative;border-radius:var(--bor);padding:.5rem 1rem;font-weight:700;font-weight:1rem;cursor:pointer;background:transparent;-webkit-user-select:none;-moz-user-select:none;user-select:none;overflow:hidden;isolation:isolate}.btn:before{background:#cbcbcb}.btn:after,.btn:before{content:"";position:absolute;inset:0;border-radius:var(--bor);z-index:-1}.btn:after{background:#ffd232;transition:scale .3s;transform-origin:right;scale:0 1}.btn:hover:after{transform-origin:left;scale:1 1}.home{filter:drop-shadow(0 0 2px #DDD);position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%}.createWindow{border-radius:16px;background-color:#fff;padding:1rem 2rem;max-width:90vw;margin:auto}.title{font-size:1.5rem;font-weight:700}.createWindow input{border:none;background-color:#eee;font-size:1rem;border-radius:8px;padding:.5rem 1rem}input.roomname{border-radius:4px 0 0 4px}.createWindow input:focus{outline:none}