.login{display:grid;grid-template-columns:minmax(340px,.82fr) minmax(520px,1.18fr);grid-template-areas:"art form";gap:14px;align-items:stretch;width:min(980px,100%);justify-self:center}
.login>div,.login form,.login aside{padding:25px;background:var(--surface);border:1px solid var(--line)}
.login>div{background:transparent;border-left:0}
.login>div>small{color:var(--lime);letter-spacing:.16em}
.login h1{font-size:2rem;margin:.3em 0}
.login p{color:var(--muted)}
.login form{grid-area:form;display:grid;grid-template-columns:1fr 1fr;gap:14px 18px;align-content:center}
.login-heading>small{color:var(--lime);letter-spacing:.16em}
.login-heading,.login form>p,.login form>button{grid-column:1/-1}
.login>.connection-art{grid-area:art;padding:0;align-self:start}
.login label{display:grid;gap:7px;color:var(--muted)}
.login input{min-height:48px;border:1px solid var(--line);background:#09120f;color:var(--ink);padding:0 14px;font:inherit}
.login button{min-height:48px;border:0;background:var(--lime);color:#101915;font-weight:700}
.login button:disabled{opacity:.4}
.login aside small{color:var(--muted)}
#login-error{color:#ff927e;margin:0}
@media(max-width:950px){.login{grid-template-columns:minmax(260px,.72fr) minmax(420px,1.28fr);grid-template-areas:"art form"}
}
@media(max-width:720px){.login{grid-template-columns:1fr;grid-template-areas:"art" "form"}
.login>.connection-art{width:min(100%,390px);justify-self:center}
.login form{grid-template-columns:1fr}
.login-heading,.login form>p,.login form>button{grid-column:1}
}
