* { margin:0; padding:0; box-sizing:border-box; }

body {
    font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
    background:#f8fafc;
    color:#0f172a;
}

.auth-layout { display:flex; min-height:100vh; }

.auth-hero {
    flex:1;
    background:linear-gradient(135deg,#1e1b4b 0%,#4338ca 55%,#7c3aed 100%);
    color:#fff;
    padding:60px 56px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    position:relative;
    overflow:hidden;
}

.auth-hero::after {
    content:'';
    position:absolute;
    width:520px; height:520px;
    background:radial-gradient(circle,rgba(168,85,247,0.45),transparent 68%);
    top:-120px; right:-160px;
}

.hero-logo {
    width:54px; height:54px;
    border-radius:14px;
    background:rgba(255,255,255,0.14);
    display:flex; align-items:center; justify-content:center;
    font-size:26px;
    margin-bottom:38px;
    position:relative; z-index:1;
}

.hero-eyebrow {
    font-size:11px; letter-spacing:2.4px; font-weight:700;
    color:rgba(255,255,255,0.6); margin-bottom:16px;
    position:relative; z-index:1;
}

.auth-hero h1 {
    font-size:44px; line-height:1.15; font-weight:800;
    max-width:460px; margin-bottom:20px;
    position:relative; z-index:1;
}

.auth-hero p.lead {
    font-size:15px; line-height:1.7;
    color:rgba(255,255,255,0.78); max-width:430px;
    position:relative; z-index:1;
}

.hero-points {
    list-style:none; margin-top:auto; padding-top:48px;
    position:relative; z-index:1;
}

.hero-points li {
    display:flex; align-items:center; gap:10px;
    font-size:13.5px; color:rgba(255,255,255,0.8);
    margin-bottom:12px;
}

.auth-panel {
    width:520px;
    display:flex; align-items:center; justify-content:center;
    padding:40px 56px;
    background:#fff;
}

.auth-card { width:100%; max-width:380px; }

.auth-card .eyebrow {
    font-size:11px; letter-spacing:1.8px; font-weight:700;
    color:#6366f1; margin-bottom:10px;
}

.auth-card h2 { font-size:25px; font-weight:700; margin-bottom:8px; }

.auth-card .sub {
    font-size:13.5px; color:#64748b;
    line-height:1.6; margin-bottom:26px;
}

.field { margin-bottom:17px; }

.field label {
    display:block; font-size:13px; font-weight:600;
    margin-bottom:7px; color:#334155;
}

.field .label-row {
    display:flex; justify-content:space-between; align-items:baseline;
}

.field input {
    width:100%; padding:12px 14px;
    border:1px solid #e2e8f0; border-radius:9px;
    font-size:14px; background:#f8fafc;
    transition:all .2s;
}

.field input:focus {
    outline:none; background:#fff;
    border-color:#6366f1;
    box-shadow:0 0 0 3px rgba(99,102,241,.13);
}

.link { font-size:12.5px; color:#6366f1; text-decoration:none; font-weight:600; }
.link:hover { text-decoration:underline; }

.btn-auth {
    width:100%; padding:13px;
    background:#4f46e5; color:#fff;
    border:none; border-radius:9px;
    font-size:15px; font-weight:600;
    cursor:pointer; transition:background .2s;
    margin-top:6px;
}

.btn-auth:hover { background:#4338ca; }
.btn-auth:disabled { background:#c7d2fe; cursor:not-allowed; }

.auth-foot {
    text-align:center; margin-top:22px;
    font-size:13.5px; color:#64748b;
}

.alert {
    padding:13px 15px; border-radius:9px;
    font-size:13.5px; line-height:1.6; margin-bottom:20px;
}

.alert-error   { background:#fef2f2; color:#b91c1c; border-left:3px solid #ef4444; }
.alert-success { background:#f0fdf4; color:#15803d; border-left:3px solid #22c55e; }
.alert-info    { background:#eff6ff; color:#1d4ed8; border-left:3px solid #3b82f6; }

.hint { font-size:12px; color:#94a3b8; margin-top:6px; }

@media (max-width:980px) {
    .auth-hero { display:none; }
    .auth-panel { width:100%; padding:32px 22px; }
}