/* Gemeinsamer Stil für alle Auth-/Onboarding-Seiten.
   Vorher: ~13 verschiedene Inline-<style>-Blöcke mit subtil
   abweichenden Werten. Jetzt eine Datei, die der Browser cached. */

*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  background:#f0f2f5;color:#1a1a2e;
  min-height:100vh;padding:16px;
  display:flex;align-items:center;justify-content:center;
}
.auth-box{
  background:#fff;border-radius:12px;
  box-shadow:0 2px 16px rgba(0,0,0,.1);
  padding:32px 28px;width:100%;max-width:420px;
}
.auth-box.wide{max-width:460px}
.auth-box.center{text-align:center}
.auth-box h1{font-size:20px;color:#1a1a2e;font-weight:600;margin:0 0 12px}
.auth-box h1.lg{font-size:22px;margin-bottom:8px}
.auth-box h1.error{color:#c00}
.auth-sub{color:#888;font-size:13px;margin:0 0 24px;line-height:1.5}
.auth-box label{display:block;font-size:13px;color:#555;margin-bottom:6px;font-weight:500}
.auth-box input{
  width:100%;padding:13px 14px;border:1px solid #ddd;border-radius:8px;
  font-size:16px;margin-bottom:16px;outline:none;-webkit-appearance:none;
  font-family:inherit;
}
.auth-box input:focus{border-color:#1a1a2e}
.auth-box input.code{
  padding:18px 14px;border-width:1.5px;font-size:32px;
  text-align:center;letter-spacing:10px;
}
.auth-box button{
  width:100%;padding:15px;background:#1a1a2e;color:#fff;
  border:none;border-radius:8px;font-size:16px;cursor:pointer;font-weight:600;
  -webkit-appearance:none;font-family:inherit;
}
.auth-box button:hover{background:#2d2d4e}
.auth-error{background:#fee;color:#c00;border-radius:8px;padding:10px 14px;font-size:13px;margin-bottom:16px}
.auth-success{background:#e8f5e9;color:#2e7d32;border-radius:8px;padding:16px;font-size:14px;line-height:1.5;margin-bottom:16px}
.auth-warn{
  background:#fff3cd;border-left:4px solid #ffc107;
  padding:12px 16px;border-radius:0 6px 6px 0;
  font-size:13px;color:#555;margin-bottom:20px;
}
.auth-hint{font-size:12px;color:#aaa;margin-top:4px}
.auth-hint.center{text-align:center;margin-top:16px}
.auth-text{color:#555;font-size:14px;line-height:1.6;margin-bottom:8px}
.auth-link{display:block;text-align:center;margin-top:20px;color:#888;font-size:13px;text-decoration:none}
.auth-link:hover{color:#1a1a2e}
.auth-cta{
  display:block;padding:14px;background:#1a1a2e;color:#fff;
  border-radius:8px;text-decoration:none;font-weight:600;font-size:16px;
  text-align:center;margin-top:16px;
}
.auth-cta:hover{background:#2d2d4e}
.auth-icon{font-size:48px;margin-bottom:16px}
/* Setup-2FA: QR + Secret + Schritt-Liste */
.auth-qr{text-align:center;margin:20px 0}
.auth-qr img{width:200px;height:200px}
.auth-secret{background:#f5f5f5;border-radius:6px;padding:10px 14px;font-family:monospace;font-size:13px;word-break:break-all;margin:12px 0}
.auth-steps{counter-reset:step;list-style:none;padding:0;margin-bottom:8px}
.auth-steps li{
  counter-increment:step;padding:6px 0 6px 32px;position:relative;
  font-size:13px;color:#555;
}
.auth-steps li:before{
  content:counter(step);position:absolute;left:0;top:4px;
  width:22px;height:22px;background:#1a1a2e;color:#fff;border-radius:50%;
  font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;
}
/* Backup-Codes-Grid */
.auth-codes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:20px 0}
.auth-codes .code{
  background:#f5f5f5;border-radius:6px;padding:10px;
  font-family:monospace;font-size:15px;text-align:center;letter-spacing:2px;
}