/* Anmelde- und Kontoseiten im Erscheinungsbild der Portal-Oberfläche (Farben, Schrift, Karten, Knöpfe der Referenz). */
:root{--ink:#252b48;--muted:#737b96;--line:#e5e7f1;--purple:#6961df;--teal:#119c9a;--red:#d3617a;--amber:#b87a20;--font:Inter,"Segoe UI",system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:24px;background:#f0f2f9;color:var(--ink);font-family:var(--font);font-size:14px;line-height:1.5}
body:before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(ellipse at 80% 0,#d9dcf9b5,transparent 52%),radial-gradient(ellipse at 10% 80%,#d5eeef66,transparent 40%);pointer-events:none}
a{color:var(--purple)}
.auth-card{width:100%;max-width:420px;background:rgba(255,255,255,.86);border:1px solid var(--line);border-radius:19px;box-shadow:0 7px 30px #45477d14;padding:28px}
/* Markenlockup wie die Seitenleiste des Portals: Logo der Referenz (/ui/logo.svg), darunter „KUNDENPORTAL“ */
.brand{margin-bottom:20px}
.brand-logo{display:block;width:100%;max-width:230px;height:auto}
.brand small{display:block;margin:6px 0 0 calc(min(230px,100%) * .303);font-size:8px;line-height:1.2;font-weight:650;letter-spacing:2.65px;color:var(--muted)}
h1{font-size:20px;margin:0 0 14px}
p{margin:0 0 12px}
.muted{color:var(--muted);font-size:13px}
form{display:grid;gap:12px}
label{display:grid;gap:5px;font-weight:550;font-size:13px}
input{font:inherit;color:inherit;border:1px solid #dce0ee;border-radius:9px;padding:10px 12px;background:#fff}
input:focus{outline:2px solid #a9a5f3;outline-offset:1px}
button,.btn{font:inherit;border:1px solid #dce0ee;background:rgba(255,255,255,.8);border-radius:9px;padding:10px 14px;font-weight:600;cursor:pointer;text-decoration:none;color:inherit;display:inline-flex;justify-content:center}
button.primary,.btn.primary{color:#fff;background:var(--purple);border-color:var(--purple);box-shadow:0 4px 12px #6961df25}
button:disabled{opacity:.5;cursor:not-allowed}
button:focus-visible,a:focus-visible{outline:3px solid #aaa6f5;outline-offset:3px}
.links{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:14px;font-size:13px}
.message{border-radius:10px;padding:10px 12px;background:#eef7f6;color:#0b6f6d}
.message.error{background:#fbeef1;color:#a8334f}
.secret{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:15px;letter-spacing:.06em;background:#f4f5fb;border:1px dashed #cfd3e6;border-radius:9px;padding:10px 12px;word-break:break-all;user-select:all}
.codes{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 12px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;margin:0 0 12px;padding:0;list-style:none}
dl{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:0 0 14px}
dt{color:var(--muted)}
dd{margin:0;font-weight:550}
.auth-footer{color:var(--muted);font-size:12px;text-align:center}