:root{
  --navy:#0B152C; --navy-2:#132340; --navy-3:#1D3153;
  --bone:#F4F1EB; --bone-2:#EBE6DD;
  --bronze:#9C7C4E; --bronze-lt:#C2A272;
  --ink:#0E2132; --muted:#6B7885; --line:#DAD3C6; --danger:#9E3B32;
  --disp:"Sohne Breit","Söhne Breit","Archivo",-apple-system,Segoe UI,sans-serif;
  --body:"Sohne","Söhne","Inter",-apple-system,Segoe UI,sans-serif;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{
  background:var(--navy);color:var(--bone);font-family:var(--body);font-size:14px;line-height:1.5;
  display:grid;place-items:center;padding:24px;-webkit-font-smoothing:antialiased;
}
.card{width:100%;max-width:380px}
.brand{display:flex;align-items:center;gap:14px;margin-bottom:26px}
.brand img{height:20px;width:auto;display:block}
.brand span{
  font-family:var(--disp);font-stretch:125%;font-weight:700;letter-spacing:.22em;font-size:12px;
  text-transform:uppercase;border-left:1px solid rgba(255,255,255,.22);padding-left:14px
}
h1{font-family:var(--disp);font-stretch:125%;font-size:23px;font-weight:600;margin:0 0 6px}
.sub{color:rgba(244,241,235,.55);font-size:12.5px;margin:0 0 22px}
label{display:block;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--bronze-lt);margin:0 0 6px}
input{
  width:100%;background:rgba(255,255,255,.05);border:1px solid rgba(244,241,235,.18);border-radius:3px;
  color:var(--bone);padding:10px 12px;font:inherit;margin-bottom:14px
}
input:focus{outline:none;border-color:var(--bronze)}
button{
  width:100%;background:var(--bronze);border:0;border-radius:3px;color:#12203a;font:inherit;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;font-size:12px;padding:11px;cursor:pointer
}
button:hover{background:var(--bronze-lt)}
button[disabled]{opacity:.5;cursor:default}
.alt{margin-top:18px;font-size:12.5px;color:rgba(244,241,235,.5);text-align:center}
.alt a{color:var(--bronze-lt);cursor:pointer;text-decoration:underline}
.msg{
  display:none;border-radius:3px;padding:9px 11px;font-size:12.5px;margin-bottom:14px;
  background:rgba(158,59,50,.16);border:1px solid rgba(158,59,50,.5);color:#F0B7B1
}
.msg.show{display:block}
.msg.good{background:rgba(63,125,92,.16);border-color:rgba(63,125,92,.5);color:#AFD9C2}
.foot{margin-top:30px;text-align:center;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(244,241,235,.28)}