
html,body{
  margin:0;
  min-height:100%;
  background:#000;
  color:#888;
  font-family:Arial,Helvetica,sans-serif;
}
*{box-sizing:border-box}
.dc431-shell{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
}
.dc431-box{
  width:min(410px,100%);
  padding:30px;
  background:#020202;
  border:1px solid #080808;
}
.dc431-kicker{
  color:#666;
  font-size:9px;
  letter-spacing:.22em;
}
.dc431-box h1{
  margin:7px 0 3px;
  color:#b7b7b7;
  font-size:30px;
  font-weight:400;
}
.dc431-sub{
  margin:0 0 21px;
  color:#5d5d5d;
  font-size:11px;
}
.dc431-switch{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  margin-bottom:18px;
  background:#101010;
}
.dc431-switch a{
  min-height:43px;
  display:grid;
  place-items:center;
  background:#050505;
  color:#666;
  text-decoration:none;
  font-size:11px;
}
.dc431-switch a:hover{
  color:#aaa;
  background:#080808;
}
.dc431-switch a.active{
  color:#c0c0c0;
  background:#0a0a0a;
  box-shadow:inset 0 -1px 0 #777;
}
.dc431-error{
  margin-bottom:12px;
  padding:10px;
  background:#100505;
  color:#bd7777;
  font-size:10px;
}
.dc431-form{
  display:grid;
  gap:11px;
}
.dc431-form label{
  color:#686868;
  font-size:10px;
}
.dc431-form input{
  display:block;
  width:100%;
  min-height:45px;
  margin-top:5px;
  padding:10px 11px;
  border:1px solid #151515;
  border-radius:0;
  outline:none;
  background:#050505;
  color:#b0b0b0;
  font:14px Arial,Helvetica,sans-serif;
}
.dc431-form input:focus{
  border-color:#3a3a3a;
}
.dc431-form button{
  min-height:46px;
  margin-top:3px;
  border:1px solid #181818;
  border-radius:0;
  background:#090909;
  color:#aaa;
  cursor:pointer;
  font:12px Arial,Helvetica,sans-serif;
}
.dc431-form button:hover{
  color:#fff;
  border-color:#383838;
}
.dc431-back{
  display:block;
  margin-top:18px;
  color:#5d5d5d;
  text-decoration:none;
  font-size:9px;
  text-align:center;
}
.dc431-back:hover{color:#999}

/* suppress browser autofill yellow */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active{
  -webkit-text-fill-color:#b0b0b0!important;
  -webkit-box-shadow:0 0 0 1000px #050505 inset!important;
  box-shadow:0 0 0 1000px #050505 inset!important;
  caret-color:#b0b0b0!important;
}
input:autofill{
  background:#050505!important;
  color:#b0b0b0!important;
}
@media(max-width:520px){
  .dc431-shell{padding:13px}
  .dc431-box{
    width:100%;
    padding:22px 16px;
  }
  .dc431-box h1{font-size:27px}
  .dc431-form input,
  .dc431-form button{
    min-height:50px;
  }
}
