/* AlpImmo 360 – Design-Ebene 2026 für Anmeldung und Mieterportal (Varianten wie in der App) */
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/Manrope.woff) format('woff')}
@font-face{font-family:'Caveat';font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/Caveat.woff) format('woff')}
html[data-alp]{--th-font:'Manrope',system-ui,'Segoe UI',Roboto,sans-serif;--th-radius:14px;--th-shadow:0 1px 2px rgba(16,32,48,.05),0 6px 20px rgba(16,32,48,.08);--th-surface:#fff;--th-ok:#1b7f4a;--th-er:#c0392b}
html[data-alp="v1"]{--th-bg:#F5F7FA;--th-side:#132A44;--th-act:#1E5A96;--th-act-h:#174A7D;--th-tint:#EAF1F8;--th-line:#E1E7EF;--th-ink:#13263B;--th-mu:#66768A;--th-acc:#D9A441}
html[data-alp="v2"]{--th-bg:#F8FAFC;--th-side:#2563EB;--th-act:#2563EB;--th-act-h:#1D4FD0;--th-tint:#EAF1FE;--th-line:#E2E8F0;--th-ink:#0F172A;--th-mu:#64748B;--th-acc:#F59E0B}
html[data-alp="v3"]{--th-bg:#F7F9F6;--th-side:#0F2E2B;--th-act:#1F7A70;--th-act-h:#17635B;--th-tint:#E8F3F1;--th-line:#E1E9E6;--th-ink:#10302D;--th-mu:#64776F;--th-acc:#D4AF37}
html[data-alp]{--bg:var(--th-bg);--c:var(--th-surface);--t:var(--th-ink);--m:var(--th-mu);--a:var(--th-act);--l:var(--th-line)}
html[data-alp] body{background:var(--th-bg);color:var(--th-ink);font-family:var(--th-font);font-size:15px;-webkit-font-smoothing:antialiased}
html[data-alp] h1,html[data-alp] h2{letter-spacing:-.01em;font-weight:700}
html[data-alp] form,html[data-alp] .k{background:var(--th-surface);border:1px solid var(--th-line);border-radius:var(--th-radius);box-shadow:var(--th-shadow)}
html[data-alp] input,html[data-alp] textarea,html[data-alp] select{border:1px solid var(--th-line);border-radius:10px;background:#fff;color:var(--th-ink);font-family:inherit}
html[data-alp] input:focus,html[data-alp] textarea:focus,html[data-alp] select:focus{outline:2px solid color-mix(in srgb,var(--th-act) 45%,transparent);outline-offset:1px;border-color:var(--th-act)}
html[data-alp] button{background:var(--th-act);border-radius:10px;font-family:inherit;transition:background .15s}
html[data-alp] button:hover{background:var(--th-act-h)}
html[data-alp] button.g{background:transparent;color:var(--th-act);border:1px solid var(--th-act)}
html[data-alp] button.g:hover{background:var(--th-tint)}
html[data-alp] label,html[data-alp] .m,html[data-alp] form p{color:var(--th-mu)}html[data-alp] p{color:var(--th-ink)}html[data-alp] a{color:var(--th-act)}
html[data-alp] .tag{background:var(--th-tint);color:var(--th-act);border-radius:999px}
html[data-alp] td{border-bottom-color:var(--th-line)}
/* Marke */
.alp-marke{display:flex;align-items:center;gap:10px;margin:0 0 14px}.alp-marke img{width:auto;height:52px;max-width:none;border-radius:0;flex:0 0 auto}.alp-marke b{font-size:19px;letter-spacing:-.01em}.alp-marke span{display:block;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--th-mu)}
html[data-alp] body.alp-login{background:linear-gradient(180deg,var(--th-side) 0%,var(--th-side) 34%,var(--th-bg) 34%)}
html[data-alp] body.alp-login form{box-shadow:0 18px 50px rgba(0,0,0,.25)}
html[data-alp] header.alp-kopf{background:var(--th-surface);border:1px solid var(--th-line);border-radius:var(--th-radius);padding:10px 14px;box-shadow:var(--th-shadow)}
@media(prefers-color-scheme:dark){html[data-alp]{color-scheme:light}}
html[data-alp] body.alp-login form h1{display:none}html[data-alp] body.alp-login form p{margin-top:-4px}
.alp-marke{flex:0 0 auto}@media(max-width:380px){.alp-marke img{height:42px}}