body {
    margin: 0;
    padding-bottom: 3rem;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background-color: rgb(16, 4, 17);
    color: white;
}
 #form {
     background: rgba(0, 0, 0, 0.5);
     padding: 0.25rem;
     position: fixed;
     bottom: 0;
     left: 0;
     right: 0;
     display: flex;
     height: 4rem;
     box-sizing: border-box;
     backdrop-filter: blur(10px);
}
 #user {
     background: rgba(0, 0, 0, 0.15);
     padding: 0.25rem;
     position: fixed;
     bottom: 64;
     left: 0;
     right: 0;
     display: flex;
     height: 2.5rem;
     box-sizing: border-box;
     backdrop-filter: blur(10px);
}
 #input {
     border: none;
     padding: 0 1rem;
     flex-grow: 1;
     border-radius: 3px;
     margin: 0.25rem;
     background-color: rgb(58, 17, 61);
     color:white;
     font-size: 125%;
}
 #input:focus {
     outline: none;
}
 #form > button {
     background: rgb(58, 17, 61);
     border: none;
     padding: 0 5rem;
     margin: 0.25rem;
     border-radius: 3px;
     outline: none;
     color: #fff;
}
 #user > button {
     background: #333;
     border: none;
     padding: 0 1rem;
     margin: 0.25rem;
     border-radius: 3px;
     outline: none;
     color: #fff;
}
 #messages {
     list-style-type: none;
     margin: 0;
     padding: 0;
}
 #messages > li {
     padding: 0.5rem 1rem;
}
 /*#messages > li:nth-child(odd) {
     background: rgb(26, 6, 29);
}*/