.lxa-body {
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    background: #2a0b0b;
    color: var(--text-primary);
    position: relative;
    isolation: isolate;
    overflow-x: hidden;
}
.lxa-body::before {
    content: "";
    position: fixed;
    inset: -14px;
    background: url('/images/backgr1_red.jpg') center / cover no-repeat;
    filter: blur(3px);
    z-index: -1;
}
.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: color-mix(in srgb, var(--bg-secondary) 90%, transparent);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
    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 img { width: 56px; height: 56px; }
.lxa-logo .lxa-l { display: none; }
html[data-theme="light"] .lxa-logo .lxa-l { display: inline; }
html[data-theme="light"] .lxa-logo .lxa-d { display: none; }
.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 { display: flex; align-items: baseline; gap: 0.5rem; font-size: var(--fs-sm); color: var(--text-secondary); }
.lxa-field label a { margin-left: auto; }
.lxa-field .form-input { width: 100%; box-sizing: border-box; }
.lxa-field .form-input.is-err { border-color: var(--error); }
.lxa-field .form-input[readonly] { background: var(--bg-tertiary); color: var(--text-secondary); }
.lxa-pw { position: relative; }
.lxa-pw .form-input { padding-right: 2.4rem; }
.lxa-pw button {
    position: absolute; right: 0.35rem; top: 50%; transform: translateY(-50%);
    background: none; border: 0; padding: 0.25rem; color: var(--text-secondary); cursor: pointer; line-height: 0;
}
.lxa-code { text-align: center; font-size: 1.5rem; letter-spacing: 0.4em; font-variant-numeric: tabular-nums; }
.lxa-code.lxa-rc { letter-spacing: 0.12em; text-transform: uppercase; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.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-alert {
    display: flex; gap: 0.55rem; align-items: flex-start; border-radius: 8px; padding: 0.6rem 0.75rem;
    font-size: var(--fs-sm); border: 1px solid; line-height: 1.45;
}
.lxa-alert > svg, .lxa-alert > i { flex: none; margin-top: 0.1rem; }
.lxa-alert span { color: var(--text-primary); }
.lxa-alert.is-e { color: var(--error); border-color: color-mix(in srgb, var(--error) 45%, transparent); background: color-mix(in srgb, var(--error) 8%, transparent); }
.lxa-alert.is-w { color: var(--warning); border-color: color-mix(in srgb, var(--warning) 45%, transparent); background: color-mix(in srgb, var(--warning) 8%, transparent); }
.lxa-alert.is-i { color: var(--info); border-color: color-mix(in srgb, var(--info) 40%, transparent); background: color-mix(in srgb, var(--info) 8%, transparent); }
.lxa-alert.is-ok { color: var(--success); border-color: color-mix(in srgb, var(--success) 45%, transparent); background: color-mix(in srgb, var(--success) 8%, transparent); }
.lxa-invite {
    display: flex; gap: 0.6rem; align-items: flex-start; border-radius: 8px; padding: 0.65rem 0.75rem; font-size: var(--fs-sm); line-height: 1.45;
    border: 1px solid color-mix(in srgb, #8b5cf6 45%, transparent); background: color-mix(in srgb, #8b5cf6 9%, transparent);
}
.lxa-invite > svg, .lxa-invite > i { color: #8b5cf6; flex: none; margin-top: 0.1rem; }
.lxa-invite b { display: block; }
.lxa-invite small { display: block; color: var(--text-secondary); font-size: var(--fs-sm); }
.lxa-card a:is(:link, :visited) { color: var(--ctl-primary-fg); }
.lxa-card a.btn-primary:is(:link, :visited) { color: #fff; text-decoration: none; }
.lxa-card a.btn-secondary:is(:link, :visited) { color: var(--text-primary); text-decoration: none; }
.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; }
.lxa-card .lxa-links form { display: inline; }
button.lxa-link { background: none; border: 0; padding: 0; font: inherit; cursor: pointer; }
.lxa-foot { border-top: 1px solid var(--border-color); padding-top: 0.75rem; }
.lxa-big {
    width: 3.4rem; height: 3.4rem; border-radius: 50%; display: grid; place-items: center; justify-self: center;
    background: color-mix(in srgb, var(--info) 14%, transparent); color: var(--info);
}
.lxa-big.is-w { background: color-mix(in srgb, var(--warning) 14%, transparent); color: var(--warning); }
.lxa-big.is-ok { background: color-mix(in srgb, var(--success) 14%, transparent); color: var(--success); }
.lxa-big svg { width: 1.6rem; height: 1.6rem; }
.lxa-center { text-align: center; }
.lxa-muted { color: var(--text-secondary); font-size: var(--fs-sm); margin: 0; }
.lxa-addr { overflow-wrap: anywhere; }
.lxa-legal { display: flex; justify-content: center; gap: 0.35rem 0.9rem; flex-wrap: wrap; font-size: var(--fs-xs); }
.lxa-stage .lxa-legal a:is(:link, :visited) { color: rgba(255, 255, 255, 0.82); text-decoration: none; }
.lxa-stage .lxa-legal a:hover { color: #fff; text-decoration: underline; }
.lxa-theme { display: flex; justify-content: center; }
@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; }
}
.lxa-or { display: flex; align-items: center; gap: .75rem; margin: 1rem 0 .75rem; color: var(--text-secondary); font-size: var(--fs-sm, .85rem); }
.lxa-or::before, .lxa-or::after { content: ''; flex: 1; height: 1px; background: var(--border-color); }
