:root{
 --pf-blue:#0878ed;
 --pf-blue-2:#1e9cf1;
 --pf-navy:#031a3e;
 --pf-navy-2:#062b62;
 --pf-ink:#10233e;
 --pf-muted:#71839d;
 --pf-line:#d9e5f2;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:#fff;color:var(--pf-ink)}
body{min-height:100vh;overflow-x:hidden}
button,input{font:inherit}

.pf-login{min-height:100vh;display:grid;grid-template-columns:minmax(530px,1.08fr) minmax(500px,.92fr);background:#fff}
.pf-login-hero{position:relative;min-height:100vh;overflow:hidden;color:#fff;background:
 radial-gradient(circle at 82% 19%,rgba(20,121,255,.23),transparent 21%),
 radial-gradient(circle at 28% 78%,rgba(0,161,255,.12),transparent 25%),
 linear-gradient(138deg,#021536 0%,#032253 44%,#063878 100%)}
.pf-login-hero:after{content:"";position:absolute;left:-8%;right:-4%;bottom:-22%;height:56%;border-radius:50%;border:1px solid rgba(54,157,255,.13);transform:rotate(-5deg);box-shadow:
 0 -20px 90px rgba(0,128,255,.07),
 inset 0 20px 90px rgba(0,128,255,.035)}
.pf-login-grid{position:absolute;inset:0;opacity:.13;background-image:
 linear-gradient(rgba(62,151,255,.18) 1px,transparent 1px),
 linear-gradient(90deg,rgba(62,151,255,.15) 1px,transparent 1px);
 background-size:54px 54px;mask-image:linear-gradient(to bottom,transparent 0,#000 35%,#000 100%)}
.pf-login-glow{position:absolute;border-radius:50%;filter:blur(2px);opacity:.55;animation:pfFloat 8s ease-in-out infinite}
.glow-a{width:7px;height:7px;background:#28baff;right:18%;top:15%;box-shadow:0 0 20px 6px rgba(40,186,255,.7)}
.glow-b{width:5px;height:5px;background:#46d0ff;left:10%;bottom:19%;box-shadow:0 0 18px 5px rgba(70,208,255,.5);animation-delay:-3s}
.pf-login-orbit{position:absolute;border:1px solid rgba(51,153,255,.18);border-radius:50%;animation:pfOrbit 18s linear infinite}
.orbit-a{width:270px;height:270px;right:-95px;top:8%}.orbit-b{width:410px;height:410px;left:-205px;bottom:-190px;animation-direction:reverse;animation-duration:24s}
@keyframes pfFloat{50%{transform:translateY(-18px) scale(1.08);opacity:.9}}
@keyframes pfOrbit{to{transform:rotate(360deg)}}

.pf-login-hero-inner{position:relative;z-index:2;min-height:100vh;display:flex;flex-direction:column;padding:42px clamp(42px,6vw,78px) 24px}
.pf-login-brand{display:flex;align-items:center;gap:12px;animation:pfIn .65s both}
.pf-login-brand-mark,.pf-login-card-mark{display:grid;place-items:center;overflow:hidden;background:#fff;color:#0877ed;font-weight:950;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.pf-login-brand-mark{width:46px;height:46px;border-radius:13px}.pf-login-brand-mark img,.pf-login-card-mark img{width:100%;height:100%;object-fit:contain;padding:3px}
.pf-login-brand strong{display:block;font-size:17px;letter-spacing:.01em}.pf-login-brand small{display:block;margin-top:2px;font-size:8px;color:#9fb7d5;text-transform:uppercase;letter-spacing:.045em}

.pf-login-copy{margin-top:48px;max-width:620px;animation:pfIn .7s .08s both}
.pf-login-pill{display:inline-flex;align-items:center;gap:7px;padding:7px 11px;border:1px solid rgba(65,166,255,.2);border-radius:999px;background:rgba(13,70,147,.55);box-shadow:inset 0 0 20px rgba(37,140,255,.08);color:#dceeff;font-size:9px;font-weight:800}
.pf-login-pill i{color:#21b9ff}
.pf-login-copy h1{margin:15px 0 12px;font-size:clamp(32px,3.1vw,52px);line-height:1.04;letter-spacing:-.045em;font-weight:900}
.pf-login-copy h1 em{font-style:normal;background:linear-gradient(90deg,#39bfff,#0f82ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.pf-login-copy p{max-width:570px;margin:0;color:#b8cae0;font-size:13px;line-height:1.55}

.pf-login-features{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:23px;max-width:620px;animation:pfIn .72s .15s both}
.pf-login-features article{padding:10px 7px;text-align:center}
.pf-login-features article>span{width:40px;height:40px;display:grid;place-items:center;margin:0 auto 7px;border:1px solid rgba(55,159,255,.17);border-radius:11px;background:linear-gradient(155deg,rgba(11,73,156,.78),rgba(5,42,94,.72));color:#32b8ff;font-size:18px;box-shadow:0 10px 25px rgba(0,0,0,.12)}
.pf-login-features strong{display:block;font-size:9px}.pf-login-features small{display:block;margin-top:3px;color:#8faac9;font-size:7.5px;line-height:1.3}

.pf-login-visual{display:grid;grid-template-columns:1.55fr .82fr .95fr;gap:10px;max-width:620px;margin-top:19px;animation:pfIn .75s .23s both;transform:perspective(900px) rotateX(1.5deg)}
.pf-visual-card{position:relative;min-height:148px;padding:13px;border:1px solid rgba(55,152,255,.22);border-radius:15px;background:linear-gradient(160deg,rgba(7,48,108,.88),rgba(2,25,64,.92));box-shadow:0 18px 45px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.035);overflow:hidden}
.pf-visual-card:after{content:"";position:absolute;width:110px;height:110px;border-radius:50%;right:-55px;top:-55px;background:rgba(31,141,255,.08)}
.pf-visual-head{display:flex;justify-content:space-between;align-items:center;color:#a9c5e5;font-size:7.5px;text-transform:uppercase;font-weight:850;letter-spacing:.05em}.pf-visual-head i{color:#22aaff}
.pf-visual-bars{position:absolute;left:13px;right:13px;bottom:38px;height:55px;display:flex;align-items:flex-end;gap:5px}
.pf-visual-bars i{flex:1;height:var(--h);border-radius:3px 3px 1px 1px;background:linear-gradient(180deg,#22bbff,#0877ed);box-shadow:0 0 12px rgba(25,148,255,.18);animation:pfBars 2.6s ease-in-out infinite alternate}
.pf-visual-bars i:nth-child(2n){animation-delay:-.8s}.pf-visual-bars i:nth-child(3n){animation-delay:-1.3s}
@keyframes pfBars{to{filter:brightness(1.25);transform:scaleY(.92)}}
.pf-visual-line{position:absolute;left:12px;right:12px;bottom:32px;height:62px;opacity:.72}.pf-visual-line svg{width:100%;height:100%;overflow:visible}.pf-visual-line polyline{fill:none;stroke:#3bd5ff;stroke-width:1.4;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px rgba(59,213,255,.6));stroke-dasharray:400;stroke-dashoffset:400;animation:pfDraw 3s 1s forwards}
@keyframes pfDraw{to{stroke-dashoffset:0}}
.visual-main>small{position:absolute;bottom:12px;left:13px;color:#7fa1c8;font-size:7px}
.visual-ring{text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center}.pf-ring{width:64px;height:64px;padding:7px;border-radius:50%;background:conic-gradient(#208dff 0 45%,#8a70ff 45% 68%,rgba(255,255,255,.09) 68%);animation:pfRing 8s linear infinite}.pf-ring>div{width:100%;height:100%;display:grid;place-items:center;border-radius:50%;background:#051d49;color:#4abfff;font-size:19px}.visual-ring strong{margin-top:8px;font-size:10px}.visual-ring small{margin-top:3px;color:#7fa0c4;font-size:7px}
@keyframes pfRing{to{transform:rotate(360deg)}}.pf-ring>div i{animation:pfRing 8s linear infinite reverse}
.visual-alert{display:flex;flex-direction:column}.visual-alert>strong{margin-top:18px;color:#cfe5fb;font-size:9px}.visual-alert>strong i{color:#2bcf91;margin-right:4px}.pf-mini-lines{display:flex;align-items:flex-end;gap:5px;height:38px;margin-top:9px}.pf-mini-lines i{width:17%;height:65%;border-radius:3px 3px 0 0;background:#116ed3}.pf-mini-lines i:nth-child(2){height:88%;background:#2497ef}.pf-mini-lines i:nth-child(3){height:48%}.visual-alert small{margin-top:auto;color:#789bc1;font-size:7px}

.pf-login-hero-foot{display:flex;gap:17px;flex-wrap:wrap;margin-top:auto;padding-top:22px;color:#83a3c7;font-size:7.8px;animation:pfIn .8s .3s both}.pf-login-hero-foot span{display:flex;align-items:center;gap:5px}.pf-login-hero-foot i{color:#49bfff}
@keyframes pfIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.pf-login-panel{position:relative;min-height:100vh;display:grid;place-items:center;padding:42px;background:
 radial-gradient(circle at 12% 14%,rgba(23,132,239,.06),transparent 18%),
 linear-gradient(135deg,#f8fbff,#ffffff 42%,#f3f8ff)}
.pf-login-panel:before{content:"";position:absolute;left:-1px;top:0;bottom:0;width:1px;background:#dce8f5}
.pf-login-panel-pattern{position:absolute;inset:0;opacity:.38;pointer-events:none;background-image:radial-gradient(circle,rgba(31,129,226,.13) 1px,transparent 1px);background-size:18px 18px;mask-image:linear-gradient(135deg,#000 0,transparent 28%,transparent 72%,#000 100%)}

.pf-login-card{position:relative;z-index:2;width:min(480px,100%);padding:34px 38px 25px;border:1px solid rgba(210,225,241,.9);border-radius:25px;background:rgba(255,255,255,.93);box-shadow:0 22px 65px rgba(30,71,116,.13);backdrop-filter:blur(12px);animation:pfCard .65s cubic-bezier(.2,.85,.2,1) both}
@keyframes pfCard{from{opacity:0;transform:translateY(20px) scale(.985)}to{opacity:1;transform:none}}
.pf-login-card-brand{text-align:center}.pf-login-card-mark{width:66px;height:66px;margin:0 auto 11px;border-radius:18px;box-shadow:0 10px 27px rgba(26,100,184,.15)}.pf-login-card-mark span{font-size:31px}.pf-login-card-brand>strong{display:block;font-size:19px;font-weight:900;letter-spacing:-.02em}.pf-login-card-brand>small{display:block;margin-top:4px;color:#7c8ea5;font-size:9px}
.pf-login-separator{width:38px;height:3px;margin:16px auto 22px;border-radius:10px;background:linear-gradient(90deg,#0d76e8,#28b4f4)}
.pf-login-welcome{text-align:center;margin-bottom:21px}.pf-login-welcome h2{margin:0;font-size:24px;letter-spacing:-.03em}.pf-login-welcome p{margin:5px 0 0;color:#71849c;font-size:11px}
.pf-login-alert{display:flex;gap:8px;align-items:flex-start;margin:0 0 14px;padding:10px 11px;border:1px solid #f2cbd0;border-radius:11px;background:#fff4f5;color:#b7323e;font-size:9.5px;line-height:1.4}.pf-login-alert i{margin-top:1px}

.pf-login-field{margin-bottom:15px}.pf-login-field label{display:block;margin-bottom:6px;color:#213b58;font-size:9px;font-weight:850}
.pf-login-control{height:46px;display:grid;grid-template-columns:34px 1fr 38px;align-items:center;border:1px solid #cddbea;border-radius:11px;background:#fff;transition:.18s;overflow:hidden}.pf-login-control.focused{border-color:#1d85eb;box-shadow:0 0 0 3px rgba(29,133,235,.09)}
.pf-login-control>i{justify-self:center;color:#8498b0;font-size:14px}.pf-login-control input{width:100%;height:100%;border:0;outline:0;background:transparent;color:#17334f;font-size:11px}.pf-login-control input::placeholder{color:#9aaabe}.pf-password-toggle{height:100%;border:0;background:transparent;color:#748ba7;cursor:pointer}.pf-password-toggle:hover{color:#147de6}

.pf-login-submit{width:100%;height:47px;margin-top:4px;display:grid;grid-template-columns:28px 1fr 28px;align-items:center;border:0;border-radius:11px;background:linear-gradient(105deg,#086ddc,#1595ef);color:#fff;font-size:10.5px;font-weight:850;cursor:pointer;box-shadow:0 10px 24px rgba(12,113,220,.2);transition:.18s}.pf-login-submit:hover{transform:translateY(-1px);box-shadow:0 14px 28px rgba(12,113,220,.27);filter:brightness(1.025)}.pf-login-submit i:last-child{transition:.18s}.pf-login-submit:hover i:last-child{transform:translateX(3px)}

.pf-login-protection{display:flex;gap:9px;align-items:center;margin-top:18px;padding:10px 11px;border-radius:11px;background:#f3f8fd;color:#55708d}.pf-login-protection>i{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#e2f1ff;color:#1177de}.pf-login-protection strong{display:block;color:#31516f;font-size:8.5px}.pf-login-protection small{display:block;margin-top:2px;font-size:7.5px}
.pf-login-card-foot{display:flex;justify-content:space-between;gap:12px;margin-top:20px;padding-top:14px;border-top:1px solid #e7eef6;color:#94a3b4;font-size:7.5px}

@media(max-height:830px) and (min-width:981px){
 .pf-login-hero-inner{padding-top:28px}.pf-login-copy{margin-top:27px}.pf-login-copy h1{font-size:36px}.pf-login-features{margin-top:14px}.pf-login-visual{margin-top:10px}.pf-visual-card{min-height:122px}.pf-login-card{padding-top:25px;padding-bottom:20px}.pf-login-card-mark{width:55px;height:55px}.pf-login-separator{margin:12px auto 15px}
}
@media(max-width:1100px){
 .pf-login{grid-template-columns:1fr 1fr}.pf-login-hero-inner{padding-left:38px;padding-right:38px}.pf-login-visual{grid-template-columns:1.4fr .8fr}.visual-alert{display:none}.pf-login-features{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
 body{overflow:auto}.pf-login{display:block}.pf-login-hero{min-height:auto}.pf-login-hero-inner{min-height:auto;padding:31px 25px 35px}.pf-login-copy{margin-top:30px}.pf-login-copy h1{font-size:36px}.pf-login-features,.pf-login-visual{display:none}.pf-login-hero-foot{margin-top:30px}.pf-login-panel{min-height:auto;padding:35px 18px 48px}.pf-login-card{width:min(500px,100%)}
}
@media(max-width:520px){
 .pf-login-copy h1{font-size:31px}.pf-login-copy p{font-size:11px}.pf-login-card{padding:28px 22px 21px;border-radius:20px}.pf-login-card-foot{flex-direction:column;align-items:center}.pf-login-hero-foot{gap:10px}
}
@media(prefers-reduced-motion:reduce){
 *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}