:root { --ink:#17231f; --muted:#6d7773; --green:#177d57; --green-dark:#0f6243; --lime:#b9dd65; --line:#e2e8e3; --danger:#a9443c; }
* { box-sizing:border-box; }
body { min-height:100vh; margin:0; display:grid; grid-template-columns:minmax(320px, 44%) 1fr; background:#f8faf7; color:var(--ink); font-family:"DM Sans",system-ui,sans-serif; }
.auth-panel { padding:clamp(30px,6vw,84px); display:flex; flex-direction:column; justify-content:center; background:white; }
.brand { display:flex; align-items:center; gap:11px; margin-bottom:58px; color:var(--ink); text-decoration:none; font:800 24px/1 "Manrope",sans-serif; letter-spacing:-.8px; }.brand>span:last-child span{color:var(--green)}
.brand-mark { width:29px;height:29px;display:flex;align-items:end;justify-content:center;gap:3px;padding-bottom:5px;border-radius:8px;background:#173d31 }.brand-mark i{display:block;width:3px;border-radius:3px;background:var(--lime)}.brand-mark i:nth-child(1){height:7px}.brand-mark i:nth-child(2){height:14px}.brand-mark i:nth-child(3){height:10px}
.auth-box { width:min(380px,100%); }.eyebrow{margin:0 0 10px;color:var(--green);font-size:10px;font-weight:800;letter-spacing:1.8px}.auth-box h1{margin:0;font:800 clamp(28px,4vw,38px)/1.15 "Manrope",sans-serif;letter-spacing:-1.4px}.intro{margin:12px 0 30px;color:var(--muted);font-size:13px;line-height:1.6}
.field{display:grid;gap:7px;margin-bottom:15px}.field label{font-size:11px;font-weight:700}.field input{width:100%;height:47px;padding:0 14px;border:1px solid var(--line);border-radius:10px;outline:0;background:#fbfcfa;color:var(--ink);font-size:13px}.field input:focus{border-color:#8ebca8;box-shadow:0 0 0 4px rgba(23,125,87,.08)}
.submit{width:100%;height:47px;margin-top:6px;border:0;border-radius:10px;background:var(--green);color:white;font-weight:800;cursor:pointer;box-shadow:0 9px 22px rgba(23,125,87,.2)}.submit:hover{background:var(--green-dark)}.submit:disabled{opacity:.6;cursor:wait}.message{min-height:18px;margin:12px 0 0;color:var(--danger);font-size:11px}.security-note{margin-top:46px;padding-top:17px;border-top:1px solid #edf0ed;display:flex;gap:9px;color:#8a938f;font-size:10px;line-height:1.45}.security-note svg{width:15px;flex:0 0 auto;fill:none;stroke:var(--green);stroke-width:1.8}
.visual { position:relative;overflow:hidden;padding:70px;display:flex;align-items:center;justify-content:center;background:#143329;color:white }.visual:before,.visual:after{content:"";position:absolute;border:1px solid rgba(185,221,101,.12);border-radius:50%}.visual:before{width:620px;height:620px}.visual:after{width:430px;height:430px}.visual-content{position:relative;z-index:1;width:min(500px,100%)}.radar-graphic{width:235px;height:235px;margin:0 auto 48px;border:1px solid rgba(255,255,255,.12);border-radius:50%;display:grid;place-items:center;position:relative;background:radial-gradient(circle,rgba(185,221,101,.16) 0 3px,transparent 4px),conic-gradient(from 20deg,rgba(185,221,101,.2),transparent 22%,transparent)}.radar-graphic:before,.radar-graphic:after{content:"";position:absolute;border:1px solid rgba(255,255,255,.1);border-radius:50%}.radar-graphic:before{inset:39px}.radar-graphic:after{inset:78px}.radar-line{position:absolute;width:50%;height:1px;left:50%;top:50%;transform-origin:left;background:linear-gradient(90deg,var(--lime),transparent);transform:rotate(-28deg)}.radar-dot{width:11px;height:11px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 7px rgba(185,221,101,.12);transform:translate(48px,-28px)}.visual h2{margin:0;font:700 29px/1.35 "Manrope",sans-serif;letter-spacing:-.8px}.visual p{max-width:430px;margin:14px 0 0;color:#a9beb6;font-size:13px;line-height:1.7}
@media(max-width:800px){body{display:block;background:white}.visual{display:none}.auth-panel{min-height:100vh;padding:35px 24px}.brand{margin-bottom:50px}.auth-box{margin:auto}}