
:root{
 --auth-green:#12966f; --auth-green-dark:#087a5c; --auth-mint:#dff8ee;
 --auth-ink:#243447; --auth-muted:#738091; --auth-border:#dfe7e4;
 --auth-bg:#f5f8fb;
}
*{box-sizing:border-box}
body.auth-page{
 margin:0; min-height:100vh; background:var(--auth-bg);
 font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
 color:var(--auth-ink); overflow-x:hidden;
}
.auth-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:28px}
.auth-stage{
 width:min(1320px,100%); min-height:760px; position:relative; overflow:hidden;
 border:1px solid #e2e8ee; border-radius:24px; background:#fbfcfd;
 box-shadow:0 22px 65px rgba(37,55,76,.13);
 display:grid; grid-template-columns:1.12fr .88fr;
}
.auth-stage:before,.auth-stage:after{
 content:"";position:absolute;border-radius:50%;pointer-events:none;filter:blur(1px)
}
.auth-stage:before{width:520px;height:520px;left:-210px;top:-260px;background:radial-gradient(circle,rgba(62,197,151,.13),transparent 68%)}
.auth-stage:after{width:620px;height:620px;right:-260px;bottom:-320px;background:radial-gradient(circle,rgba(77,169,255,.10),transparent 68%)}
.auth-art{
 position:relative; min-height:760px; overflow:hidden;
 background:linear-gradient(145deg,#fbfdfd 0%,#f4faf8 62%,#eef8f5 100%);
}
.auth-art:before{
 content:"";position:absolute;inset:0;
 background:
 radial-gradient(circle at 13% 18%,rgba(18,150,111,.12) 0 2px,transparent 3px),
 radial-gradient(circle at 83% 21%,rgba(18,150,111,.10) 0 2px,transparent 3px),
 linear-gradient(135deg,transparent 0 48%,rgba(18,150,111,.025) 49% 50%,transparent 51%);
 background-size:52px 52px,70px 70px,100% 100%;
}
.auth-art-content{position:relative;z-index:2;padding:64px 60px;height:100%;display:flex;flex-direction:column;justify-content:center}
.brand-row{display:flex;align-items:center;gap:14px;margin-bottom:28px}
.brand-mark{
 width:58px;height:58px;border-radius:17px;background:linear-gradient(145deg,#19b884,#087a5c);
 color:white;display:grid;place-items:center;font-weight:900;font-size:20px;
 box-shadow:0 12px 25px rgba(18,150,111,.25);
}
.brand-name{font-weight:800;letter-spacing:-.02em;font-size:21px}
.brand-sub{font-size:12px;color:var(--auth-muted);margin-top:2px}
.auth-art h1{font-size:clamp(38px,4.2vw,64px);line-height:1.02;letter-spacing:-.045em;margin:0 0 20px;max-width:600px}
.auth-art h1 span{color:var(--auth-green)}
.auth-art p.lead{font-size:17px;line-height:1.7;color:#697686;max-width:560px;margin:0}
.art-orbit{position:absolute;right:30px;top:90px;width:260px;height:260px;border:1px dashed rgba(18,150,111,.25);border-radius:50%}
.art-orbit:before{content:"";position:absolute;inset:30px;border:1px solid rgba(18,150,111,.16);border-radius:50%}
.art-icon{
 position:absolute;width:76px;height:76px;border-radius:24px;background:rgba(255,255,255,.92);
 border:1px solid #e0ece8;box-shadow:0 14px 30px rgba(40,80,70,.10);
 display:grid;place-items:center;font-size:34px;
}
.ai-1{right:160px;top:54px}.ai-2{right:28px;top:150px}.ai-3{right:126px;top:278px}.ai-4{left:42px;bottom:74px}
.art-stat{
 position:absolute;left:60px;bottom:58px;display:flex;gap:12px;flex-wrap:wrap
}
.stat-pill{background:rgba(255,255,255,.84);border:1px solid #e3ece9;border-radius:15px;padding:10px 14px;color:#587067;font-size:12px;box-shadow:0 8px 22px rgba(44,80,69,.06)}
.auth-panel{
 position:relative;z-index:3;background:#fff;display:flex;align-items:center;justify-content:center;
 padding:55px 70px;border-left:1px solid #e8edef;
}
.auth-box{width:min(430px,100%)}
.auth-top{text-align:center;margin-bottom:28px}
.mobile-brand{display:none;justify-content:center;margin-bottom:18px}
.auth-top h2{font-size:31px;letter-spacing:-.035em;margin:0 0 8px;font-weight:800}
.auth-top p{color:var(--auth-muted);margin:0;font-size:14px;line-height:1.5}
.auth-form .field{margin-bottom:17px}
.auth-form label{display:block;font-size:13px;font-weight:700;margin-bottom:8px;color:#3a4958}
.input-wrap{position:relative}
.input-wrap .field-icon{position:absolute;left:15px;top:50%;transform:translateY(-50%);color:#8a98a5;font-size:15px}
.auth-input{
 width:100%;height:52px;border:1px solid var(--auth-border);border-radius:12px;
 background:#fbfcfd;padding:0 44px 0 43px;font-size:14px;outline:none;transition:.2s;
 color:#253544;
}
.auth-input:focus{border-color:#56bea0;box-shadow:0 0 0 4px rgba(18,150,111,.10);background:#fff}
.password-toggle{position:absolute;right:13px;top:50%;transform:translateY(-50%);border:0;background:none;color:#82909d;cursor:pointer;padding:5px}
.auth-actions{display:flex;align-items:center;justify-content:space-between;margin:2px 0 21px;font-size:12px}
.check{display:flex;align-items:center;gap:8px;color:#6f7b87}
.check input{accent-color:var(--auth-green);width:15px;height:15px}
.text-link{color:var(--auth-green-dark);font-weight:700;text-decoration:none}
.text-link:hover{text-decoration:underline}
.btn-auth{
 height:52px;width:100%;border:0;border-radius:12px;color:#fff;font-weight:800;font-size:14px;
 background:linear-gradient(135deg,#159d74,#087a5c);box-shadow:0 12px 22px rgba(18,150,111,.22);
 transition:.2s;cursor:pointer;
}
.btn-auth:hover{transform:translateY(-1px);box-shadow:0 15px 28px rgba(18,150,111,.28)}
.auth-bottom{text-align:center;margin-top:22px;color:#7a8792;font-size:13px}
.auth-bottom a{color:#087a5c;font-weight:800;text-decoration:underline}
.verify-link{text-align:center;margin-top:15px;font-size:12px}
.alert-auth{border:0;border-radius:12px;padding:12px 14px;font-size:13px;margin-bottom:18px}
.alert-auth.alert-danger{background:#fff1f1;color:#a83232}
.alert-auth.alert-success{background:#edfaf5;color:#087a5c}
.legal{font-size:11px;color:#a0aab3;text-align:center;margin-top:20px;line-height:1.5}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.form-grid .full{grid-column:1/-1}
@media(max-width:980px){
 .auth-stage{grid-template-columns:1fr;max-width:650px;min-height:auto}
 .auth-art{display:none}.auth-panel{border-left:0;padding:48px 35px;min-height:760px}
 .mobile-brand{display:flex}
}
@media(max-width:520px){
 .auth-shell{padding:0}.auth-stage{border-radius:0;border:0;min-height:100vh;box-shadow:none}
 .auth-panel{padding:32px 22px;min-height:100vh}
 .auth-top h2{font-size:27px}.form-grid{grid-template-columns:1fr}.form-grid .full{grid-column:auto}
}
