@font-face {
    font-family: "default";
    src: url("SourceCodePro.woff2");
}

body {
    margin: 0;
}

* {
    font-family: "default";
    outline: none;
}

*:not(.message > *) {
    background-color: white;
    color: blue;
}

*::selection {
    color:white;
    background: blue;
}

button {
    border: solid 2px blue;
}

button:active {
    color: red;
    border: solid 2px red;
}

input {
    border: solid 2px blue;
}

input:focus {
    border: solid 2px red;
}

#Username {
    display: block;
    margin-bottom: 5px;
}

#Chat > .output {
    margin: 10px;
    margin-top: 20px;
    aspect-ratio: 1.75/1;
    max-width: 45%;
    overflow-y: scroll;
    overflow-x: hidden;
    scrollbar-color: white blue;
    scroll-behavior: smooth;
    border: solid 2px blue;
    border-right: none;
}
.username {
    font-weight: bolder;
}

.username::after {
    content: "]:";
}

.username::before {
    content: "[";
}