:root{--navy:#061a33;--navy-2:#0b315d;--blue:#1677e8;--blue-dark:#0755b2;--cyan:#35c9e8;--ink:#0c2541;--muted:#688099;--line:#d8e4f0;--canvas:#eaf2fb;--surface:#fff;--danger:#d94452;--shadow:0 24px 70px rgba(3,19,38,.18)}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{color:var(--ink);background:var(--canvas);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.login-page{display:grid;min-height:100vh;place-items:center;padding:24px;background:radial-gradient(circle at 8% 0%,rgba(47,145,245,.20),transparent 30%),linear-gradient(135deg,#f7fbff,#e8f2fc)}.login-shell{display:grid;width:min(1120px,100%);min-height:650px;grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr);overflow:hidden;border:1px solid rgba(118,169,219,.28);border-radius:28px;background:#fff;box-shadow:var(--shadow)}
.login-brand{position:relative;display:flex;min-height:650px;flex-direction:column;justify-content:space-between;padding:46px;overflow:hidden;color:#fff;background:linear-gradient(145deg,var(--navy),#0a4078 62%,#1677e8)}.login-brand::before,.login-brand::after{content:"";position:absolute;border-radius:50%;border:1px solid rgba(255,255,255,.13)}.login-brand::before{width:520px;height:520px;right:-220px;top:-180px;box-shadow:0 0 0 42px rgba(255,255,255,.025),0 0 0 86px rgba(255,255,255,.02)}.login-brand::after{width:340px;height:340px;left:-190px;bottom:-170px;box-shadow:0 0 0 40px rgba(53,201,232,.04),0 0 0 82px rgba(53,201,232,.025)}.brand-top,.brand-bottom{position:relative;z-index:2}.brand-badge{display:inline-flex;align-items:center;gap:9px;width:fit-content;padding:8px 11px;border:1px solid rgba(255,255,255,.17);border-radius:999px;background:rgba(255,255,255,.08);font-size:10px;font-weight:850;letter-spacing:.04em}.login-brand h1{max-width:600px;margin:24px 0 0;font-size:clamp(34px,4.6vw,58px);line-height:1.02;letter-spacing:-.055em}.login-brand>div>p{max-width:570px;margin:18px 0 0;color:rgba(255,255,255,.74);font-size:14px;line-height:1.65}.brand-points{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:32px}.brand-point{display:flex;gap:11px;min-height:76px;padding:14px;border:1px solid rgba(255,255,255,.13);border-radius:17px;background:rgba(255,255,255,.07);backdrop-filter:blur(10px)}.brand-point i{display:grid;flex:0 0 34px;width:34px;height:34px;place-items:center;border-radius:11px;color:#d9f8ff;background:rgba(53,201,232,.14)}.brand-point strong,.brand-point span{display:block}.brand-point strong{font-size:11px}.brand-point span{margin-top:4px;color:rgba(255,255,255,.65);font-size:9px;line-height:1.45}.brand-bottom{display:flex;align-items:center;justify-content:space-between;gap:16px;color:rgba(255,255,255,.58);font-size:9px}.brand-bottom span:first-child{display:flex;align-items:center;gap:7px}.brand-bottom i{color:#70e2bd}
.login-container{display:flex;flex-direction:column;justify-content:center;padding:46px 52px}.login-card-header{display:flex;align-items:flex-start;gap:13px;margin-bottom:28px}.login-icon{display:grid;flex:0 0 44px;width:44px;height:44px;place-items:center;border-radius:15px;color:#fff;background:linear-gradient(145deg,var(--blue-dark),var(--blue));box-shadow:0 12px 26px rgba(22,119,232,.22)}.login-card-header h2{margin:0;font-size:25px;letter-spacing:-.035em}.login-card-header p{margin:7px 0 0;color:var(--muted);font-size:11px;line-height:1.55}.field-label{display:block;margin:15px 0 7px;color:#526c86;font-size:10px;font-weight:800}.input-wrap{position:relative;display:flex;align-items:center;height:50px;border:1px solid var(--line);border-radius:14px;background:#f9fcff;transition:.16s ease}.input-wrap:focus-within{border-color:#79b7f5;background:#fff;box-shadow:0 0 0 4px rgba(22,119,232,.08)}.input-wrap>i{position:absolute;left:15px;color:#7d96ae;font-size:13px}.input-wrap input{width:100%;height:100%;padding:0 14px 0 43px;border:0;outline:0;color:var(--ink);background:transparent;font-size:12px}.login-password-wrap input{padding-right:52px}.login-password-toggle{position:absolute!important;z-index:3!important;top:50%!important;right:9px!important;width:34px!important;height:34px!important;min-height:34px!important;padding:0!important;border:0!important;border-radius:10px!important;color:#6c859d!important;background:transparent!important;box-shadow:none!important;transform:translateY(-50%)!important;cursor:pointer!important}.login-password-toggle:hover{color:var(--blue-dark)!important;background:#eaf4ff!important}.login-submit{display:flex;width:100%;height:50px;align-items:center;justify-content:center;gap:9px;margin-top:22px;border:0;border-radius:14px;color:#fff;background:linear-gradient(135deg,var(--blue-dark),var(--blue));box-shadow:0 14px 30px rgba(22,119,232,.22);font-size:11px;font-weight:850;cursor:pointer;transition:.16s ease}.login-submit:hover{transform:translateY(-1px);box-shadow:0 18px 36px rgba(22,119,232,.28)}.login-submit:disabled{cursor:wait;opacity:.7;transform:none}.error{min-height:20px;margin:10px 0 0;color:var(--danger);font-size:10px;line-height:1.45}.login-note{display:flex;gap:10px;margin-top:18px;padding:12px;border:1px solid #cde1f5;border-radius:13px;color:#46637e;background:#f1f8ff;font-size:9px;line-height:1.55}.login-note i{margin-top:2px;color:var(--blue)}.login-links{display:flex;justify-content:space-between;gap:10px;margin-top:17px}.login-links a{color:#58728d;text-decoration:none;font-size:9px;font-weight:750}.login-links a:hover{color:var(--blue-dark)}
@media(max-width:860px){.login-page{padding:12px}.login-shell{grid-template-columns:1fr;min-height:0}.login-brand{min-height:300px;padding:28px}.login-brand h1{font-size:36px}.brand-points{grid-template-columns:1fr 1fr}.brand-bottom{margin-top:28px}.login-container{padding:34px 28px}}
@media(max-width:520px){.login-page{padding:0;background:#fff}.login-shell{border:0;border-radius:0;box-shadow:none}.login-brand{min-height:240px;padding:24px}.login-brand h1{margin-top:16px;font-size:31px}.login-brand>div>p{font-size:11px}.brand-points{display:none}.brand-bottom{margin-top:24px}.login-container{padding:28px 22px 34px}.login-card-header h2{font-size:22px}}
