@import url('/fonts/fonts.css');
/* ==========================================================================
   Eigenständige Seiten (Anmeldung, Zugriffs-Zustimmung) im Marken-Bild.
   Dieselbe Palette wie crm.css — hier aber ohne dessen Layout-Ballast,
   weil diese Seiten aus einer einzelnen Karte bestehen.
   ========================================================================== */
:root{
  --ink:#12151A;--paper:#FAF7F2;--line:#E5DFD4;--line2:#D8D0C2;
  --tx2:#5C5850;--tx3:#8A8378;
  --red:#F0402D;--red-deep:#D2311F;
  --r:18px;
}
*{box-sizing:border-box;margin:0}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:var(--paper);color:var(--ink);
  min-height:100vh;display:grid;place-items:center;padding:1.5rem;
  -webkit-font-smoothing:antialiased;line-height:1.6;
}
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r);
  padding:2.5rem;width:100%;max-width:420px;
  box-shadow:0 1px 2px rgba(18,21,26,.04),0 12px 32px rgba(18,21,26,.07);
}
.brand{
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:1.4rem;
  letter-spacing:-.5px;margin-bottom:.35rem;
}
.brand i{color:var(--red);font-style:normal}
h1{font-family:'Space Grotesk',sans-serif;font-size:1.25rem;font-weight:600;letter-spacing:-.3px;margin-bottom:.4rem}
.sub{color:var(--tx2);font-size:.9rem;margin-bottom:1.75rem}
label{display:block;font-size:.8rem;font-weight:600;margin-bottom:.35rem;color:var(--ink)}
input[type=email],input[type=password]{
  width:100%;padding:.7rem .9rem;margin-bottom:1.1rem;
  border:1px solid var(--line2);border-radius:12px;font-size:1rem;
  font-family:inherit;color:var(--ink);background:#fff;
}
input::placeholder{color:var(--tx3)}
input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(240,64,45,.15)}
.remember{display:flex;align-items:center;gap:.5rem;font-size:.875rem;margin-bottom:1.4rem;color:var(--tx2)}
.remember input{accent-color:var(--red)}
button,.btn{
  width:100%;padding:.75rem;border:0;border-radius:999px;
  background:var(--red);color:#fff;font-size:.95rem;font-weight:600;
  font-family:'Space Grotesk',sans-serif;cursor:pointer;transition:background .12s;
}
button:hover,.btn:hover{background:var(--red-deep)}
.btn-quiet{background:#fff;color:var(--ink);border:1px solid var(--line2)}
.btn-quiet:hover{background:var(--paper)}
.errors{
  background:#FBEDEA;border:1px solid #F2C4BC;border-radius:12px;
  color:var(--red-deep);font-size:.875rem;padding:.7rem .9rem;margin-bottom:1.1rem;
}
.who{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:.7rem .9rem;font-size:.875rem;margin-bottom:1.4rem}
.scopes{list-style:none;padding:0;margin:0 0 1.6rem}
.scopes li{padding:.6rem .8rem;border:1px solid var(--line);border-radius:12px;margin-bottom:.5rem;font-size:.9rem}
.scopes strong{display:block;font-size:.7rem;color:var(--tx3);font-weight:600;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.15rem}
.actions{display:flex;gap:.75rem}
.actions form{flex:1}
.hint{font-size:.8rem;color:var(--tx3);margin:1.2rem 0 0;line-height:1.55}