:root{
  --bg:#000;
  --fg:#fff;
  --muted:rgba(255,255,255,.70);
  --faint:rgba(255,255,255,.40);
  --line:rgba(255,255,255,.22);
}

*{ box-sizing:border-box; }

html,body{
  height:100%;
  margin:0;
  background:var(--bg);
  color:var(--fg);
  font-family: "Times New Roman", Times, serif;
}

.wrap{
  min-height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:80px 24px;
}

.card{
  width: min(760px, 100%);
  border:1px solid var(--line);
  padding:44px 44px 38px;
}

h1{
  margin:0 0 22px 0;
  font-size:28px;
  font-weight:400;
  text-align:center;
  letter-spacing:.5px;
}

.p{
  margin:0 0 14px 0;
  font-size:16px;
  line-height:1.6;
  color:var(--fg);
}

.muted{ color:var(--muted); }

.hr{
  height:1px;
  background:var(--line);
  margin:26px 0 22px;
}

.form{
  margin-top:18px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.input{
  flex: 1 1 260px;
  background:transparent;
  border:1px solid var(--line);
  color:var(--fg);
  padding:12px 14px;
  font-size:16px;
  outline:none;
}

.input::placeholder{ color:var(--faint); }

.btn{
  flex: 0 0 auto;
  background:transparent;
  border:1px solid var(--fg);
  color:var(--fg);
  padding:12px 18px;
  font-size:16px;
  cursor:pointer;
}

.btn:hover{
  background:var(--fg);
  color:var(--bg);
}

.small{
  margin-top:14px;
  font-size:13px;
  line-height:1.5;
  color:var(--muted);
}