*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#0b1220;color:#0f172a;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;position:relative;overflow-x:hidden}
body::before,body::after{content:"";position:fixed;border-radius:50%;filter:blur(80px);opacity:.55;z-index:0}
body::before{width:520px;height:520px;background:#f97316;top:-160px;left:-120px}
body::after{width:480px;height:480px;background:#6366f1;bottom:-160px;right:-120px;opacity:.45}
.wrap{position:relative;z-index:1;width:100%;max-width:960px;display:grid;grid-template-columns:1.05fr 1fr;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.wrap.narrow{max-width:460px;grid-template-columns:1fr}
.hero{background:linear-gradient(145deg,#f97316 0%,#ea580c 55%,#c2410c 100%);color:#fff;padding:48px 40px;display:flex;flex-direction:column;justify-content:space-between;min-height:520px}
.hero .logo{width:68px;height:68px;border-radius:18px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;padding:12px;backdrop-filter:blur(4px);border:1px solid rgba(255,255,255,.3)}
.hero .logo img{width:100%;height:100%}
.hero h1{font-size:40px;line-height:1.05;margin:26px 0 10px;font-weight:800;letter-spacing:-.02em}
.hero p{margin:0;opacity:.92;font-size:15px;line-height:1.6;max-width:340px}
.hero ul{list-style:none;padding:0;margin:28px 0 0;display:grid;gap:12px;font-size:14px}
.hero li{display:flex;gap:10px;align-items:center;opacity:.95}
.hero li i{width:22px;height:22px;border-radius:50%;background:rgba(255,255,255,.22);display:inline-flex;align-items:center;justify-content:center;font-style:normal;font-size:12px}
.hero small{opacity:.75;font-size:12px}
.card{padding:44px 40px;display:flex;flex-direction:column;justify-content:center}
.card .brand-mini{display:none;align-items:center;gap:10px;margin-bottom:18px;font-weight:800;font-size:20px}
.card .brand-mini span{width:38px;height:38px;border-radius:10px;background:#f97316;display:inline-flex;padding:7px}
.card .brand-mini img{width:100%;height:100%}
.card h2{margin:0 0 6px;font-size:26px;font-weight:800;letter-spacing:-.01em}
.card .sub{margin:0 0 24px;color:#64748b;font-size:14px}
label{display:block;font-size:12px;font-weight:700;color:#334155;margin:0 0 6px}
.field{margin-bottom:16px;position:relative}
input[type=text],input[type=password]{width:100%;padding:13px 14px;border:1.5px solid #e2e8f0;border-radius:12px;font-size:15px;font-family:inherit;background:#f8fafc;transition:.15s;outline:none}
input:focus{border-color:#f97316;background:#fff;box-shadow:0 0 0 4px rgba(249,115,22,.15)}
.eye{position:absolute;right:10px;top:31px;background:none;border:0;color:#94a3b8;cursor:pointer;font-size:12px;font-weight:700;padding:6px}
.btn{width:100%;padding:14px;border:0;border-radius:12px;background:linear-gradient(135deg,#f97316,#ea580c);color:#fff;font-size:15px;font-weight:700;cursor:pointer;font-family:inherit;box-shadow:0 8px 20px rgba(234,88,12,.35);transition:.15s}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 26px rgba(234,88,12,.42)}
.btn:disabled{opacity:.6;cursor:wait;transform:none}
.err{display:none;background:#fff1f2;color:#be123c;border:1px solid #fecdd3;border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;margin-bottom:14px}
.ok{background:#ecfdf5;color:#047857;border-color:#a7f3d0}
.switch{text-align:center;margin-top:20px;font-size:14px;color:#64748b}
.switch a{color:#ea580c;font-weight:700;text-decoration:none}
.switch a:hover{text-decoration:underline}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.note{font-size:12px;color:#94a3b8;margin-top:-6px;margin-bottom:14px}
@media(max-width:820px){.wrap{grid-template-columns:1fr;max-width:460px}.hero{display:none}.card{padding:34px 26px}.card .brand-mini{display:flex}.row2{grid-template-columns:1fr}}