.auth-page{
    min-height:100vh;
    padding:24px;
    background:
        radial-gradient(circle at 10% 10%,rgba(109,94,248,.18),transparent 28%),
        radial-gradient(circle at 90% 90%,rgba(37,99,235,.12),transparent 30%),
        var(--bg);
}

.auth-back-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    color:var(--muted);
    text-decoration:none;
    font-weight:700;
    margin-bottom:22px;
}
.auth-back-link:hover{color:var(--primary);}

.auth-layout{
    width:100%;
    max-width:1040px;
    min-height:650px;
    margin:0 auto;
    display:grid;
    grid-template-columns:minmax(0,1fr) 460px;
    background:#fff;
    border:1px solid var(--border);
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 28px 80px rgba(15,23,42,.12);
}

.auth-intro{
    padding:58px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:linear-gradient(145deg,rgba(37,99,235,.96),rgba(109,94,248,.95) 55%,rgba(126,34,206,.94));
    color:#fff;
}

.auth-brand-logo{
    width:170px !important;
    height:auto !important;
    max-height:74px;
    object-fit:contain;
    object-position:left center;
    margin:0 0 28px !important;
    filter:brightness(0) invert(1);
}

.auth-eyebrow{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;opacity:.82;}
.auth-intro h1{margin:18px 0;font-size:38px;line-height:1.12;letter-spacing:-.04em;}
.auth-intro p{margin:0;font-size:16px;line-height:1.7;opacity:.86;}
.auth-feature-list{display:grid;gap:13px;margin-top:30px;}
.auth-feature-list span{display:flex;align-items:center;gap:9px;font-weight:700;}

.auth-card{
    width:100%;
    max-width:none;
    border:0;
    border-radius:0;
    box-shadow:none;
    padding:48px 42px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    background:#fff;
}

.auth-card-heading{margin-bottom:22px;}
.auth-card-heading h2{margin:0 0 8px;color:var(--dark);font-size:29px;}
.auth-card-heading p{margin:0;text-align:left;color:var(--muted);}

.google-auth-btn,
.microsoft-auth-btn{
    width:100%;
    min-height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:11px;
    border:1px solid var(--border);
    border-radius:14px;
    padding:13px 16px;
    margin:0 0 12px;
    background:#fff;
    color:var(--dark) !important;
    text-decoration:none;
    font-size:14px;
    font-weight:800;
}
.google-auth-btn:hover{background:#FAFAFF;border-color:rgba(109,94,248,.45);}
.google-auth-btn svg{
    display:block;
    width:20px !important;
    height:20px !important;
    min-width:20px;
    max-width:20px;
    flex:0 0 20px;
}

.microsoft-auth-btn{position:relative;cursor:not-allowed;opacity:.65;}
.microsoft-auth-btn i{color:#2563EB;font-size:18px;}
.microsoft-auth-btn small{position:absolute;right:12px;color:var(--muted);font-size:10px;}

.auth-divider{
    display:flex;
    align-items:center;
    gap:12px;
    margin:18px 0;
    color:var(--muted);
    font-size:12px;
    font-weight:700;
}
.auth-divider::before,.auth-divider::after{content:"";flex:1;height:1px;background:var(--border);}
.auth-divider span{white-space:nowrap;}

.auth-field{margin-bottom:14px;}
.auth-field label{display:block;margin-bottom:7px;color:var(--dark);font-size:13px;font-weight:800;}
.auth-field input{
    width:100%;
    margin:0;
    min-height:48px;
    border:1px solid var(--border);
    border-radius:13px;
    padding:12px 14px;
    outline:none;
    font-size:15px;
}
.auth-field input:focus{border-color:var(--primary);box-shadow:0 0 0 4px rgba(109,94,248,.1);}

.auth-submit-btn{
    width:100%;
    min-height:50px;
    margin-top:4px;
    border:0;
    border-radius:14px;
    background:linear-gradient(135deg,#2563EB,#7E22CE);
    color:#fff;
    font-weight:800;
    cursor:pointer;
}
.auth-switch{margin:18px 0 0;text-align:center;color:var(--muted);}
.auth-switch a{color:var(--primary);font-weight:800;}
.auth-powered{margin-top:22px;padding-top:16px;border-top:1px solid var(--border);text-align:center;color:var(--muted);font-size:12px;}
.auth-powered strong{color:var(--primary);}

@media(max-width:900px){
    .auth-page{padding:14px;}
    .auth-back-link{margin:4px 0 14px;}
    .auth-layout{display:block;min-height:0;border-radius:24px;}
    .auth-intro{padding:28px 24px;}
    .auth-brand-logo{width:138px !important;max-height:60px;margin-bottom:18px !important;}
    .auth-intro h1{font-size:27px;margin:13px 0;}
    .auth-intro p{font-size:14px;}
    .auth-feature-list{display:none;}
    .auth-card{padding:28px 22px 24px;}
    .auth-card-heading h2{font-size:24px;}
    .google-auth-btn,.microsoft-auth-btn{min-height:48px;padding:12px;font-size:13px;}
    .google-auth-btn svg{
        width:18px !important;
        height:18px !important;
        min-width:18px;
        max-width:18px;
        flex:0 0 18px;
    }
    .microsoft-auth-btn small{display:none;}
}