*{margin:0;padding:0;box-sizing:border-box}html{background:#000;height:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:#000;color:#fff;margin:0;padding:0;min-height:100vh;position:relative;z-index:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.background-effects{position:fixed;top:0;left:0;width:100vw;height:100vh;overflow:hidden;z-index:-1;pointer-events:none}.holo-bg{position:fixed;top:-10%;left:-10%;width:120%;height:120%;background:radial-gradient(ellipse at 30% 40%,rgba(147,51,234,.3) 0%,transparent 50%),radial-gradient(ellipse at 70% 60%,rgba(59,130,246,.25) 0%,transparent 50%),radial-gradient(ellipse at 50% 80%,rgba(236,72,153,.2) 0%,transparent 50%);background-size:200% 200%;animation:holoShift 20s ease-in-out infinite,gradientMove 15s ease infinite}@keyframes holoShift{0%,to{transform:scale(1) rotate(0);opacity:1}33%{transform:scale(1.1) rotate(5deg);opacity:.8}66%{transform:scale(.9) rotate(-5deg);opacity:.9}}@keyframes gradientMove{0%{background-position:0% 50%}25%{background-position:100% 50%}50%{background-position:100% 100%}75%{background-position:0% 100%}to{background-position:0% 50%}}.liquid-shape{position:absolute;border-radius:40% 60% 70% 30%/40% 50% 60%;background:linear-gradient(135deg,#9333ea33,#3b82f633,#ec489926);background-size:200% 200%;filter:blur(60px);animation:morph 15s ease-in-out infinite,colorShift 10s ease-in-out infinite}.liquid-1{top:5%;left:5%;width:450px;height:450px;animation-delay:0s}.liquid-2{top:45%;right:5%;width:550px;height:550px;animation-delay:5s,3s}.liquid-3{bottom:5%;left:25%;width:400px;height:400px;animation-delay:10s,7s}@keyframes morph{0%,to{border-radius:40% 60% 70% 30%/40% 50% 60%;transform:translate(0) rotate(0) scale(1)}25%{border-radius:60% 40% 30% 70%/60% 30% 70% 40%;transform:translate(15px,-15px) rotate(90deg) scale(1.05)}50%{border-radius:30% 60% 70% 40%/50% 60% 30%;transform:translate(-15px,15px) rotate(180deg) scale(.95)}75%{border-radius:70% 30% 40% 60%/40% 70% 50% 60%;transform:translate(15px,15px) rotate(270deg) scale(1.05)}}@keyframes colorShift{0%,to{background-position:0% 50%;opacity:.8}33%{background-position:100% 50%;opacity:1}66%{background-position:50% 100%;opacity:.9}}.wire-frame{position:absolute;width:600px;height:600px;border:2px solid rgba(147,51,234,.2);border-radius:50%;animation:wireRotate 20s linear infinite}.wire-frame-1{top:-200px;right:-200px}.wire-frame-2{bottom:-300px;left:-200px;animation-direction:reverse;animation-duration:25s}@keyframes wireRotate{0%{transform:rotate(0) scale(1);opacity:.3}50%{transform:rotate(180deg) scale(1.1);opacity:.15}to{transform:rotate(360deg) scale(1);opacity:.3}}.particle{position:absolute;width:8px;height:8px;background:radial-gradient(circle,rgba(147,51,234,.8),transparent);border-radius:50%;animation:particleFloat 15s ease-in-out infinite}.particle-1{top:20%;left:10%;animation-delay:0s}.particle-2{top:40%;right:15%;animation-delay:3s}.particle-3{bottom:30%;left:20%;animation-delay:6s}.particle-4{top:60%;right:25%;width:6px;height:6px;animation-delay:9s}.particle-5{bottom:20%;right:10%;width:10px;height:10px;animation-delay:12s}@keyframes particleFloat{0%,to{transform:translate(0) scale(1);opacity:.3}25%{transform:translate(100px,-80px) scale(1.5);opacity:.6}50%{transform:translate(50px,-150px) scale(.8);opacity:.4}75%{transform:translate(-50px,-100px) scale(1.2);opacity:.5}}.grid-line{position:absolute;background:linear-gradient(90deg,transparent,rgba(147,51,234,.3),rgba(59,130,246,.3),transparent);opacity:.4}.grid-horizontal{width:100%;height:1px;animation:gridFlowHorizontal 8s linear infinite}.grid-vertical{width:1px;height:100%;animation:gridFlowVertical 8s linear infinite}.grid-h-1{top:15%;animation-delay:0s}.grid-h-2{top:45%;animation-delay:2s}.grid-h-3{top:75%;animation-delay:4s}.grid-v-1{left:20%;animation-delay:1s}.grid-v-2{left:60%;animation-delay:3s}.grid-v-3{right:15%;animation-delay:5s}@keyframes gridFlowHorizontal{0%{transform:translate(-100%);opacity:0}10%,90%{opacity:.4}to{transform:translate(100%);opacity:0}}@keyframes gridFlowVertical{0%{transform:translateY(-100%);opacity:0}10%,90%{opacity:.4}to{transform:translateY(100%);opacity:0}}.hexagon{position:absolute;width:100px;height:58px;background:linear-gradient(135deg,#9333ea1a,#3b82f61a);clip-path:polygon(25% 0%,75% 0%,100% 50%,75% 100%,25% 100%,0% 50%);animation:hexagonPulse 6s ease-in-out infinite}.hex-1{top:25%;right:20%;animation-delay:0s}.hex-2{bottom:35%;left:15%;width:80px;height:46px;animation-delay:2s}.hex-3{top:55%;left:8%;width:60px;height:35px;animation-delay:4s}@keyframes hexagonPulse{0%,to{transform:rotate(0) scale(1);opacity:.3}50%{transform:rotate(180deg) scale(1.2);opacity:.6}}.light-beam{position:absolute;width:2px;height:300px;background:linear-gradient(180deg,transparent,rgba(147,51,234,.4),rgba(59,130,246,.4),transparent);transform-origin:top;animation:beamSweep 10s ease-in-out infinite}.beam-1{top:0;left:30%;animation-delay:0s}.beam-2{top:0;right:35%;animation-delay:3s}.beam-3{top:0;left:60%;animation-delay:6s}@keyframes beamSweep{0%,to{transform:rotate(0) scaleY(.5);opacity:.2}50%{transform:rotate(15deg) scaleY(1.2);opacity:.5}}.data-stream{position:absolute;font-family:Courier New,monospace;font-size:12px;color:#9333ea80;white-space:nowrap;animation:dataScroll 20s linear infinite}.stream-1{top:35%;right:-100%}.stream-2{top:65%;right:-100%;animation-delay:10s}@keyframes dataScroll{0%{transform:translate(0);opacity:0}5%,95%{opacity:.4}to{transform:translate(-200vw);opacity:0}}@media(max-width:1024px){.hero-title{font-size:5rem}.features,.alerts-grid{grid-template-columns:1fr}}.watermark{position:fixed;bottom:20px;right:20px;z-index:1000;opacity:.3;transition:all .3s ease;pointer-events:none}.watermark:hover{opacity:.6;transform:scale(1.1)}.watermark img{width:40px;height:40px;filter:drop-shadow(0 0 10px rgba(192,132,252,.5))}.watermark-large{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:.1;z-index:0;pointer-events:none}.watermark-large img{width:200px;height:200px;filter:blur(2px)}.logo-dark{filter:brightness(.8) contrast(1.2)}.logo-light{filter:brightness(1.2) contrast(.8)}.logo-glow{filter:drop-shadow(0 0 20px rgba(192,132,252,.6))}@media(max-width:768px){.hero-title{font-size:3.5rem}nav{padding:1.5rem 2rem}.nav-links a{display:none}.cta-buttons{flex-direction:column;gap:1rem}.dashboard-container{padding:2rem}.social-grid{grid-template-columns:1fr}.watermark{bottom:10px;right:10px}.watermark img{width:30px;height:30px}}nav{position:fixed;top:0;width:100%;padding:clamp(.75rem,2vw,1.5rem) clamp(1rem,5vw,4rem);display:flex;justify-content:space-between;align-items:center;z-index:1000;background:#00000080;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}@media(min-width:769px){nav{padding:10px}}.logo{display:flex;align-items:center;gap:.75rem;cursor:pointer;transition:all .3s ease}.logo:hover{transform:scale(1.05)}.logo-icon{width:auto;height:80px;position:absolute}.logo:hover .logo-icon{transform:rotate(5deg)}.logo-text{font-size:clamp(1.25rem,4vw,2rem);font-weight:900;letter-spacing:.15em;background:linear-gradient(135deg,#fff,#c084fc,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;text-transform:uppercase;white-space:nowrap}.nav-links{display:flex;gap:clamp(1rem,3vw,3rem);align-items:center;flex-wrap:wrap}.nav-links a{color:#fff9;text-decoration:none;font-size:clamp(.8rem,2.5vw,.95rem);font-weight:500;transition:all .3s;letter-spacing:.05em;text-transform:uppercase;white-space:nowrap;cursor:pointer}.nav-links a:hover{color:#c084fc}.nav-dropdown{position:relative;display:inline-block}.nav-dropdown .nav-link{cursor:pointer}.dropdown-content{display:none;position:absolute;top:100%;left:0;background:#0f172af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(192,132,252,.3);border-radius:8px;padding:.5rem;min-width:180px;box-shadow:0 8px 24px #0006;z-index:1000}.dropdown-content a{display:block;padding:.75rem 1rem;color:#ffffffe6;text-decoration:none;font-size:.9rem;font-weight:500;transition:all .2s;border-radius:4px;text-transform:none;letter-spacing:.02em}.dropdown-content a:hover{background:#c084fc33;color:#c084fc}.nav-dropdown:hover .dropdown-content{display:block}.nav-left{display:flex;align-items:center;gap:clamp(.5rem,1.5vw,1rem)}.nav-socials{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.4rem;z-index:2;position:relative}.social-link{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:#ffffffb3;background:#ffffff0a;border:1px solid rgba(192,132,252,.2);text-decoration:none;transition:all .3s ease;cursor:pointer}.social-link svg{width:16px;height:16px;display:block;transition:transform .3s ease}.social-link .social-img{width:100%;height:100%;display:block;object-fit:cover;border-radius:50%;transition:transform .3s ease}.social-link:hover{color:#fff;transform:translateY(-2px);border-color:#c084fc99;box-shadow:0 6px 18px #9333ea59}.social-link:hover svg,.social-link:hover .social-img{transform:scale(1.08)}.social-link.social-discord:hover{background:linear-gradient(135deg,#5865f240,#9333ea40);border-color:#5865f2b3;box-shadow:0 6px 18px #5865f266}.social-link.social-instagram{background:transparent;border-color:transparent;padding:0;overflow:hidden}.social-link.social-instagram:hover{border-color:transparent;box-shadow:0 6px 18px #e1306c73}.btn{padding:.9rem 2.2rem;border:none;border-radius:50px;cursor:pointer;font-size:.95rem;font-weight:700;transition:all .4s;text-transform:uppercase;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:#fff3;transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:hover:before{width:300px;height:300px}.btn-primary{background:linear-gradient(135deg,#9333ea,#3b82f6);color:#fff;box-shadow:0 0 30px #9333ea66;position:relative}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 10px 40px #9333ea99}.btn-secondary{background:transparent;color:#fff;border:2px solid rgba(147,51,234,.5)}.btn-secondary:hover{background:#9333ea26;border-color:#9333ea}.mobile-menu-btn{display:none;flex-direction:column;justify-content:center;align-items:center;width:30px;height:30px;background:none;border:none;cursor:pointer;padding:0;position:relative;z-index:1001}.hamburger-line{width:20px;height:2px;background:#fff;margin:2px 0;transition:all .3s ease;border-radius:1px}.mobile-menu{display:none;position:absolute;top:100%;right:0;background:#0f172af2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:8px;padding:.5rem;min-width:120px;z-index:1000;box-shadow:0 4px 12px #0000004d}.mobile-menu.show{display:block}.mobile-menu-item{display:flex;align-items:center;gap:.5rem;width:100%;padding:.6rem;background:none;border:none;color:#fff;font-size:.85rem;cursor:pointer;border-radius:4px;transition:background .2s ease;text-align:left;text-decoration:none}.mobile-menu-item:hover{background:#ffffff1a}.mobile-menu-item.mobile-signout{color:#ef4444}.mobile-menu-item.mobile-signout:hover{background:#ef44441a}.mobile-menu-btn{display:flex}.nav-links #navSignIn,.nav-links #navSignUp,.nav-links #navHelp,.nav-links #navSignOut{display:none!important}@media(max-width:768px){nav{padding:.8rem 1rem;position:relative}.nav-links{gap:.8rem}.nav-links a{display:none}.nav-left{gap:.5rem}.nav-socials{gap:.3rem}.social-link{width:28px;height:28px}.social-link svg{width:14px;height:14px}}@media(max-width:480px){nav{padding:.6rem .8rem}.logo{font-size:1.2rem}.nav-links{gap:.6rem}.nav-links .btn{padding:.4rem .8rem;font-size:.7rem}}@media(max-width:375px){nav{padding:.5rem .6rem}.logo{font-size:1.1rem}.nav-links{gap:.4rem}.nav-links .btn{padding:.3rem .6rem;font-size:.65rem}}@media(max-width:480px){nav{padding:.5rem .75rem}.logo-text{font-size:1rem}.nav-links{gap:.25rem}.nav-links a{display:none}.btn{padding:.4rem .8rem;font-size:.7rem;border-radius:15px}.help-btn{padding:.3rem .6rem}.help-btn .icon{font-size:.7rem}#navSignIn,#navSignUp{padding:.4rem .6rem}#navSignOut{padding:.3rem .6rem;font-size:.65rem}}@media(max-width:375px){.logo-text{font-size:.9rem}.nav-links{gap:.2rem}.btn{padding:.3rem .6rem;font-size:.65rem}.help-btn{padding:.25rem .5rem}.help-btn .icon{font-size:.6rem}#navSignOut{padding:.25rem .5rem;font-size:.6rem}}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000e6;z-index:2000;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.modal.active{display:flex;animation:modalFadeIn .3s ease}body.modal-open{overflow:hidden;height:100vh;position:fixed;width:100%}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:linear-gradient(135deg,#140523f2,#0f051ef2);border:2px solid rgba(147,51,234,.4);border-radius:40px;padding:4rem;max-width:500px;width:90%;max-height:90vh;position:relative;box-shadow:0 30px 80px #9333ea80;-webkit-backdrop-filter:blur(40px);backdrop-filter:blur(40px);animation:modalSlideUp .4s cubic-bezier(.4,0,.2,1);overflow-y:auto;overscroll-behavior:contain}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.modal-close{position:absolute;top:2rem;right:2rem;background:#ffffff0d;border:1px solid rgba(147,51,234,.3);border-radius:50%;width:40px;height:40px;color:#fff9;font-size:1.5rem;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center}.modal-close:hover{background:#9333ea33;color:#c084fc;transform:rotate(90deg)}.modal-title{font-size:2.5rem;font-weight:900;margin-bottom:.8rem;background:linear-gradient(135deg,#fff,#c084fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:.05em}.modal-subtitle{color:#ffffff80;margin-bottom:3rem;font-size:1rem}.input-group{margin-bottom:2rem}.input-group label{display:block;margin-bottom:.8rem;color:#fffc;font-size:.95rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase}.input-group input{width:100%;padding:1.2rem 1.5rem;background:#0006;border:2px solid rgba(147,51,234,.3);border-radius:15px;color:#fff;font-size:1rem;transition:all .3s}.input-group input::placeholder{color:#ffffff4d}.input-group input:focus{outline:none;border-color:#9333ea;background:#9333ea1a;box-shadow:0 0 20px #9333ea4d}.modal .btn{width:100%;padding:1.2rem;margin-top:1rem;font-size:1rem}.auth-providers{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.provider-btn{width:100%;padding:1.2rem;border:2px solid rgba(147,51,234,.3);border-radius:15px;background:#0006;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:.8rem}.provider-btn:hover{background:#9333ea33;border-color:#9333ea;transform:translateY(-2px)}.provider-btn.twitch{background:linear-gradient(135deg,#9146ff33,#6441a533)}.provider-btn.google{background:linear-gradient(135deg,#db443733,#4285f433)}.divider{display:flex;align-items:center;text-align:center;margin:2rem 0;color:#ffffff4d;font-size:.9rem}.divider:before,.divider:after{content:"";flex:1;border-bottom:1px solid rgba(147,51,234,.3)}.divider:before{margin-right:1rem}.divider:after{margin-left:1rem}.auth-switch{text-align:center;margin-top:2rem;color:#ffffff80;font-size:.95rem}.auth-switch a{color:#c084fc;text-decoration:none;font-weight:700;cursor:pointer;transition:color .3s}.auth-switch a:hover{color:#60a5fa}
