body:has(.auth-shell) {
    color-scheme: light;
    --ink: #202737;
    --muted: #667085;
    --panel: #fff;
    --line: #e4e7ef;
    --accent: #6246d5;
    --canvas: #f6f7fb;
}
body:has(.auth-shell) header { background: white; }
body:has(.auth-shell) .brand-mark { color: white; }
.auth-shell {
    display: grid;
    grid-template-columns: minmax(240px, 0.8fr) minmax(0, 1fr);
    max-width: 900px;
    margin: clamp(1rem, 7vh, 5rem) auto;
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    background: white;
}
.auth-brand { background: #151b2b; color: white; padding: clamp(1.5rem, 5vw, 3rem); }
.auth-brand p { color: #b4bdd0; }
.auth-mark { display: inline-grid; place-items: center; background: #8d77ed; width: 42px; height: 42px; border-radius: 12px; font-size: 30px; font-weight: 750; }
.auth-content { padding: clamp(1.5rem, 5vw, 3rem); }
.auth-content h1 { font-size: clamp(1.8rem, 4vw, 2.6rem); }
.auth-content form { padding: 0; border: 0; gap: 1rem; }
.auth-content input { background: #fff; border-color: #dfe3ec; color: #202737; }
.auth-content button { background: var(--accent); color: white; }
.auth-switch { font-size: .9rem; }
@media (max-width: 650px) {
    .auth-shell { grid-template-columns: 1fr; }
    .auth-brand p { margin-bottom: 0; }
}