:root{--login-primary:#1769aa;--login-accent:#f8c52c;--login-dark:#0d2740;--login-text:#243746}
*{box-sizing:border-box}html,body{min-height:100%;margin:0}
body.login-page{font-family:"Segoe UI",Arial,sans-serif;color:var(--login-text);background:linear-gradient(135deg,#071d31 0%,#124e78 52%,#1b78a4 100%);overflow-x:hidden;display:flex;align-items:center;justify-content:center;padding:24px}
.login-background{position:fixed;inset:0;overflow:hidden;pointer-events:none}.login-background:before{content:"";position:absolute;width:70vmax;height:70vmax;left:-25vmax;top:-35vmax;border:1px solid rgba(255,255,255,.12);border-radius:42%;animation:loginSpin 28s linear infinite}.login-background:after{content:"";position:absolute;width:55vmax;height:55vmax;right:-20vmax;bottom:-32vmax;border:1px solid rgba(248,197,44,.25);border-radius:44%;animation:loginSpin 22s linear infinite reverse}
.login-background span{position:absolute;border-radius:50%;background:rgba(255,255,255,.08);box-shadow:0 0 35px rgba(255,255,255,.05);animation:loginFloat 8s ease-in-out infinite}.login-background span:nth-child(1){width:90px;height:90px;left:12%;top:18%}.login-background span:nth-child(2){width:42px;height:42px;right:18%;top:24%;animation-delay:-2s}.login-background span:nth-child(3){width:120px;height:120px;right:9%;bottom:14%;animation-delay:-4s}.login-background span:nth-child(4){width:55px;height:55px;left:20%;bottom:16%;animation-delay:-6s}
.container{position:relative;z-index:1;width:100%}.login-shell{--mouse-x:0deg;--mouse-y:0deg;display:grid;grid-template-columns:minmax(320px,1fr) 410px;align-items:stretch;max-width:940px;margin:auto;border:1px solid rgba(255,255,255,.18);border-radius:26px;background:rgba(3,18,31,.28);box-shadow:0 30px 90px rgba(0,0,0,.38);backdrop-filter:blur(12px);transition:transform .35s ease;transform:perspective(1400px) rotateX(var(--mouse-y)) rotateY(var(--mouse-x))}.card-container.card{width:100%}.card{position:relative;background:rgba(255,255,255,.97);padding:34px 38px 30px;margin:0;border-radius:0 25px 25px 0;border:0;box-shadow:-18px 0 55px rgba(0,0,0,.16);overflow:hidden}.card:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:linear-gradient(90deg,var(--login-accent),#ffdf70,var(--login-primary),var(--login-accent));background-size:220% 100%;animation:loginBorder 5s linear infinite}
.vault-scene{position:relative;min-height:590px;overflow:hidden;border-radius:25px 0 0 25px;background:radial-gradient(circle at 50% 45%,#173e5c 0,#0b253a 38%,#061725 75%);color:#fff}.vault-grid{position:absolute;inset:0;opacity:.22;background-image:linear-gradient(rgba(70,190,255,.15) 1px,transparent 1px),linear-gradient(90deg,rgba(70,190,255,.15) 1px,transparent 1px);background-size:30px 30px;mask-image:linear-gradient(to bottom,transparent,#000 25%,#000 75%,transparent)}.vault-caption{position:absolute;left:36px;top:35px;z-index:3;display:flex;flex-direction:column}.vault-caption span{font-size:10px;letter-spacing:4px;color:#67d9ff}.vault-caption strong{font-size:25px;margin-top:5px}.vault-caption small{color:#91aabc;margin-top:5px}.vault-box{position:absolute;width:280px;height:245px;left:50%;top:53%;transform:translate(-50%,-50%);border:2px solid #38566b;border-radius:24px;background:linear-gradient(145deg,#1b3448,#0a1c2b);box-shadow:inset 0 0 0 7px #0b2233,inset 0 0 40px rgba(71,197,255,.08),0 28px 60px rgba(0,0,0,.55);transition:box-shadow .4s,transform .4s}.vault-box:before{content:"SECURE CORE  •  IGCF-01";position:absolute;left:22px;top:18px;font-size:8px;letter-spacing:2px;color:#66859b}.vault-bolt{position:absolute;width:9px;height:9px;border-radius:50%;background:#6c8799;box-shadow:inset 1px 1px 2px #b7cad5,0 0 8px rgba(89,211,255,.2)}.b1{left:14px;top:14px}.b2{right:14px;top:14px}.b3{left:14px;bottom:14px}.b4{right:14px;bottom:14px}.vault-door{position:absolute;width:132px;height:132px;left:74px;top:52px;border-radius:50%;background:radial-gradient(circle,#263f52 0 19%,#102839 20% 38%,#395468 39% 42%,#0d2232 43% 60%,#2a475b 61% 64%,#0b1e2d 65%);box-shadow:0 0 0 5px #061722,0 8px 25px #000;transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .4s}.vault-ring{position:absolute;inset:13px;border:1px solid rgba(101,213,255,.3);border-radius:50%;transition:transform .7s}.ring-b{inset:27px;border-style:dashed}.vault-hub{position:absolute;inset:43px;border-radius:50%;background:#203f55;border:2px solid #52738a;box-shadow:0 0 14px rgba(70,198,255,.18)}.vault-hub i{position:absolute;width:5px;height:42px;left:20px;top:-17px;border-radius:4px;background:linear-gradient(#84a9bc,#29485d);transform-origin:50% 38px}.vault-hub i:nth-child(2){transform:rotate(120deg)}.vault-hub i:nth-child(3){transform:rotate(240deg)}.vault-status{position:absolute;left:35px;right:35px;bottom:22px;display:flex;align-items:center;justify-content:center;gap:8px;color:#6f8da1;font-size:8px;letter-spacing:1.4px}.status-light{width:7px;height:7px;border-radius:50%;background:#efb62c;box-shadow:0 0 8px #efb62c}.login-shell.is-active .vault-box{box-shadow:inset 0 0 0 7px #0b2233,inset 0 0 45px rgba(71,197,255,.18),0 28px 70px rgba(0,0,0,.6),0 0 35px rgba(52,184,238,.18)}.login-shell.is-active .vault-door{transform:rotate(18deg);filter:brightness(1.12)}.login-shell.has-user .ring-a{transform:rotate(80deg)}.login-shell.has-password .ring-b{transform:rotate(-150deg)}.login-shell.has-password .status-light{background:#48df9b;box-shadow:0 0 12px #48df9b}.login-shell.is-unlocking .vault-door{transform:rotate(190deg) scale(.92);filter:brightness(1.35)}
.profile-img-card{display:block;max-width:230px;width:auto;height:105px;object-fit:contain;margin:0 auto 8px}.login-title{font-size:26px;text-align:center;color:var(--login-dark);margin:4px 0 2px;font-weight:700}.profile-name-card{text-align:center;color:#6b7c89;font-size:14px;margin:0 0 25px}.form-signin label{display:block;font-size:13px;color:#465b6b;margin:0 0 6px;font-weight:600}.form-signin .form-control{height:46px;border:1px solid #d8e1e8;border-radius:10px;padding:10px 13px;margin-bottom:16px;box-shadow:none;transition:border-color .2s,box-shadow .2s,transform .2s}.form-signin .form-control:focus{border-color:var(--login-primary);box-shadow:0 0 0 3px rgba(23,105,170,.14);transform:translateY(-1px)}
.btn.btn-signin{height:47px;border:0;border-radius:11px;background:linear-gradient(135deg,var(--login-primary),#0d4d7e);color:#fff;font-weight:700;font-size:15px;cursor:pointer;margin:4px 0 15px;box-shadow:0 9px 20px rgba(23,105,170,.25);transition:transform .2s,box-shadow .2s}.btn.btn-signin:hover,.btn.btn-signin:focus{color:#fff;transform:translateY(-2px);box-shadow:0 12px 24px rgba(23,105,170,.34)}.forgot-password{display:block;text-align:center;color:var(--login-primary);font-size:13px;font-weight:600;text-decoration:none}.forgot-password:hover{color:#0d4d7e;text-decoration:underline}.alert{border-radius:10px;font-size:13px}.reauth-email{display:none}.recovery-layout{width:100%;min-height:calc(100vh - 48px);display:flex;align-items:center;justify-content:center;padding:0}.recovery-card{width:100%;max-width:480px;margin:0}.recovery-card p{color:#667986}.login-back{display:block;text-align:center;margin-top:15px;color:var(--login-primary)}
@keyframes loginSpin{to{transform:rotate(360deg)}}@keyframes loginFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-24px)}}@keyframes loginBorder{to{background-position:220% 0}}
@media(max-width:820px){.login-shell{display:block;max-width:440px;transform:none!important}.vault-scene{min-height:190px;border-radius:24px 24px 0 0}.vault-caption{left:24px;top:22px}.vault-caption strong{font-size:19px}.vault-caption small{display:none}.vault-box{width:190px;height:145px;left:auto;right:8px;top:50%;transform:translateY(-50%) scale(.68);transform-origin:right center}.card{border-radius:0 0 24px 24px;box-shadow:0 -12px 35px rgba(0,0,0,.15)}}@media(max-width:520px){body.login-page{display:block;padding:14px;min-height:100vh}.container{padding:0}.login-shell{margin:0 auto}.card{padding:28px 22px 24px}.vault-scene{min-height:150px}.vault-caption{left:20px;top:22px;max-width:52%;z-index:4}.vault-caption strong{font-size:18px;line-height:1.25}.vault-box{left:auto;right:8px;top:50%;transform:translateY(-50%) scale(.52);transform-origin:right center}.profile-img-card{height:78px;max-width:180px}.login-title{font-size:23px}}@media(hover:none),(pointer:coarse){.login-shell{transform:none!important}}@media(prefers-reduced-motion:reduce){.login-background:before,.login-background:after,.login-background span,.card:before{animation:none}.login-shell,.vault-box,.vault-door,.vault-ring,.form-signin .form-control,.btn.btn-signin{transition:none}.login-shell{transform:none}}
