:root{
    --bg:#f6f0e8;
    --text:#231810;
    --muted:#7f6d5e;
    --line:rgba(92,58,33,.10);
    --primary:#5c3a21;
    --primary-dark:#2b1d14;
    --gold:#c8a97e;
    --shadow-xl:0 28px 80px rgba(43,29,20,.12);
}
*{box-sizing:border-box}
html{
    min-height:100%;
    -webkit-text-size-adjust:100%;
}
body{
    margin:0;
    min-height:100%;
    font-family:"Inter",Arial,sans-serif;
    color:var(--text);
    background:
            radial-gradient(circle at top right, rgba(200,169,126,.22), transparent 22%),
            radial-gradient(circle at bottom left, rgba(92,58,33,.14), transparent 28%),
            linear-gradient(180deg,#fbf8f4 0%, #f3ece3 100%);
}
button,input,select,textarea{font:inherit}
input,select,textarea{
    font-size:16px;
}
.auth-shell{
    min-height:100svh;
    display:grid;
    grid-template-columns:1.05fr .95fr;
    padding:18px;
    gap:18px;
}
.auth-brand{
    position:relative;
    border-radius:34px;
    overflow:hidden;
    background:linear-gradient(145deg,#2b1d14 0%,#5c3a21 58%,#c8a97e 100%);
    color:#fff;
    box-shadow:var(--shadow-xl);
    padding:38px;
    display:flex;
    flex-direction:column;
    justify-content:space-between;
}
.auth-brand-top{
    display:flex;
    align-items:center;
    gap:16px;
}
.auth-brand-top img{
    width:62px;
    height:62px;
    object-fit:contain;
    border-radius:18px;
    background:rgba(255,255,255,.08);
    padding:8px;
}
.auth-brand-top strong{
    display:block;
    font-size:1.3rem;
}
.auth-brand-top small{
    display:block;
    margin-top:4px;
    color:rgba(255,255,255,.70);
}
.auth-badge-row{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:20px;
}
.auth-badge{
    min-height:38px;
    padding:0 14px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    border-radius:999px;
    background:rgba(255,255,255,.12);
    border:1px solid rgba(255,255,255,.14);
    font-size:.80rem;
    font-weight:700;
}
.auth-brand h1{
    margin:22px 0 0;
    font-size:3.15rem;
    line-height:1.06;
    letter-spacing:-.05em;
}
.auth-brand p{
    margin:12px 0 0;
    max-width:620px;
    color:rgba(255,255,255,.78);
    line-height:1.85;
}
.auth-points{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
.auth-point{
    padding:18px;
    border-radius:22px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.10);
}
.auth-point strong{
    display:block;
    font-size:1rem;
}
.auth-point small{
    display:block;
    margin-top:8px;
    color:rgba(255,255,255,.70);
    line-height:1.6;
}

.auth-panel{
    border-radius:34px;
    background:rgba(255,255,255,.82);
    backdrop-filter:blur(18px);
    box-shadow:var(--shadow-xl);
    border:1px solid rgba(255,255,255,.80);
    padding:34px;
    display:flex;
    align-items:center;
    justify-content:center;
}
.auth-box{
    width:100%;
    max-width:520px;
}
.auth-head small{
    display:block;
    color:#9a8573;
    font-size:.82rem;
    font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.auth-head h2{
    margin:14px 0 0;
    font-size:2.2rem;
    line-height:1.08;
    letter-spacing:-.04em;
    color:var(--primary-dark);
}
.auth-head p{
    margin:10px 0 0;
    color:var(--muted);
    line-height:1.8;
}
.auth-form{
    margin-top:28px;
    display:grid;
    gap:18px;
}
.form-group label{
    display:block;
    margin-bottom:8px;
    font-size:.88rem;
    font-weight:700;
    color:#4b3728;
}
.input-wrap{
    position:relative;
}
.input-wrap i{
    position:absolute;
    left:16px;
    top:50%;
    transform:translateY(-50%);
    color:#a08976;
    pointer-events:none;
}
.form-control{
    width:100%;
    height:58px;
    border:1px solid #eadfce;
    border-radius:18px;
    background:#fff;
    padding:0 48px 0 46px;
    outline:none;
    transition:.22s ease;
    color:var(--text);
    appearance:none;
}
.form-control:focus{
    border-color:var(--gold);
    box-shadow:0 0 0 5px rgba(200,169,126,.16);
}
.password-toggle{
    position:absolute;
    top:50%;
    right:12px;
    transform:translateY(-50%);
    width:40px;
    height:40px;
    border:none;
    border-radius:12px;
    background:transparent;
    color:#8a7564;
}
.form-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    flex-wrap:wrap;
}
.check{
    display:inline-flex;
    align-items:center;
    gap:10px;
    font-size:.86rem;
    color:var(--muted);
}
.mini-note{
    font-size:.82rem;
    color:var(--muted);
}
.auth-submit{
    height:58px;
    border:none;
    border-radius:18px;
    background:linear-gradient(135deg,#2b1d14 0%,#5c3a21 60%,#c8a97e 100%);
    color:#fff;
    font-size:.96rem;
    font-weight:800;
    box-shadow:0 16px 28px rgba(43,29,20,.16);
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
}
.auth-note{
    margin-top:18px;
    padding:14px 16px;
    border-radius:16px;
    background:#fff;
    border:1px solid var(--line);
    color:var(--muted);
    font-size:.82rem;
}

@media (max-width: 1199.98px){
    .auth-shell{
        grid-template-columns:1fr;
    }
}
@media (max-width: 767.98px){
    .auth-shell{
        padding:12px;
        gap:12px;
    }
    .auth-brand,
    .auth-panel{
        padding:22px;
        border-radius:26px;
    }
    .auth-brand h1{
        font-size:2.2rem;
    }
    .auth-points{
        grid-template-columns:1fr;
    }
    .auth-head h2{
        font-size:1.8rem;
    }
    .auth-submit,
    .form-control{
        height:56px;
    }
}