:root{--anmeldung-oben: clamp(var(--s-8), 11vh, 112px);--anmeldung-breite: 420px}body.ohne-menue main{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-block-size:100vh;padding:var(--anmeldung-oben) var(--s-4) var(--s-12);box-sizing:border-box}@supports (min-block-size: 100dvh){body.ohne-menue main{min-block-size:100dvh}}body.portal.portal-offen main.portal-inhalt{padding-block-start:var(--anmeldung-oben);display:flex;flex-direction:column;align-items:center}.karte.anmeldung,body.portal .karte.anmeldung{inline-size:100%;max-inline-size:var(--anmeldung-breite);margin:0 auto;box-sizing:border-box;padding:var(--s-8) var(--s-8) var(--s-6);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-karte);box-shadow:none;text-align:start}.karte.anmeldung.app-einrichten,.karte.anmeldung.fehlerseite{max-inline-size:var(--anmeldung-breite)}.karte.anmeldung .anmeldung-marke{display:block;block-size:36px;inline-size:auto;max-inline-size:100%;margin:0 auto var(--s-6)}.karte.anmeldung .anmeldung-betrieb{display:flex;justify-content:center;align-items:center;block-size:28px;margin:0 0 var(--s-6);font-size:var(--schrift-20);line-height:var(--zeile-20);font-weight:600;letter-spacing:var(--sperrung-20);color:var(--portal-farbe, var(--primary))}.karte.anmeldung .anmeldung-betrieb img{display:block;block-size:28px;inline-size:auto;max-inline-size:200px}.karte.anmeldung .anmeldung-kopf,body.portal .karte.anmeldung .anmeldung-kopf{text-align:center;margin:0 0 var(--s-6)}.karte.anmeldung .anmeldung-kopf h1,body.portal .karte.anmeldung .anmeldung-kopf h1{margin:0;font-family:var(--schrift-titel);font-weight:500;font-size:var(--schrift-24);line-height:var(--zeile-24);letter-spacing:var(--sperrung-24);color:var(--text);text-wrap:balance}.karte.anmeldung .anmeldung-kopf .unterzeile,body.portal .karte.anmeldung .anmeldung-kopf .unterzeile{margin:var(--s-2) 0 0;font-size:var(--schrift-14);line-height:var(--zeile-14);font-weight:400;color:var(--text-muted);text-wrap:pretty}.karte.anmeldung .fehler-code{margin:0 0 var(--s-2);font-size:var(--schrift-12);line-height:var(--zeile-12);font-weight:600;letter-spacing:.04em;color:var(--text-muted);font-variant-numeric:var(--ziffern)}.karte.anmeldung :is(.anmeldung-formular,form.portal-formular){display:flex;flex-direction:column;gap:var(--s-4);margin:0}.karte.anmeldung :is(.anmeldung-feld,form.portal-formular>div){display:flex;flex-direction:column;gap:var(--s-2);margin:0;min-inline-size:0}.karte.anmeldung :is(.anmeldung-feld,form.portal-formular>div)>label:not(.inline){margin:0;font-size:var(--schrift-13);line-height:var(--zeile-13);font-weight:600;color:var(--text)}.karte.anmeldung :is(input[type=email],input[type=password],input[type=text],input:not([type])){inline-size:100%;max-inline-size:none;min-block-size:44px;block-size:44px;margin:0;box-sizing:border-box;font-size:var(--schrift-14)}.karte.anmeldung input.portal-codefeld.gross,.karte.anmeldung input.codefeld{font-size:var(--schrift-20);text-align:center;letter-spacing:.2em;font-variant-numeric:var(--ziffern)}.karte.anmeldung input.portal-codefeld:not(.gross){font-family:var(--schrift-mono);letter-spacing:.06em}.karte.anmeldung ::placeholder{color:var(--text-subtle);opacity:1}@media(max-width:900px){.karte.anmeldung :is(input[type=email],input[type=password],input[type=text],input:not([type])){font-size:var(--schrift-16)}}.passwort-huelle{position:relative;display:block}.karte.anmeldung .passwort-huelle>input{padding-inline-end:48px}.karte.anmeldung .passwort-huelle>button.passwort-zeigen{position:absolute;inset-block:2px;inset-inline-end:2px;inline-size:40px;block-size:auto;min-block-size:0;display:grid;place-items:center;margin:0;padding:0;border:0;border-radius:var(--radius-kontrolle);background:transparent;color:var(--text-muted);box-shadow:none;cursor:pointer}.karte.anmeldung .passwort-huelle>button.passwort-zeigen[hidden]{display:none}.karte.anmeldung .passwort-huelle>button.passwort-zeigen:hover{background:var(--surface-hover);color:var(--text)}.karte.anmeldung .passwort-huelle>button.passwort-zeigen:focus-visible{outline:3px solid var(--focus);outline-offset:-3px}.karte.anmeldung .passwort-huelle>button.passwort-zeigen[aria-pressed=true]::after{content:"";position:absolute;inline-size:22px;block-size:1.5px;background:currentColor;transform:rotate(-45deg);border-radius:var(--radius-voll)}.karte.anmeldung .feststell-hinweis{margin:0;display:flex;align-items:center;gap:var(--s-1);font-size:var(--schrift-13);line-height:var(--zeile-13);color:var(--warning);font-weight:500}.karte.anmeldung .feststell-hinweis[hidden]{display:none}body.portal .karte.anmeldung .portal-haken{gap:var(--s-1)}body.portal .karte.anmeldung .portal-haken label.inline{display:flex;align-items:center;gap:var(--s-2);min-block-size:44px;padding:0;margin:0;font-size:var(--schrift-14);line-height:var(--zeile-14);font-weight:400;color:var(--text);cursor:pointer}body.portal .karte.anmeldung .portal-haken label.inline input{inline-size:20px;block-size:20px;margin:0;flex:none;accent-color:var(--portal-farbe)}body.portal .karte.anmeldung .portal-haken .hinweis{margin:calc(-1 * var(--s-2)) 0 0 28px;font-size:var(--schrift-13);line-height:var(--zeile-13)}.karte.anmeldung :is(.anmeldung-knopf,.formularfuss>button,.formularfuss>.knopf,.anmeldung-aktionen>.knopf,.anmeldung-aktionen>button){display:flex;align-items:center;justify-content:center;inline-size:100%;min-block-size:44px;block-size:44px;margin:0;padding:0 var(--s-4);box-sizing:border-box;border-radius:var(--radius-kontrolle);font-size:var(--schrift-14);line-height:var(--zeile-14);font-weight:600;text-align:center;text-decoration:none;box-shadow:none}.karte.anmeldung .formularfuss,body.portal .karte.anmeldung .formularfuss{display:flex;flex-direction:column;gap:var(--s-2);margin:var(--s-1) 0 0;padding:0;border:0;background:transparent;position:static}.karte.anmeldung .anmeldung-aktionen{display:flex;flex-direction:column;gap:var(--s-2);margin:var(--s-2) 0 0}.karte.anmeldung .anmeldung-aktionen>[hidden]{display:none}.karte.anmeldung :is(.anmeldung-aktionen,.formularfuss)>:is(a.knopf.leise,button.leise){background:transparent;border-color:transparent;color:var(--portal-farbe, var(--primary))}.karte.anmeldung :is(.anmeldung-aktionen,.formularfuss)>:is(a.knopf.leise,button.leise):hover{background:var(--surface-hover)}.karte.anmeldung .anmeldung-weg{margin:var(--s-4) 0 0;text-align:center;font-size:var(--schrift-13);line-height:var(--zeile-13);font-weight:600}.karte.anmeldung .anmeldung-weg a{display:inline-flex;align-items:center;min-block-size:24px;text-decoration:none}.karte.anmeldung .anmeldung-weg a:is(:hover,:focus-visible){text-decoration:underline}.karte.anmeldung :is(.anmeldung-fuss,.portal-anmeldung-fuss){margin:var(--s-6) 0 0;padding:var(--s-4) 0 0;border-block-start:1px solid var(--border);display:flex;flex-direction:column;gap:var(--s-1);text-align:center;font-size:var(--schrift-13);line-height:var(--zeile-13);font-weight:400;color:var(--text-muted)}.karte.anmeldung :is(.anmeldung-fuss,.portal-anmeldung-fuss) p{margin:0}.karte.anmeldung :is(.anmeldung-fuss,.portal-anmeldung-fuss) a{font-weight:600;text-decoration:none}.karte.anmeldung :is(.anmeldung-fuss,.portal-anmeldung-fuss) a:is(:hover,:focus-visible){text-decoration:underline}.karte.anmeldung .portal-oder{display:flex;align-items:center;gap:var(--s-3);margin:var(--s-6) 0 var(--s-4);font-size:var(--schrift-13);line-height:var(--zeile-13);color:var(--text-muted);font-weight:500}.karte.anmeldung .portal-oder::before,.karte.anmeldung .portal-oder::after{content:"";flex:1 1 auto;block-size:1px;background:var(--border)}.karte.anmeldung>p.anmeldung-text{margin:0 0 var(--s-4);font-size:var(--schrift-14);line-height:var(--zeile-14);color:var(--text);text-wrap:pretty}.karte.anmeldung>p.anmeldung-text.leise,.karte.anmeldung form>p.hinweis{color:var(--text-muted);font-size:var(--schrift-13);line-height:var(--zeile-13)}.karte.anmeldung form>p.hinweis{margin:calc(-1 * var(--s-2)) 0 0}.karte.anmeldung>.fehler,.karte.anmeldung>.meldung,.karte.anmeldung>.warnung{margin:0 0 var(--s-4)}.anmeldung-fussnote{inline-size:100%;max-inline-size:var(--anmeldung-breite);margin:var(--s-4) auto 0;padding:0 var(--s-2);box-sizing:border-box;text-align:center;font-size:var(--schrift-12);line-height:var(--zeile-12);color:var(--text-muted);text-wrap:balance}.karte.anmeldung ol.einrichten-schritte{list-style:none;counter-reset:schritt;margin:0;padding:0;display:flex;flex-direction:column;gap:var(--s-4)}.karte.anmeldung ol.einrichten-schritte>li{counter-increment:schritt;position:relative;display:flex;flex-direction:column;gap:var(--s-2);padding:0 0 var(--s-4) 40px;border-block-end:1px solid var(--border);min-inline-size:0}.karte.anmeldung ol.einrichten-schritte>li:last-child{border-block-end:0;padding-block-end:0}.karte.anmeldung ol.einrichten-schritte>li::before{content:counter(schritt);position:absolute;inset-inline-start:0;inset-block-start:0;display:grid;place-items:center;inline-size:24px;block-size:24px;border-radius:var(--radius-voll);background:var(--primary-subtle);color:var(--primary-hover);font-size:var(--schrift-12);font-weight:600;font-variant-numeric:var(--ziffern)}.karte.anmeldung ol.einrichten-schritte>li>strong{font-size:var(--schrift-14);line-height:var(--zeile-14);font-weight:600}.karte.anmeldung ol.einrichten-schritte .hinweis{margin:0;font-size:var(--schrift-13);line-height:var(--zeile-13);color:var(--text-muted)}.karte.anmeldung .einrichten-knoepfe{display:flex;flex-wrap:wrap;gap:var(--s-2)}.karte.anmeldung .einrichten-knoepfe .knopf{min-block-size:40px;flex:1 1 auto;justify-content:center}.karte.anmeldung .einrichten-knoepfe .knopf.hauptknopf{flex-basis:100%;min-block-size:44px}.karte.anmeldung ol.einrichten-schritte .onboarding-mail{font-family:var(--schrift-mono);font-size:var(--schrift-12);line-height:var(--zeile-12);padding:var(--s-2) var(--s-3);background:var(--surface-subtle);border-radius:var(--radius-kontrolle);overflow-wrap:anywhere}.karte.anmeldung.fehlerseite{text-align:center}.karte.anmeldung.fehlerseite [data-fehlergrund]{margin:0 0 var(--s-4);font-size:var(--schrift-13);line-height:var(--zeile-13);color:var(--text-muted)}@media(max-width:600px){:root{--anmeldung-oben: var(--s-6)}.karte.anmeldung,body.portal .karte.anmeldung{padding:var(--s-6) var(--s-4) var(--s-5)}body.ohne-menue main{padding-inline:var(--s-4)}}.karte.anmeldung.anmeldung-web-login .passwort-huelle>button.passwort-zeigen{inset-block:0;inset-inline-end:0;inline-size:calc(var(--s-10) + var(--s-1));block-size:calc(var(--s-10) + var(--s-1))}.karte.anmeldung.anmeldung-web-login .anmeldung-weg>a,.karte.anmeldung.anmeldung-web-login .anmeldung-fuss a{display:inline-flex;align-items:center;min-block-size:calc(var(--s-10) + var(--s-1))}@media(prefers-color-scheme:dark){:root:not([data-theme]) .karte.anmeldung.anmeldung-web-login .anmeldung-marke{content:url(/static/marke/logo-quer-hell.svg)}}.karte.anmeldung.anmeldung-web-login .anmeldung-knopf[aria-busy=true]{position:relative;cursor:progress}.karte.anmeldung.anmeldung-web-login .anmeldung-knopf[aria-busy=true]::after{content:"";display:inline-block;inline-size:var(--s-3);block-size:var(--s-3);margin-inline-start:var(--s-2);flex:none;border-radius:var(--radius-voll);border:calc(var(--rand-breite) * 2) solid currentColor;border-inline-end-color:transparent;animation:k2-drehen calc(var(--dauer-3) * 4) linear infinite}@media(prefers-reduced-motion:reduce){.karte.anmeldung.anmeldung-web-login .anmeldung-knopf[aria-busy=true]::after{animation:none}}@media(max-width:900px){.karte.anmeldung.anmeldung-web-login .anmeldung-feld>input[type=email]{font-size:var(--schrift-16)}}.karte.anmeldung.anmeldung-web-reset .passwort-huelle>button.passwort-zeigen{inset-block:0;inset-inline-end:0;inline-size:calc(var(--s-10) + var(--s-1));block-size:calc(var(--s-10) + var(--s-1))}.karte.anmeldung.anmeldung-web-reset .anmeldung-weg>a{display:inline-flex;align-items:center;min-block-size:calc(var(--s-10) + var(--s-1))}@media(prefers-color-scheme:dark){:root:not([data-theme]) .karte.anmeldung.anmeldung-web-reset .anmeldung-marke{content:url(/static/marke/logo-quer-hell.svg)}}.karte.anmeldung.anmeldung-web-forgot .anmeldung-weg>a{min-block-size:calc(var(--s-10) + var(--s-1))}@media(prefers-color-scheme:dark){:root:not([data-theme]) .karte.anmeldung.anmeldung-web-forgot .anmeldung-marke{content:url(/static/marke/logo-quer-hell.svg)}}@media(max-width:900px){.karte.anmeldung.anmeldung-web-forgot .anmeldung-feld>input[type=email]{font-size:var(--schrift-16)}}.karte.anmeldung.anmeldung-web-zweifaktor .anmeldung-weg>a{min-block-size:calc(var(--s-10) + var(--s-1))}@media(prefers-color-scheme:dark){:root:not([data-theme]) .karte.anmeldung.anmeldung-web-zweifaktor .anmeldung-marke{content:url(/static/marke/logo-quer-hell.svg)}}.karte.anmeldung.anmeldung-web-login .anmeldung-fuss .f6-anmeldung-wege:not(#sechsb3){display:flex;flex-direction:column;gap:var(--s-2)}.karte.anmeldung.anmeldung-web-login .anmeldung-fuss .f6-anmeldung-wege a:not(#sechsb3){margin-block:calc(var(--s-3) * -1)}
