:root{--fenogram-yellow:#ffff8a;--fenogram-yellow-dark:#e6e67b;--fenogram-black:#0a0a0a;--fenogram-charcoal:#1a1a1a;--fenogram-white:#f5f5f5;--fenogram-text-gray:#b3b3b3;--transition-smooth:cubic-bezier(0.22,1,0.36,1)}*{margin:0;padding:0;box-sizing:border-box}.login-page-root{font-family:Poppins,sans-serif;background:var(--fenogram-black);color:var(--fenogram-white);overflow:hidden;height:100vh;display:flex;align-items:center;justify-content:center}.login-background{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;overflow:hidden;background:#050508}.login-background:after{inset:0;background:radial-gradient(ellipse at center,transparent 20%,rgba(5,5,8,.82) 100%);z-index:3;pointer-events:none}.orb{position:absolute;will-change:transform,opacity;-webkit-clip-path:polygon(0 0,100% 50%,0 100%);clip-path:polygon(0 0,100% 50%,0 100%)}.orb-1{width:120px;height:120px;background:rgba(255,255,138,.28);filter:blur(6px);top:8%;left:6%;animation:playFloat1 7s ease-in-out infinite}.orb-2{width:80px;height:80px;background:rgba(139,92,246,.45);filter:blur(4px);top:20%;right:8%;animation:playFloat2 9s ease-in-out infinite}.orb-3{width:200px;height:200px;background:rgba(255,100,40,.18);filter:blur(14px);top:45%;left:3%;animation:playFloat3 11s ease-in-out infinite}.orb-4{width:60px;height:60px;background:rgba(0,212,255,.5);filter:blur(3px);bottom:18%;left:18%;animation:playFloat4 6s ease-in-out infinite}.orb-5{width:150px;height:150px;background:rgba(255,64,64,.22);filter:blur(10px);top:10%;right:22%;animation:playFloat5 8s ease-in-out infinite}.orb-6{width:90px;height:90px;background:rgba(34,197,94,.4);filter:blur(5px);bottom:12%;right:10%;animation:playFloat6 10s ease-in-out infinite}.orb-7{width:50px;height:50px;background:rgba(255,105,180,.55);filter:blur(2px);top:55%;right:30%;animation:playFloat7 5s ease-in-out infinite}.login-background:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 600px 500px at 10% 15%,rgba(255,255,138,.12) 0,transparent 70%),radial-gradient(ellipse 400px 400px at 85% 75%,rgba(139,92,246,.1) 0,transparent 70%),radial-gradient(ellipse 350px 300px at 60% 30%,rgba(0,212,255,.07) 0,transparent 70%);z-index:1;pointer-events:none}@keyframes playFloat1{0%,to{transform:translate(0) scale(1) rotate(0deg);opacity:.7}25%{transform:translate(40px,30px) scale(1.15) rotate(5deg);opacity:1}50%{transform:translate(20px,70px) scale(.9) rotate(-3deg);opacity:.6}75%{transform:translate(-20px,40px) scale(1.05) rotate(8deg);opacity:.9}}@keyframes playFloat2{0%,to{transform:translate(0) scale(1) rotate(0deg);opacity:.6}30%{transform:translate(-50px,60px) scale(1.2) rotate(-10deg);opacity:1}60%{transform:translate(-30px,110px) scale(.85) rotate(6deg);opacity:.7}80%{transform:translate(20px,70px) scale(1.1) rotate(-4deg);opacity:.8}}@keyframes playFloat3{0%,to{transform:translate(0) scale(1) rotate(0deg);opacity:.5}35%{transform:translate(60px,-50px) scale(1.1) rotate(12deg);opacity:.8}70%{transform:translate(30px,-90px) scale(.92) rotate(-6deg);opacity:.55}}@keyframes playFloat4{0%,to{transform:translate(0) scale(1) rotate(0deg);opacity:.8}40%{transform:translate(70px,-60px) scale(1.3) rotate(15deg);opacity:1}70%{transform:translate(40px,-100px) scale(.8) rotate(-8deg);opacity:.6}}@keyframes playFloat5{0%,to{transform:translate(0) scale(1) rotate(0deg);opacity:.5}25%{transform:translate(-60px,50px) scale(1.12) rotate(-12deg);opacity:.8}55%{transform:translate(-90px,20px) scale(.88) rotate(7deg);opacity:.6}80%{transform:translate(-40px,80px) scale(1.05) rotate(-5deg);opacity:.75}}@keyframes playFloat6{0%,to{transform:translate(0) scale(1) rotate(0deg);opacity:.7}50%{transform:translate(-80px,-70px) scale(1.2) rotate(20deg);opacity:1}}@keyframes playFloat7{0%,to{transform:translate(0) rotate(0deg);opacity:.9}33%{transform:translate(50px,-40px) rotate(10deg);opacity:.5}66%{transform:translate(-30px,-20px) rotate(-8deg);opacity:1}}.login-container{position:relative;z-index:10;width:100%;max-width:480px;padding:20px}.login-card{background:rgba(0,0,0,.25);backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);border:1px solid hsla(0,0%,100%,.15);border-left:5px solid var(--fenogram-yellow);border-radius:3px;padding:50px 40px}.login-header{text-align:center;margin-bottom:40px}.login-logo{height:60px;margin-bottom:20px}.login-header h1{font-size:28px;font-weight:700;margin-bottom:8px;color:var(--fenogram-white);letter-spacing:2px}.login-header p{font-size:14px;color:var(--fenogram-text-gray)}.login-form{display:flex;flex-direction:column;gap:12px}.form-group{margin-bottom:0}.form-group label{display:none}.form-group input{width:100%;background:hsla(0,0%,100%,.08);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:1px solid hsla(0,0%,100%,.15);border-radius:3px;color:var(--fenogram-white);padding:12px 16px;font-size:.9rem;font-family:Poppins,sans-serif;font-weight:200;transition:all .2s var(--transition-smooth)}.form-group input:focus{outline:none;background-color:hsla(0,0%,100%,.12);border-color:hsla(0,0%,100%,.25)}.form-group input::placeholder{color:hsla(0,0%,100%,.6)}.password-wrapper{position:relative;width:100%}.password-wrapper input{width:100%;padding-right:50px}.password-toggle{position:absolute;right:12px;top:50%;transform:translateY(-50%);background:none;border:none;color:hsla(0,0%,100%,.5);cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;transition:color .3s;z-index:2}.password-toggle:hover{color:var(--fenogram-yellow)}.form-options{display:flex;justify-content:space-between;align-items:center;font-size:13px;margin-top:12px;flex-wrap:wrap;gap:12px}.login-form .checkbox-container{display:flex;align-items:center;gap:8px;cursor:pointer;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:auto;height:auto;justify-content:flex-start}.login-form .checkbox-container input{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.login-form .checkmark{width:18px;height:18px;flex-shrink:0;position:static;background:hsla(0,0%,100%,.08);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2px solid hsla(0,0%,100%,.15);border-radius:3px;transition:all .3s var(--transition-smooth);display:flex;align-items:center;justify-content:center}.login-form .checkbox-container:hover .checkmark{border-color:var(--fenogram-yellow)}.login-form .checkbox-container input:checked~.checkmark{background:var(--fenogram-yellow);border-color:var(--fenogram-yellow)}.login-form .checkbox-container input:checked~.checkmark:after{content:"✓";color:var(--fenogram-black);font-size:12px;font-weight:700}.login-form .checkbox-label{color:var(--fenogram-text-gray)}.forgot-link{color:var(--fenogram-yellow);text-decoration:none;font-weight:600;transition:all .3s var(--transition-smooth)}.forgot-link:hover{color:var(--fenogram-yellow-dark);text-decoration:underline}.login-button{width:100%;padding:14px 28px;background-color:rgba(255,255,138,.12);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border:none;border-left:5px solid var(--fenogram-yellow);border-radius:3px;color:var(--fenogram-white);font-size:.9rem;font-weight:600;font-family:Poppins,sans-serif;cursor:pointer;transition:all .2s var(--transition-smooth);display:flex;align-items:center;justify-content:center;gap:10px;margin-top:8px}.login-button:hover{background-color:rgba(255,255,138,.2)}.login-button:active{transform:translateX(2px)}.login-button svg{flex-shrink:0}.login-button.loading{pointer-events:none;opacity:.7}.login-button.loading span{opacity:0}.login-button.loading:after{content:"";position:absolute;width:20px;height:20px;border:3px solid var(--fenogram-white);border-top:3px solid transparent;border-radius:50%;animation:spin .6s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.login-footer{text-align:center;margin-top:30px;padding-top:30px;border-top:1px solid var(--border-color)}.login-footer p{font-size:12px;color:var(--fenogram-text-gray)}.error-message{background:rgba(239,68,68,.1);border:1px solid rgba(239,68,68,.3);color:#ef4444;padding:12px 16px;border-radius:8px;font-size:13px;text-align:center;animation:shake .5s}@keyframes shake{0%,to{transform:translateX(0)}10%,30%,50%,70%,90%{transform:translateX(-5px)}20%,40%,60%,80%{transform:translateX(5px)}}.success-message{background:rgba(34,197,94,.1);border:1px solid rgba(34,197,94,.3);color:#22c55e;padding:12px 16px;border-radius:8px;font-size:13px;text-align:center;animation:fadeIn .3s}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width:768px){.login-container{padding:16px}.login-card{padding:40px 30px;border-radius:3px}.login-logo{height:50px}.login-header h1{font-size:24px}.form-options{flex-direction:row;justify-content:space-between;align-items:center;gap:8px}}@media (max-width:480px){.login-card{padding:30px 24px}.login-header h1{font-size:22px}.form-group input{padding:12px 16px}.login-button{padding:14px 20px}}.login-background:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle,transparent 20%,rgba(0,0,0,.5) 100%);z-index:1}