.login-page{background:radial-gradient(circle,#1a1c38 0%,#0a0b1e 60%,#020204 100%);width:100%;height:100dvh;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;animation:.5s both page-fadein;display:flex;position:relative;overflow:hidden}@keyframes page-fadein{0%{opacity:0}to{opacity:1}}.login-page:before{content:"";pointer-events:none;z-index:0;background:radial-gradient(circle,#6366f114 0%,#0000 70%);width:80vw;height:80vh;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.login-bg-grid{opacity:.6;pointer-events:none;z-index:0;background-image:linear-gradient(#ffffff08 1px,#0000 1px),linear-gradient(90deg,#ffffff08 1px,#0000 1px);background-size:50px 50px;position:absolute;inset:0}.login-particles{pointer-events:none;z-index:0;position:absolute;inset:0;overflow:hidden}.particle{background:#ffffff26;border-radius:50%;width:4px;height:4px;animation:linear infinite particle-float;position:absolute}.particle:first-child{width:3px;height:3px;animation-duration:12s;animation-delay:0s;left:10%}.particle:nth-child(2){width:5px;height:5px;animation-duration:15s;animation-delay:2s;left:25%}.particle:nth-child(3){animation-duration:11s;animation-delay:4s;left:40%}.particle:nth-child(4){width:6px;height:6px;animation-duration:14s;animation-delay:1s;left:55%}.particle:nth-child(5){width:3px;height:3px;animation-duration:13s;animation-delay:3s;left:70%}.particle:nth-child(6){animation-duration:16s;animation-delay:5s;left:85%}.particle:nth-child(7){width:5px;height:5px;animation-duration:10s;animation-delay:6s;left:50%}.particle:nth-child(8){width:2px;height:2px;animation-duration:18s;animation-delay:7s;left:15%}@keyframes particle-float{0%{opacity:0;transform:translateY(100vh)rotate(0)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-100px)rotate(720deg)}}.login-brand-panel{display:none}.login-form-panel{z-index:2;background:0 0;flex:1;justify-content:center;align-items:center;min-height:0;padding:clamp(1rem,4vw,2.5rem);display:flex;position:relative;overflow:hidden auto}.login-mobile-brand{text-align:center;margin-bottom:clamp(1.25rem,4vw,2rem)}.login-mobile-brand img{object-fit:contain;background:#ffffff0d;border:1.5px solid #fff3;border-radius:14px;width:60px;height:60px;margin-bottom:.85rem;box-shadow:0 4px 15px #0000004d,0 0 20px #6366f14d}.login-mobile-brand h1{color:#fff;letter-spacing:-.5px;margin-bottom:.25rem;font-size:clamp(1.5rem,5vw,1.8rem);font-weight:800}.login-mobile-brand p{color:#ffffff80;font-size:clamp(.82rem,2.5vw,.9rem)}.login-container{z-index:2;width:100%;max-width:440px;margin-block:auto;animation:.7s cubic-bezier(.22,1,.36,1) both container-entrance;position:relative}@keyframes container-entrance{0%{opacity:0;transform:translateY(24px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.login-card{-webkit-backdrop-filter:blur(28px);color:#fff;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:24px;padding:clamp(1.5rem,5vw,2.25rem);position:relative;overflow:hidden;box-shadow:0 25px 60px #00000059,inset 0 0 0 1px #ffffff0d,inset 0 1px #ffffff14}.login-card:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1f 20%,#ffffff40 50%,#ffffff1f 80%,#0000);height:1px;position:absolute;top:0;left:0;right:0}.login-card:after{content:"";pointer-events:none;background:linear-gradient(to bottom right,#0000 40%,#ffffff04 45%,#ffffff08 50%,#ffffff04 55%,#0000 60%);width:200%;height:200%;animation:8s ease-in-out infinite card-sheen;position:absolute;top:-50%;left:-50%}@keyframes card-sheen{0%,to{transform:translate(-30%,-30%)rotate(45deg)}50%{transform:translate(30%,30%)rotate(45deg)}}.role-selector{background:#ffffff0a;border-radius:14px;grid-template-columns:1fr 1fr 1fr;gap:.4rem;margin-bottom:1.25rem;padding:.3rem;display:grid}.role-btn{cursor:pointer;color:#ffffff73;background:0 0;border:none;border-radius:11px;justify-content:center;align-items:center;gap:.4rem;padding:clamp(.55rem,2vw,.75rem) .5rem;font-family:inherit;font-size:clamp(.78rem,2.5vw,.88rem);font-weight:600;transition:all .35s cubic-bezier(.4,0,.2,1);display:flex}.role-btn i{font-size:.82rem;transition:transform .3s,color .3s}.role-btn:hover{color:#ffffffbf;background:#ffffff08}.role-btn:hover i{transform:scale(1.15)}.role-btn.active{color:#fff;background:linear-gradient(135deg,#6366f14d,#8b5cf633);box-shadow:0 4px 18px #6366f140,inset 0 0 0 1px #6366f126}.role-btn.active i{color:#a5b4fc}.login-error{color:#fca5a5;background:#ef44441a;border:1px solid #ef444433;border-radius:12px;align-items:center;gap:.5rem;margin-bottom:1rem;padding:.65rem .85rem;font-size:.82rem;animation:.5s shake;display:none}.login-error.show{display:flex}@keyframes shake{0%,to{transform:translate(0)}20%{transform:translate(-6px)}40%{transform:translate(6px)}60%{transform:translate(-4px)}80%{transform:translate(4px)}}.login-hint{color:#ffffff8c;background:#6366f112;border:1px solid #6366f11f;border-radius:12px;margin-bottom:1.25rem;padding:.6rem .85rem;font-size:.75rem;line-height:1.65}.login-hint strong{color:#a5b4fc}.form-group{margin-bottom:1rem;position:relative}.form-input-wrapper{position:relative}.form-icon{color:#ffffff40;z-index:2;pointer-events:none;font-size:.88rem;transition:color .3s;position:absolute;top:50%;left:1rem;transform:translateY(-50%)}.form-input{color:#fff;caret-color:#6366f1;background:#ffffff0a;border:1px solid #ffffff12;border-radius:12px;width:100%;padding:.9rem 1rem .9rem 2.75rem;font-family:inherit;font-size:.92rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.form-input::placeholder{color:#ffffff4d}.form-input:focus{background:#ffffff0f;border-color:#6366f180;outline:none;box-shadow:0 0 0 3px #6366f11a,0 0 24px #6366f10f}.form-input:focus~.form-icon{color:#6366f1}.floating-label{color:#ffffff4d;pointer-events:none;z-index:2;font-size:.88rem;font-weight:500;transition:all .25s cubic-bezier(.4,0,.2,1);position:absolute;top:50%;left:2.75rem;transform:translateY(-50%)}.form-input:focus~.floating-label,.form-input:not(:placeholder-shown)~.floating-label{color:#818cf8;letter-spacing:.5px;background:linear-gradient(135deg,#171340,#221d5e);border-radius:4px;padding:.08rem .45rem;font-size:.68rem;font-weight:600;top:-.1rem;left:.75rem}.toggle-password{cursor:pointer;color:#ffffff40;z-index:2;background:0 0;border:none;border-radius:6px;padding:.3rem;font-size:.95rem;transition:all .3s;position:absolute;top:50%;right:1rem;transform:translateY(-50%)}.toggle-password:hover{color:#ffffffa6;background:#ffffff0d}.form-options{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:1.5rem;display:flex}.remember-me{color:#ffffff73;cursor:pointer;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.remember-me input[type=checkbox]{accent-color:#6366f1;cursor:pointer;width:16px;height:16px}.forgot-password{color:#818cf8;font-size:.85rem;font-weight:600;text-decoration:none;transition:all .3s}.forgot-password:hover{color:#a5b4fc}.login-btn{cursor:pointer;color:#fff;text-transform:uppercase;letter-spacing:1.5px;background:linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%);border:none;border-radius:14px;justify-content:center;align-items:center;gap:.5rem;width:100%;padding:.9rem;font-family:inherit;font-size:.92rem;font-weight:700;transition:all .35s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.login-btn:before{content:"";background:linear-gradient(90deg,#0000,#ffffff1f,#0000);width:100%;height:100%;transition:left .6s;position:absolute;top:0;left:-100%}.login-btn:hover{transform:translateY(-2px);box-shadow:0 12px 35px #6366f166}.login-btn:hover:before{left:100%}.login-btn:active{transform:translateY(0)}.login-btn.loading{pointer-events:none;opacity:.85}.login-btn.loading i{animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.login-footer{text-align:center;color:#ffffff59;margin-top:clamp(1rem,3vw,1.5rem);font-size:.85rem}.login-footer a{color:#ffffffb3;font-weight:600;text-decoration:none;transition:all .3s}.login-footer a:hover{color:#fff}@media (min-width:1024px){.login-mobile-brand{display:none}.login-brand-panel{background:#0000001a;border-right:1px solid #ffffff0d;flex-direction:column;justify-content:center;align-items:center;width:55%;padding:clamp(2rem,4vw,4rem);display:flex;position:relative;overflow:hidden}.login-brand-panel:before{content:"";pointer-events:none;background:radial-gradient(60% 50% at 20% 30%,#6366f11a 0%,#0000 70%),radial-gradient(40% 50% at 80% 70%,#8b5cf60d 0%,#0000 70%);animation:12s ease-in-out infinite alternate mesh-drift;position:absolute;inset:0}@keyframes mesh-drift{0%{opacity:.8;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}.login-brand-panel:after{content:"";pointer-events:none;background:radial-gradient(circle,#6366f126 0%,#0000 70%);border-radius:50%;width:250px;height:250px;animation:10s ease-in-out infinite float-orb;position:absolute;bottom:10%;left:15%}@keyframes float-orb{0%,to{transform:translate(0)}50%{transform:translate(20px,-30px)}}.brand-content{z-index:2;text-align:center;max-width:450px;animation:1s cubic-bezier(.22,1,.36,1) .2s both brand-entrance;position:relative}@keyframes brand-entrance{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.brand-logo-wrapper{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff08;border:2px solid #ffffff26;border-radius:20px;width:88px;height:88px;margin:0 auto 1.75rem;padding:6px;text-decoration:none;display:block;position:relative;box-shadow:0 10px 30px #0000004d,0 0 30px #6366f14d,0 0 60px #6366f126}.brand-logo-wrapper img{object-fit:contain;filter:drop-shadow(0 2px 4px #0003);border-radius:14px;width:100%;height:100%}.brand-title{color:#fff;letter-spacing:-1px;margin-bottom:.5rem;font-size:clamp(2rem,3.5vw,3rem);font-weight:800;line-height:1.1}.brand-title .text-gradient{background:linear-gradient(135deg,#818cf8,#a78bfa,#c084fc);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.brand-subtitle{color:#ffffff8c;letter-spacing:.3px;margin-bottom:1.75rem;font-size:clamp(.95rem,1.5vw,1.15rem);font-weight:500}.brand-tagline{color:#ffffff59;max-width:380px;margin:0 auto 2.5rem;font-size:.88rem;line-height:1.6}.brand-stats{justify-content:center;gap:clamp(2rem,4vw,3.5rem);display:flex}.brand-stat{text-align:center}.brand-stat-value{color:#fff;letter-spacing:-.5px;font-size:1.6rem;font-weight:800}.brand-stat-label{color:#ffffff59;text-transform:uppercase;letter-spacing:1.5px;margin-top:.3rem;font-size:.72rem;font-weight:600}.login-form-panel{background:0 0;flex:none;justify-content:center;align-items:center;width:45%}}@media (max-width:480px){.login-card{border-radius:20px;padding:1.5rem}.role-btn{padding:.55rem .25rem;font-size:.76rem}.form-input{padding:.8rem 1rem .8rem 2.4rem;font-size:.88rem}}
