:root{--login-navy:#10213b;--login-deep:#09172c;--login-mint:#70edc1;--login-blue:#45a8ff;--login-text:#eef5ff;--login-muted:#9aabc2}
body.login-page{min-height:100svh;display:grid;place-items:center;padding:32px;background:radial-gradient(ellipse at 18% 15%,#1e467b80,transparent 38%),radial-gradient(ellipse at 85% 85%,#114e6870,transparent 34%),linear-gradient(135deg,#09172c,#10213b 54%,#0b1a30);color:var(--login-text);font-family:Inter,'DM Sans','Segoe UI',sans-serif;overflow-x:hidden}
.login-page:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.15;background-image:linear-gradient(#99c9f40c 1px,transparent 1px),linear-gradient(90deg,#99c9f40c 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(90deg,#000,transparent 80%)}
.login-layout{position:relative;width:min(1030px,100%);min-height:610px;display:grid;grid-template-columns:1fr .82fr;border:1px solid #ffffff18;border-radius:28px;overflow:hidden;background:#0e1d32b8;box-shadow:0 35px 100px #02091780;backdrop-filter:blur(16px)}
.login-intro{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:38px 46px;overflow:hidden;background:linear-gradient(145deg,#162c4b99,#10244075)}
.login-brand{position:relative;z-index:1;display:flex;align-items:center;gap:13px;color:#f5f8fd;text-decoration:none;font:800 17px/1.1 Manrope,'Segoe UI',sans-serif;letter-spacing:-.3px}
.login-brand img{width:51px;height:51px;object-fit:cover;border-radius:50%;box-shadow:0 0 0 1px #6fe8ce70,0 0 26px #31bcbb40}
.login-brand small{display:block;margin-top:6px;color:#9bb3cf;font:700 8px/1 'DM Sans','Segoe UI',sans-serif;letter-spacing:1.3px}
.intro-copy{position:relative;z-index:1;max-width:420px;margin:45px 0 30px}
.intro-kicker{display:inline-flex;align-items:center;gap:9px;color:#8be9c5;font-size:10px;font-weight:800;letter-spacing:1.5px}
.intro-kicker i{width:7px;height:7px;border-radius:50%;background:var(--login-mint);box-shadow:0 0 14px #70edc1}
.intro-copy h1{margin:20px 0 14px;font:800 clamp(34px,4.6vw,54px)/1.06 Manrope,'Segoe UI',sans-serif;letter-spacing:-2px;color:#f4f8ff}
.intro-copy p{max-width:375px;margin:0;color:#a7b7cc;font-size:14px;line-height:1.75}
.intro-bottom{position:relative;z-index:1;display:flex;align-items:center;gap:12px;color:#e6f2ff}
.intro-orbit{width:39px;height:39px;border:1px solid #70edc166;border-radius:13px;display:grid;place-items:center;background:#70edc114;color:var(--login-mint);font-size:17px}
.intro-bottom b,.intro-bottom small{display:block}.intro-bottom b{font-size:11px}.intro-bottom small{margin-top:4px;color:#8fa4bf;font-size:10px}
.intro-glow{position:absolute;width:340px;height:340px;border:1px solid #7cebdc16;border-radius:50%;right:-140px;top:155px;box-shadow:0 0 0 34px #75ded90a,0 0 0 72px #75ded906}
.login-side{position:relative;z-index:1;display:flex;flex-direction:column;justify-content:center;padding:44px clamp(28px,5vw,58px) 24px;background:linear-gradient(150deg,#0a1729d9,#0a1729f5);border-left:1px solid #ffffff12}
.login-card{width:100%;max-width:370px;margin:auto;background:none;border:0;box-shadow:none;padding:0;border-radius:0}
.login-card-logo{display:none}.eyebrow{font-size:9px;color:#77e5c0;letter-spacing:1.45px;font-weight:800}
.login-card h2{margin:12px 0 7px;font:750 29px/1.15 Manrope,'Segoe UI',sans-serif;letter-spacing:-.8px;color:#f3f7ff}
.login-description{font-size:12px;line-height:1.6;color:#92a4bc;margin:0 0 27px}
.login-card form{display:grid;gap:18px}
.login-card label{gap:8px;color:#c5d1df;font-size:11px;font-weight:600}
.login-input-wrap{height:49px;display:flex;align-items:center;gap:11px;border:1px solid #ffffff1c;border-radius:11px;background:#ffffff08;padding:0 14px;transition:border-color .18s,box-shadow .18s,background .18s}
.login-input-wrap:focus-within{border-color:#69dabb9c;background:#ffffff0d;box-shadow:0 0 0 4px #49d4b315}
.input-icon{width:17px;color:#78b8d7;text-align:center;font-size:15px}
.login-card .login-input-wrap input{flex:1;width:100%;height:100%;min-width:0;border:0;border-radius:0;padding:0;outline:0;background:transparent;color:#f4f8ff;font-size:12px;box-shadow:none}
.login-card .login-input-wrap input::placeholder{color:#63758d}
.login-card .button.primary{height:49px;margin-top:3px;padding:0 16px 0 19px;border:1px solid #75e8c4;color:#092032;background:linear-gradient(105deg,#8cf0c5,#4cc6d3);border-radius:11px;font-size:12px;font-weight:800;box-shadow:0 8px 25px #28bba733;transition:transform .18s,filter .18s}
.login-card .button.primary:hover{background:linear-gradient(105deg,#a1f4d3,#64d7e0);filter:brightness(1.04);transform:translateY(-1px)}
.login-arrow{width:27px;height:27px;display:grid;place-items:center;border-radius:8px;background:#08223b20;font-size:17px}
.error-text{min-height:14px;color:#ff9d9d;font-size:11px}
.security-note{display:flex;align-items:center;gap:11px;margin-top:24px;padding:14px 0 0;border-top:1px solid #ffffff16;color:#eef5ff;font-size:10px}
.security-check{width:28px;height:28px;flex:0 0 28px;border-radius:9px;display:grid;place-items:center;background:#61dca91c;color:#74e6b4;font-weight:800}
.security-note b,.security-note small{display:block}.security-note b{font-size:10px}.security-note small{margin-top:3px;color:#8599b1;font-size:9px}
.login-footer{width:100%;max-width:370px;margin:22px auto 0;display:flex;justify-content:space-between;gap:10px;color:#71849d;font-size:9px}.login-footer span:last-child{color:#8395ab}
@media(max-width:760px){body.login-page{padding:14px;place-items:center}.login-layout{width:min(480px,100%);min-height:0;grid-template-columns:1fr;border-radius:22px}.login-intro{min-height:240px;padding:23px 25px 21px}.login-brand img{width:42px;height:42px}.intro-copy{margin:30px 0 22px}.intro-copy h1{font-size:34px;letter-spacing:-1.2px;margin:13px 0 8px}.intro-copy p{font-size:11px;line-height:1.55;max-width:330px}.intro-kicker{font-size:8px}.intro-bottom{display:none}.intro-glow{width:190px;height:190px;right:-95px;top:60px}.login-side{padding:29px 25px 20px;border-left:0;border-top:1px solid #ffffff12}.login-card h2{font-size:25px}.login-description{margin-bottom:21px}.login-card form{gap:14px}.login-input-wrap,.login-card .button.primary{height:47px}.login-footer{margin-top:18px;font-size:8px}}
@media(max-width:380px){.login-intro{min-height:220px;padding:19px}.login-side{padding:24px 19px 17px}.intro-copy h1{font-size:30px}.login-footer{flex-direction:column;align-items:center;gap:5px}}
