*{margin:0;padding:0;box-sizing:border-box}body{background-color:#0a0a0a;font-family:Inter,sans-serif;height:100vh;overflow:hidden;position:relative}.gradient-text{background:linear-gradient(90deg,#f60,#f93);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.login-header{position:fixed;top:0;left:0;right:0;z-index:10;background:rgba(10,10,10,.6);backdrop-filter:blur(10px);border-bottom:1px solid rgba(255,102,0,.2);height:60px;display:flex;align-items:center}.header-content{width:100%;max-width:1200px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center}.logo-container{display:flex;align-items:center;gap:12px}.logo-container img{height:35px;width:auto}.logo-text h1{font-family:Orbitron,sans-serif;font-size:1.1rem;font-weight:700;background:linear-gradient(90deg,#f60,#f93);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.logo-text p{color:#9ca3af;font-size:.7rem}.back-btn{background:rgba(255,102,0,.1);border:1px solid rgba(255,102,0,.3);color:#f60;padding:8px 16px;border-radius:30px;font-size:.9rem;display:flex;align-items:center;gap:8px;transition:all .3s ease;text-decoration:none}.back-btn:hover{background:rgba(255,102,0,.15);border-color:#f60;transform:translateX(-2px)}.main-container{height:calc(100vh - 60px);display:flex;align-items:center;justify-content:center;position:relative;z-index:1}.login-card{width:100%;max-width:400px;background:rgba(20,20,25,.7);backdrop-filter:blur(20px);border:1px solid rgba(255,102,0,.2);border-radius:24px;padding:32px;box-shadow:0 20px 40px rgba(0,0,0,.5);margin:0 16px}.login-logo{text-align:center;margin-bottom:24px}.login-logo img{height:60px;width:auto;margin-bottom:12px}.login-logo h2{font-family:Orbitron,sans-serif;font-size:1.5rem;font-weight:700;margin-bottom:4px}.login-logo p{color:#9ca3af;font-size:.85rem}.input-group{margin-bottom:20px}.input-label{display:block;color:#d1d5db;font-size:.85rem;font-weight:500;margin-bottom:6px}.input-wrapper{position:relative}.input-wrapper input{width:100%;height:48px;background:rgba(255,255,255,.03);border:1px solid rgba(255,102,0,.2);border-radius:12px;padding:0 40px 0 16px;color:#fff;font-size:.95rem;transition:all .3s ease}.input-wrapper input:focus{outline:0;border-color:#f60;background:rgba(255,255,255,.05);box-shadow:0 0 0 3px rgba(255,102,0,.1)}.input-wrapper input:focus+i{color:#f60}.input-wrapper i{position:absolute;right:16px;top:50%;transform:translateY(-50%);color:#9ca3af;font-size:1rem;transition:color .3s ease}.password-toggle{position:absolute;right:16px;top:50%;transform:translateY(-50%);background:0 0;border:none;color:#9ca3af;cursor:pointer;font-size:1rem;transition:color .3s ease}.password-toggle:hover{color:#f60}.options-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;font-size:.85rem}.remember-checkbox{display:flex;align-items:center;gap:8px;color:#9ca3af;cursor:pointer}.remember-checkbox input[type=checkbox]{width:16px;height:16px;accent-color:#ff6600}.forgot-link{color:#f60;text-decoration:none;transition:color .3s ease}.forgot-link:hover{color:#ff8533}.login-btn{width:100%;height:48px;background:linear-gradient(135deg,#f60,#ff8533);border:none;border-radius:12px;color:#fff;font-weight:600;font-size:1rem;display:flex;align-items:center;justify-content:center;gap:8px;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden}.login-btn:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(255,102,0,.3)}.login-btn:active{transform:translateY(0)}.login-btn:disabled{opacity:.7;cursor:not-allowed}.login-btn::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s ease}.login-btn:hover::before{left:100%}.security-note{margin-top:24px;padding-top:16px;border-top:1px solid rgba(255,102,0,.1);display:flex;align-items:center;justify-content:center;gap:8px;color:#6b7280;font-size:.75rem}.security-note i{color:#f60}.forgot-form{text-align:center}.forgot-icon{font-size:2.5rem;color:#f60;margin-bottom:12px}.forgot-title{font-family:Orbitron,sans-serif;font-size:1.3rem;font-weight:700;margin-bottom:4px}.forgot-subtitle{color:#9ca3af;font-size:.85rem;margin-bottom:20px}.button-group{display:flex;gap:12px;margin-top:20px}.back-btn-secondary{flex:1;height:44px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#fff;font-weight:500;cursor:pointer;transition:all .3s ease}.back-btn-secondary:hover{background:rgba(255,255,255,.1)}.send-btn{flex:1;height:44px;background:linear-gradient(135deg,#f60,#ff8533);border:none;border-radius:10px;color:#fff;font-weight:500;cursor:pointer;transition:all .3s ease}.send-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px rgba(255,102,0,.3)}.hidden{display:none}.loading-spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-radius:50%;border-top-color:#fff;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.flip-container{perspective:1000px;display:inline-block;min-width:280px;height:70px;cursor:pointer;background:0 0}.flip-container .flipper{position:relative;width:100%;height:100%;transform-style:preserve-3d;animation:flipCycle 10s infinite ease-in-out}@keyframes flipCycle{0%{transform:rotateY(0)}45%{transform:rotateY(0)}50%{transform:rotateY(180deg)}95%{transform:rotateY(180deg)}100%{transform:rotateY(0)}}.flip-container:hover .flipper{animation-play-state:paused}.flip-container .back,.flip-container .front{backface-visibility:hidden;position:absolute;top:0;left:0;width:100%;height:100%;display:flex!important;align-items:center;justify-content:flex-start;opacity:1!important}.flip-container .front{z-index:2;transform:rotateY(0)}.flip-container .back{transform:rotateY(180deg)}.flip-container img{display:block!important;max-width:none!important;width:auto;height:auto;visibility:visible!important}@media screen and (-webkit-min-device-pixel-ratio:0){.flip-container .back,.flip-container .front{backface-visibility:hidden;-webkit-backface-visibility:hidden}}.flip-container .back h1 span,.flip-container .front h1 span{animation:glowPulse 4s infinite}@keyframes glowPulse{0%,100%{text-shadow:0 0 10px rgba(255,102,0,.3)}50%{text-shadow:0 0 20px rgba(255,102,0,.6)}}@media (max-width:480px){.header-content{padding:0 16px}.logo-text h1{font-size:1rem}.back-btn span{display:none}.back-btn{padding:8px 12px}.login-card{padding:24px}}