*{
  box-sizing:border-box}
html{
  background:#111214;color:#eee;font-family:Arial,sans-serif}
body{
  margin:0;font-size:16px;line-height:1.5}
button,input,textarea,select{
  font:inherit}
button,a,input[type=file]{
  cursor:pointer}
button{
  background:#282a31;border:1px solid #41434d;color:#eee;padding:10px 16px;border-radius:9px;transition:background .15s}
button:hover{
  background:#373a45}
button:disabled{
  opacity:.55;cursor:wait}
button.primary{
  background:#7965ec;background:linear-gradient(110deg,#5996eb,#8d5ce8);border-color:#7970ec;color:#fff}
a{
  color:#a9b5ff;word-wrap:break-word;overflow-wrap:break-word}
input,textarea{
  background:#15161b;border:1px solid #41434d;border-radius:9px;color:#eee;padding:11px;width:100%;min-width:0}
textarea{
  resize:vertical;min-height:92px}
label{
  display:block;margin:12px 0 5px}
form button{
  margin-top:12px}
[hidden]{
  display:none!important}
.header{
  position:relative;background:#18191e;border-bottom:1px solid #353740;padding:14px 4%;display:block;overflow:hidden}
.header img{
  vertical-align:middle;border-radius:10px;margin-right:10px}
.header strong{
  font-size:21px}
.header span{
  margin-left:18px;color:#bbb;display:inline-block}
.header #logout{
  position:absolute;right:4%;top:16px}
.header #retry{
  display:block;margin-top:10px}
.header #identity{
  max-width:45%;vertical-align:middle;word-wrap:break-word}
main{
  max-width:1180px;margin:20px auto;padding:0 20px}
.panel{
  background:#1b1c22;border:1px solid #363840;padding:20px;border-radius:14px;margin:18px 0}
#login{
  max-width:460px;margin:32px auto}
.hint,.muted{
  color:#a9aab6;font-size:14px}
#status{
  min-height:24px;color:#a9b8ff;word-wrap:break-word}
h1,h2{
  margin:0 0 16px;font-size:24px}
h3{
  margin:0 0 10px;font-size:18px}
nav{
  border-bottom:1px solid #353740;padding:12px 0}
nav button{
  margin:4px 6px 4px 0}
nav .active{
  border-color:#8d73ed;background:#342e4c}
.row{
  display:block;padding:14px 0;border-bottom:1px solid #333640;overflow:hidden;word-wrap:break-word}
.row button{
  max-width:100%;text-align:left;white-space:normal}
.row a{
  display:inline-block;margin:4px 10px 4px 0}
.row small{
  display:block;color:#9fa0ac}
.actions button{
  margin:4px 8px 4px 0}
.split{
  display:table;width:100%;table-layout:fixed}
.rail{
  display:table-cell;width:27%;padding-right:18px;vertical-align:top}
.conversation{
  display:table-cell;vertical-align:top;min-width:0}
.rail button{
  display:block;width:100%;margin-bottom:8px}
.messages{
  max-height:58vh;overflow:auto;border:1px solid #333640;padding:12px;border-radius:12px;min-height:200px}
.message{
  margin:10px 0;padding:12px;background:#25262e;border-radius:10px;word-wrap:break-word}
.message p{
  white-space:pre-wrap;margin:7px 0}
.message img{
  max-width:100%;max-height:460px;height:auto;display:block;border-radius:8px}
.message video,.message audio{
  max-width:100%;width:100%}
.attachment{
  display:inline-block;padding:6px 10px;border:1px solid #444;border-radius:7px}
.columns{
  display:table;table-layout:fixed;width:100%}
.column{
  display:table-cell;vertical-align:top;padding:8px;border-right:1px solid #353740;word-wrap:break-word}
.card{
  padding:12px;background:#282a32;border-radius:8px;margin:8px 0}
.search{
  margin:10px 0}
.search input{
  width:70%;display:inline-block}
.search button{
  margin:0 0 0 7px}
#unread{
  display:inline-block;background:#7965ec;color:#fff;border-radius:20px;padding:0 7px}
.progress{
  color:#b6a4ff}
.file-name{
  word-wrap:break-word}
.cancel{
  margin-left:8px}
button:focus,input:focus,textarea:focus,a:focus{
  outline:2px solid #9b87fa;outline-offset:2px}
@media(max-width:650px){
  main{
  padding:0 12px;margin-top:12px}
.panel{
  padding:14px}
.header{
  padding:12px}
.header #identity{
  display:block;max-width:72%;margin:8px 0 0;font-size:14px}
.header button{
  padding:8px}
.split,.rail,.conversation,.columns,.column{
  display:block;width:100%}
.rail{
  max-height:160px;overflow:auto;margin-bottom:15px;padding-right:0}
.rail button{
  display:inline-block;width:auto;margin-right:7px}
.column{
  border-right:0;border-bottom:1px solid #353740}
.messages{
  max-height:50vh}
nav button{
  font-size:14px;padding:8px 10px}
.search input{
  width:65%}
.hint{
  font-size:12px}
h1,h2{
  font-size:21px}
}
@media(prefers-reduced-motion:reduce){
  button{
  transition:none}
}