:root{
  --navy:#0F1B2D;
  --navy-2:#16263D;
  --brass:#C6A15B;
  --brass-soft:#F1E6CC;
  --ink:#12213D;
  --ink-soft:#5B6A85;
  --paper:#F4F1EA;
  --white:#FFFFFF;
  --line:#E1E7F1;
  --bad:#D8455B;
  --bad-soft:#FCEAEC;
  --font-display:'Space Grotesk',sans-serif;
  --font-body:'Inter',sans-serif;
  --font-mono:'JetBrains Mono',monospace;
}
*{box-sizing:border-box;}
.auth-body{
  margin:0; min-height:100vh;
  font-family:var(--font-body); color:var(--ink);
  display:flex; align-items:center; justify-content:center; padding:24px;
  background:
    radial-gradient(1100px 600px at 15% -10%, rgba(198,161,91,.18), transparent 55%),
    radial-gradient(900px 500px at 100% 110%, rgba(47,111,237,.12), transparent 55%),
    var(--navy);
}
.auth-card{
  width:100%; max-width:400px;
  background:var(--white);
  border-radius:20px;
  padding:36px 34px 30px;
  box-shadow:0 30px 80px -30px rgba(0,0,0,.6);
}
.auth-brand{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:700; font-size:18px;
  color:var(--navy); text-decoration:none; margin-bottom:22px;
  letter-spacing:-.01em;
}
.qs-diamond{
  width:22px; height:22px; flex:0 0 auto;
  background:conic-gradient(from 45deg, var(--brass) 0 25%, var(--navy) 0 50%, var(--brass) 0 75%, var(--navy) 0 100%);
  transform:rotate(45deg); border-radius:4px;
}
.auth-card h1{
  font-family:var(--font-display); font-size:26px; margin:0 0 6px; letter-spacing:-.02em;
}
.auth-sub{ color:var(--ink-soft); font-size:14px; margin:0 0 22px; line-height:1.5; }
.auth-form{ display:flex; flex-direction:column; gap:15px; }
.auth-form label{
  display:flex; flex-direction:column; gap:6px;
  font-size:13px; font-weight:600; color:var(--ink-soft);
}
.auth-form .hint{ font-weight:400; color:var(--ink-soft); opacity:.75; }
.auth-form input{
  font-family:var(--font-body); font-size:15px; color:var(--ink);
  padding:12px 14px; border:1px solid var(--line); border-radius:11px; outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.auth-form input:focus{
  border-color:var(--brass);
  box-shadow:0 0 0 3px rgba(198,161,91,.22);
}
.auth-btn{
  margin-top:6px; display:inline-block; text-align:center; text-decoration:none;
  font-family:var(--font-display); font-weight:600; font-size:15px;
  color:var(--navy); background:var(--brass);
  padding:13px 18px; border:none; border-radius:11px; cursor:pointer;
  transition:transform .12s ease, filter .12s ease;
}
.auth-btn:hover{ transform:translateY(-1px); filter:brightness(1.05); }
.auth-error{
  background:var(--bad-soft); color:var(--bad);
  border:1px solid var(--bad); border-radius:10px;
  padding:11px 14px; font-size:13px; font-weight:600; margin-bottom:18px;
}
.auth-foot{ margin:20px 0 0; font-size:12.5px; color:var(--ink-soft); text-align:center; }
.setup-steps{ font-size:14px; color:var(--ink-soft); line-height:1.7; padding-left:18px; }
.setup-steps code, .auth-card code{
  font-family:var(--font-mono); font-size:12.5px;
  background:var(--paper); padding:1px 6px; border-radius:5px; color:var(--navy);
}
