/* Login-Karte, Port aus LX-Tools public/css/auth.css (ohne Hintergrundbild, nur Tokens aus style.css). */
.lxa-body { margin: 0; min-height: 100vh; min-height: 100dvh; background: var(--bg-primary); color: var(--text-primary); }
.lxa-stage { min-height: 100vh; min-height: 100dvh; display: grid; grid-template-columns: minmax(0, 400px); justify-content: center; align-content: center; gap: 0.9rem; padding: 2rem 16px; box-sizing: border-box; }
.lxa-card { background: var(--bg-secondary); border: 1px solid var(--border-color); border-radius: 10px; padding: 1.6rem 1.6rem 1.2rem; display: grid; gap: 0.85rem; min-width: 0; }
.lxa-card form { display: grid; gap: 0.85rem; margin: 0; }
.lxa-logo { display: flex; flex-direction: column; align-items: center; gap: 0.35rem; font-weight: 700; font-size: var(--fs-lg); }
.lxa-logo svg { width: 2.2rem; height: 2.2rem; color: var(--text-secondary); }
.lxa-logo-img { display: block; max-width: 100%; max-height: 72px; object-fit: contain; }
.lxa-title { margin: 0; text-align: center; font-size: var(--fs-lg); font-weight: 600; }
.lxa-field { display: grid; gap: 0.25rem; }
.lxa-field label { font-size: var(--fs-sm); color: var(--text-secondary); }
.lxa-label-row { display: flex; align-items: baseline; gap: 0.5rem; font-size: var(--fs-sm); }
.lxa-label-row a { margin-left: auto; }
.lxa-passkey { display: grid; gap: 0.85rem; }
.lxa-account { margin: 0; display: flex; align-items: center; justify-content: center; gap: 0.4rem; font-size: var(--fs-sm); overflow-wrap: anywhere; }
.lxa-field .form-input { width: 100%; box-sizing: border-box; }
.lxa-field .form-input[readonly] { background: var(--bg-tertiary); color: var(--text-secondary); }
.lxa-code { text-align: center; font-size: var(--fs-xl); letter-spacing: 0.3em; font-variant-numeric: tabular-nums; }
.lxa-wide { width: 100%; justify-content: center; }
.lxa-card .btn { display: inline-flex; align-items: center; gap: 0.45rem; }
.lxa-check { display: flex; gap: 0.5rem; align-items: flex-start; font-size: var(--fs-sm); cursor: pointer; line-height: 1.4; }
.lxa-check input { accent-color: var(--ctl-primary); margin-top: 0.15rem; flex: none; }
.lxa-card a:is(:link, :visited) { color: var(--ctl-primary-fg); }
.lxa-links { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.35rem 1rem; font-size: var(--fs-sm); }
.lxa-card .lxa-links a:is(:link, :visited), .lxa-links button.lxa-link { color: var(--text-secondary); text-decoration: none; }
.lxa-card .lxa-links a:hover, .lxa-links button.lxa-link:hover { color: var(--text-primary); text-decoration: underline; }
button.lxa-link { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.lxa-center { text-align: center; }
.lxa-muted { color: var(--text-secondary); font-size: var(--fs-sm); margin: 0; }
.lxa-or { display: flex; align-items: center; gap: 0.75rem; color: var(--text-secondary); font-size: var(--fs-sm); }
.lxa-or::before, .lxa-or::after { content: ''; flex: 1; height: 1px; background: var(--border-color); }
.lxa-more summary { cursor: pointer; text-align: center; font-size: var(--fs-sm); color: var(--text-secondary); list-style: none; }
.lxa-more summary::-webkit-details-marker { display: none; }
.lxa-more[open] summary { margin-bottom: 0.85rem; }
.lxa-theme { display: flex; justify-content: center; }
.lxa-card .lx-flash { margin: 0; }
.lxa-card [hidden] { display: none; }
@media (max-width: 480px) {
    .lxa-stage { align-content: start; padding: 1.5rem 16px 2rem; grid-template-columns: minmax(0, 1fr); }
    .lxa-card { padding: 1.25rem 1.1rem 1rem; }
}