:root{--ink:#0b1510;--green:#10bf70;--line:#dfe7e2;--muted:#728078}
*{box-sizing:border-box}
body{margin:0;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#f7f9f7}
.login-layout{min-height:100vh;display:grid;grid-template-columns:minmax(390px,.92fr) 1.08fr}
.brand-side{position:relative;overflow:hidden;padding:41px 48px;color:white;background:radial-gradient(circle at 107% 12%,rgba(36,223,137,.45),transparent 30%),radial-gradient(circle at 70% 68%,rgba(18,179,103,.20),transparent 34%),#08120d;display:flex;flex-direction:column}
.brand-side:before{content:"";position:absolute;width:660px;height:660px;border:1px solid rgba(44,225,142,.20);border-radius:50%;right:-385px;top:60px;box-shadow:0 0 0 80px rgba(35,207,128,.025),0 0 120px rgba(24,200,117,.12)}
.brand{position:relative;z-index:1;display:flex;align-items:center;gap:10px;color:white;text-decoration:none;font-size:22px;font-weight:350;letter-spacing:-1px}
.brand-mark{width:30px;height:30px;border:2px solid currentColor;border-radius:50%;position:relative;display:inline-block}
.brand-mark:after{content:"";position:absolute;width:14px;height:11px;background:#08120d;right:-5px;top:7px}
.brand-message{position:relative;z-index:1;margin:auto 0;max-width:530px}
.eyebrow{display:block;color:var(--green);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:1.5px;margin-bottom:17px}
.brand-message h1{font-size:43px;line-height:1.06;letter-spacing:-1.8px;margin:0 0 19px}
.brand-message p{color:#87a096;font-size:12px;line-height:1.7;max-width:380px}
.brand-foot{position:relative;z-index:1;display:flex;justify-content:space-between;color:#5e7469;text-transform:uppercase;letter-spacing:1px;font-size:8px}
.form-side{position:relative;display:grid;place-items:center;padding:35px;background:radial-gradient(circle at 100% 0%,rgba(26,202,119,.13),transparent 30%),#f9fbf9}
.form-side:after{content:"";position:absolute;width:410px;height:410px;border:1px solid rgba(20,183,103,.09);border-radius:50%;right:-235px;top:-160px}
.login-card{position:relative;z-index:1;width:min(390px,100%);padding:35px;background:rgba(255,255,255,.9);border:1px solid rgba(18,105,62,.11);border-radius:19px;box-shadow:0 24px 65px rgba(9,49,29,.08);backdrop-filter:blur(12px)}
.login-card h2{font-size:26px;letter-spacing:-.8px;margin:0 0 8px}
.subtitle{color:var(--muted);font-size:11px;margin:0 0 27px}
.login-card label{display:grid;gap:7px;font-size:9px;font-weight:800;margin-bottom:14px}
.login-card input{width:100%;border:1px solid var(--line);border-radius:10px;padding:12px;font-size:11px;outline:0;background:#fbfcfb}
.login-card input:focus{border-color:#63d19c;box-shadow:0 0 0 3px #e2f7ec}
.login-card>button{width:100%;border:0;border-radius:10px;padding:12px 15px;margin-top:5px;background:var(--ink);color:white;font-size:10px;font-weight:800;display:flex;justify-content:space-between}
.error{padding:10px 11px;border-radius:9px;background:#fff0ef;color:#a9443f;font-size:9px;margin-bottom:15px}
.mobile-brand{display:none}
@media(max-width:760px){.login-layout{display:block}
.brand-side{display:none}
.form-side{min-height:100vh;padding:22px}
.login-card{padding:28px 22px}
.mobile-brand{display:flex;align-items:center;gap:9px;margin-bottom:40px;font-size:18px}
.mobile-brand .brand-mark{width:26px;height:26px}
.mobile-brand .brand-mark:after{background:white}
.form-side:after{right:-300px}
}
.brand img{display:block;width:148px;height:auto}
.mobile-brand img{display:block;width:132px;height:auto}
@media(max-width:760px){.mobile-brand{padding:12px 15px;border-radius:12px;background:#0b1711}}