/* Anmeldung, Registrierung, Zwei-Faktor – Grundlagen und Farben kommen aus ui.css */
body{min-height:100vh;padding:env(safe-area-inset-top,0) 16px env(safe-area-inset-bottom,0);background:
  radial-gradient(1200px 500px at 50% -200px,color-mix(in srgb,var(--accent) 16%,transparent),transparent),var(--bg)}
.wrap{max-width:440px;margin:0 auto;padding-block:48px 32px;display:flex;flex-direction:column;gap:20px}
.brand{display:flex;gap:12px;align-items:center;font-family:var(--display);font-size:1.35rem}
.brand small{display:block;font-family:var(--body);font-size:.88rem;color:var(--ink-2);font-weight:400}
.brand-mark{width:44px;height:44px;border-radius:11px}
.brand picture{display:block}
.brand-logo{display:block;height:56px;width:auto;max-width:min(300px,100%);object-fit:contain;object-position:left center}
.brand.has-logo{flex-direction:column;align-items:flex-start;gap:6px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:26px;display:flex;flex-direction:column;gap:14px;box-shadow:var(--shadow)}
h1{font-size:1.65rem}
label{display:flex;flex-direction:column;gap:5px;font-size:.9rem;font-weight:700;color:var(--ink-2)}
input:not([type=checkbox]):not([type=radio]){color:var(--ink);background:var(--surface);border:1px solid var(--line-strong);border-radius:var(--r-s);padding:10px 12px;font-weight:400;width:100%}
input:not([type=checkbox]):not([type=radio]):focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 25%,transparent);outline:none}
input.mono{font-family:var(--mono);letter-spacing:.1em}
.card .btn{width:100%;padding:11px 16px;border-color:var(--accent);background:var(--accent);color:var(--accent-ink)}
.card .btn:hover{filter:brightness(1.1)}
.card .btn.ghost{background:none;color:var(--accent);border-color:var(--line-strong)}
.card .btn.ghost:hover{background:var(--accent-soft);filter:none}
.btn:disabled{cursor:wait}
.links{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:.94rem}
button.link{text-decoration:underline}
.err,.ok{padding:11px 14px;border-radius:10px;font-size:.95rem;border:1px solid;border-left-width:4px}
.err{background:var(--bad-soft);color:var(--bad);border-color:var(--bad)}
.ok{background:var(--ok-soft);color:var(--ok);border-color:var(--ok)}
.banner{background:var(--warn-soft);color:var(--warn);padding:10px 14px;border-radius:10px;font-weight:700;font-size:.92rem;border:1px solid var(--warn)}
.codes{font-family:var(--mono);background:var(--surface-2);padding:12px;border-radius:var(--r-s);columns:2;white-space:pre;border:1px solid var(--line)}
.key{font-family:var(--mono);word-break:break-all;font-size:.9rem}
.foot{font-size:.84rem;color:var(--ink-2);text-align:center}
.welcome{margin:-6px 0 0;color:var(--ink-2);white-space:pre-line}