body{
  background:black;
  color:#00ff88;
  font-family:monospace;
  margin:0;
  overflow:hidden;
}

.terminal{
  padding:15px;
  height:100vh;
  display:flex;
  flex-direction:column;
}

.header{
  border:1px solid #00ff88;
  padding:15px;
  margin-bottom:15px;
  font-size:30px;
}

#messages{
  flex:1;
  overflow-y:auto;
  margin-bottom:15px;
}

.msg{
  margin:8px 0;
  font-size:22px;
}

.name{
  color:#00ffff;
}

.time{
  color:#888;
  margin-right:8px;
}

.system{
  color:yellow;
  margin:10px 0;
}

.input-row{
  display:flex;
  align-items:center;
  border-top:1px solid #00ff88;
  padding-top:10px;
}

.input-row span{
  margin-right:10px;
  font-size:28px;
}

input{
  flex:1;
  background:black;
  color:#00ff88;
  border:none;
  outline:none;
  font-size:26px;
  font-family:monospace;
}

button{
  background:#00ff88;
  color:black;
  border:none;
  padding:12px 20px;
  cursor:pointer;
  font-weight:bold;
  margin-left:10px;
}

.hidden{
  display:none;
}

#loginBox{
  margin-top:50px;
}

#errorBox{
  color:red;
  margin-top:10px;
}

.panic-btn{
  background:#ff0033;
  color:white;
}

.panic-btn:hover{
  background:#cc0029;
}