header h1{font-size:22px;margin:0}
header h1 span{font:12px/1.5 var(--mono);color:var(--muted);margin-left:8px}
main{max-width:1320px}
section{padding:24px;background:var(--panel);border:1px solid var(--line);margin-bottom:20px;min-width:0}
#connect{max-width:760px;margin:24px auto}
#connect p{max-width:65ch}
#login{display:grid;gap:16px;margin:24px 0}
#login button{justify-self:start;min-width:160px}
.identity{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.identity h2{margin:0}
.identity p{font:12px/1.7 var(--mono);overflow-wrap:anywhere}
.identity button{margin-left:auto}
.columns{display:grid;grid-template-columns:1fr 1.3fr;gap:20px}
label{display:block;margin:12px 0}
input,textarea,select{display:block;width:100%;margin-top:6px}
textarea{font-family:var(--mono);font-size:16px}
button{margin:4px 8px 4px 0}
#login button{margin:0}
pre{background:var(--bg);border:1px solid var(--line);padding:16px;max-height:480px;overflow:auto}
.row{padding:12px 0;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
p{overflow-wrap:anywhere}
details{border-top:1px solid var(--line);margin-top:20px}
ul{padding-left:20px;overflow-wrap:anywhere}
.danger{background:transparent;border-style:dashed}
.danger:hover{background:var(--raised)}
#workspace>section:last-child{margin-bottom:20px}

@media(max-width:800px){.columns{display:block}
.identity{display:block}
.identity button{margin-left:0}
}

@media(max-width:540px){section{padding:20px}
header h1 span{display:block;margin-left:0}
#connect{margin:0 auto 20px}
}