@import "https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600;700&family=Orbitron:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@300;400;500;600;700&display=swap";
:root{--syntx-bg:#030b15;--syntx-dark:#0a1628;--syntx-darker:#050d18;--syntx-cyan:#00d4ff;--syntx-cyan-dim:#09c;--syntx-magenta:#d946ef;--syntx-green:#10b981;--syntx-orange:#f59e0b;--syntx-red:#ef4444;--syntx-purple:#8b5cf6;--syntx-blue:#3b82f6;--syntx-border:#ffffff1a;--syntx-glow:#00d4ff80;--gradient-cyber:linear-gradient(135deg,var(--syntx-cyan),var(--syntx-magenta));--gradient-matrix:linear-gradient(180deg,var(--syntx-green)0%,transparent 100%);--gradient-fire:linear-gradient(135deg,var(--syntx-orange),var(--syntx-red));--gradient-ocean:linear-gradient(135deg,var(--syntx-cyan),var(--syntx-blue));--gradient-mystic:linear-gradient(135deg,var(--syntx-purple),var(--syntx-magenta))}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{background:var(--syntx-bg);color:#ffffffe6;min-height:100vh;font-family:Space Grotesk,JetBrains Mono,system-ui,sans-serif;position:relative;overflow-x:hidden}body:before{content:"";pointer-events:none;z-index:-1;background:radial-gradient(at 20% 20%,#00d4ff14 0%,#0000 50%),radial-gradient(at 80% 80%,#d946ef14 0%,#0000 50%),radial-gradient(#10b9810d 0%,#0000 70%);animation:20s infinite morphGradient;position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:-1;background-image:linear-gradient(#00d4ff08 1px,#0000 1px),linear-gradient(90deg,#00d4ff08 1px,#0000 1px);background-size:50px 50px;position:fixed;inset:0}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#0006;border-radius:5px}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--syntx-cyan),var(--syntx-cyan-dim));box-shadow:0 0 15px var(--syntx-glow);border:2px solid #0000;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--syntx-cyan),var(--syntx-magenta));box-shadow:0 0 25px var(--syntx-glow)}::-webkit-scrollbar-corner{background:0 0}::selection{color:#fff;text-shadow:0 0 10px var(--syntx-cyan);background:#00d4ff66}@keyframes glow{0%,to{box-shadow:0 0 20px #00d4ff4d}50%{box-shadow:0 0 40px #00d4ff99,0 0 60px #00d4ff4d}}@keyframes glowPulse{0%,to{box-shadow:0 0 20px var(--glow-color,#00d4ff66);transform:scale(1)}50%{box-shadow:0 0 40px var(--glow-color,#00d4ff99),0 0 80px var(--glow-color,#00d4ff4d);transform:scale(1.02)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}@keyframes heartbeat{0%,to{transform:scale(1)}14%{transform:scale(1.15)}28%{transform:scale(1)}42%{transform:scale(1.15)}70%{transform:scale(1)}}@keyframes float{0%,to{transform:translateY(0)rotate(0)}25%{transform:translateY(-10px)rotate(1deg)}50%{transform:translateY(-20px)rotate(0)}75%{transform:translateY(-10px)rotate(-1deg)}}@keyframes floatSlow{0%,to{transform:translateY(0)}50%{transform:translateY(-30px)}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeft{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideRight{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes scaleIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes scaleOut{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}@keyframes rotateIn{0%{opacity:0;transform:rotate(-10deg)scale(.9)}to{opacity:1;transform:rotate(0)scale(1)}}@keyframes scanLine{0%{opacity:0;transform:translateY(-100%)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(100%)}}@keyframes scanLineHorizontal{0%{opacity:0;transform:translate(-100%)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translate(100%)}}@keyframes dataFlow{0%{opacity:0;transform:translateY(100%)}10%{opacity:1}90%{opacity:1}to{opacity:0;transform:translateY(-100%)}}@keyframes dataStream{0%{background-position:0 0}to{background-position:0 100%}}@keyframes matrixRain{0%{transform:translateY(-100%)}to{transform:translateY(100vh)}}@keyframes morphGradient{0%,to{filter:hue-rotate();background-position:0%}25%{background-position:50% 100%}50%{filter:hue-rotate(15deg);background-position:100%}75%{background-position:50% 0}}@keyframes borderFlow{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes rainbow{0%{filter:hue-rotate()}to{filter:hue-rotate(360deg)}}@keyframes colorShift{0%,to{color:var(--syntx-cyan)}33%{color:var(--syntx-magenta)}66%{color:var(--syntx-green)}}@keyframes glitch{0%,to{filter:none;transform:translate(0)}20%{filter:hue-rotate(90deg);transform:translate(-2px,2px)}40%{filter:hue-rotate(-90deg);transform:translate(-2px,-2px)}60%{filter:hue-rotate(180deg);transform:translate(2px,2px)}80%{filter:hue-rotate(-180deg);transform:translate(2px,-2px)}}@keyframes glitchText{0%,to{text-shadow:2px 0 var(--syntx-cyan),-2px 0 var(--syntx-magenta);transform:translate(0)}25%{text-shadow:-2px 0 var(--syntx-cyan),2px 0 var(--syntx-magenta);transform:translate(1px,-1px)}50%{text-shadow:2px 0 var(--syntx-magenta),-2px 0 var(--syntx-cyan);transform:translate(-1px,1px)}75%{text-shadow:-2px 0 var(--syntx-magenta),2px 0 var(--syntx-cyan);transform:translate(1px,1px)}}@keyframes flicker{0%,to{opacity:1}50%{opacity:.8}52%{opacity:1}54%{opacity:.9}56%{opacity:1}}@keyframes static{0%,to{background-position:0 0}10%{background-position:-5% -10%}20%{background-position:-15% 5%}30%{background-position:7% -25%}40%{background-position:20% 25%}50%{background-position:-25% 10%}60%{background-position:15% 5%}70%{background-position:0 15%}80%{background-position:25% 35%}90%{background-position:-10% 10%}}@keyframes ping{0%{opacity:1;transform:scale(1)}75%,to{opacity:0;transform:scale(2)}}@keyframes ripple{0%{opacity:1;transform:scale(.8)}to{opacity:0;transform:scale(2.5)}}@keyframes orbit{0%{transform:rotate(0)translate(20px)rotate(0)}to{transform:rotate(360deg)translate(20px)rotate(-360deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spinSlow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-25%)}}@keyframes textGlow{0%,to{text-shadow:0 0 10px,0 0 20px}50%{text-shadow:0 0 20px,0 0 40px,0 0 60px}}@keyframes typewriter{0%{width:0}to{width:100%}}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}@keyframes textReveal{0%{clip-path:polygon(0 0,0 0,0 100%,0 100%);opacity:0}to{clip-path:polygon(0 0,100% 0,100% 100%,0 100%);opacity:1}}@keyframes particleFloat{0%,to{opacity:.3;transform:translate(0)rotate(0)}25%{opacity:.8;transform:translate(10px,-30px)rotate(90deg)}50%{opacity:.5;transform:translate(-5px,-60px)rotate(180deg)}75%{opacity:.8;transform:translate(15px,-90px)rotate(270deg)}to{opacity:0;transform:translateY(-120px)rotate(360deg)}}@keyframes starTwinkle{0%,to{opacity:.3;transform:scale(1)}50%{opacity:1;transform:scale(1.2)}}@keyframes firefly{0%,to{opacity:0;transform:translate(0)}10%{opacity:1}90%{opacity:1}50%{transform:translate(var(--tx,20px),var(--ty,-30px))}}@keyframes progressGlow{0%{box-shadow:0 0 5px var(--syntx-cyan),inset 0 0 5px var(--syntx-cyan)}50%{box-shadow:0 0 20px var(--syntx-cyan),inset 0 0 10px var(--syntx-cyan)}to{box-shadow:0 0 5px var(--syntx-cyan),inset 0 0 5px var(--syntx-cyan)}}@keyframes waveform{0%,to{height:20%}25%{height:60%}50%{height:100%}75%{height:40%}}@keyframes loadingDots{0%,20%{opacity:0}40%{opacity:1}to{opacity:0}}@keyframes skeletonShimmer{0%{background-position:-200px 0}to{background-position:calc(200px + 100%) 0}}.animate-glow{animation:2s ease-in-out infinite glow}.animate-glow-pulse{animation:2s ease-in-out infinite glowPulse}.animate-pulse{animation:2s ease-in-out infinite pulse}.animate-heartbeat{animation:1.5s ease-in-out infinite heartbeat}.animate-float{animation:6s ease-in-out infinite float}.animate-float-slow{animation:8s ease-in-out infinite floatSlow}.animate-slide-up{animation:.5s ease-out forwards slideUp}.animate-slide-down{animation:.5s ease-out forwards slideDown}.animate-slide-left{animation:.5s ease-out forwards slideLeft}.animate-slide-right{animation:.5s ease-out forwards slideRight}.animate-scale-in{animation:.3s ease-out forwards scaleIn}.animate-rotate-in{animation:.5s ease-out forwards rotateIn}.animate-scan{animation:2s linear infinite scanLine}.animate-scan-horizontal{animation:2s linear infinite scanLineHorizontal}.animate-data-flow{animation:3s linear infinite dataFlow}.animate-shimmer{animation:2s linear infinite shimmer}.animate-glitch{animation:.3s glitch}.animate-glitch-text{animation:.5s infinite glitchText}.animate-flicker{animation:.15s infinite flicker}.animate-ping{animation:1.5s cubic-bezier(0,0,.2,1) infinite ping}.animate-ripple{animation:1s ease-out infinite ripple}.animate-orbit{animation:3s linear infinite orbit}.animate-spin{animation:1s linear infinite spin}.animate-spin-slow{animation:8s linear infinite spinSlow}.animate-bounce{animation:1s ease-in-out infinite bounce}.animate-text-glow{animation:2s ease-in-out infinite textGlow}.animate-blink{animation:1s step-end infinite blink}.animate-typewriter{animation:2s steps(40,end) forwards typewriter}.animate-particle{animation:4s ease-in-out infinite particleFloat}.animate-twinkle{animation:2s ease-in-out infinite starTwinkle}.glass{-webkit-backdrop-filter:blur(20px);background:#ffffff08;border:1px solid #ffffff1a}.glass-dark{-webkit-backdrop-filter:blur(20px);background:#0006;border:1px solid #ffffff0d}.glass-cyan{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#00d4ff0d;border:1px solid #00d4ff33}.glow-sm{box-shadow:0 0 10px var(--syntx-glow)}.glow-md{box-shadow:0 0 20px var(--syntx-glow)}.glow-lg{box-shadow:0 0 40px var(--syntx-glow)}.glow-xl{box-shadow:0 0 60px var(--syntx-glow),0 0 100px var(--syntx-glow)}.glow-cyan{--syntx-glow:#00d4ff80}.glow-magenta{--syntx-glow:#d946ef80}.glow-green{--syntx-glow:#10b98180}.glow-orange{--syntx-glow:#f59e0b80}.glow-red{--syntx-glow:#ef444480}.glow-purple{--syntx-glow:#8b5cf680}.text-glow{text-shadow:0 0 10px,0 0 20px}.text-glow-sm{text-shadow:0 0 5px}.text-glow-lg{text-shadow:0 0 20px,0 0 40px,0 0 60px}.border-glow{position:relative}.border-glow:before{content:"";border-radius:inherit;background:linear-gradient(45deg,var(--syntx-cyan),var(--syntx-magenta),var(--syntx-cyan));z-index:-1;opacity:0;background-size:200% 200%;transition:opacity .3s;animation:3s infinite borderFlow;position:absolute;inset:-2px}.border-glow:hover:before{opacity:1}.gradient-text{background:var(--gradient-cyber);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.gradient-text-animated{background:linear-gradient(90deg,var(--syntx-cyan),var(--syntx-magenta),var(--syntx-cyan));-webkit-text-fill-color:transparent;background-size:200%;-webkit-background-clip:text;background-clip:text;animation:3s linear infinite shimmer}.noise:before{content:"";opacity:.03;pointer-events:none;z-index:1;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");position:absolute;inset:0}.scan-lines:after{content:"";pointer-events:none;z-index:1;background:repeating-linear-gradient(0deg,#0000001a 0 1px,#0000 1px 2px);position:absolute;inset:0}.hover-lift{transition:transform .3s,box-shadow .3s}.hover-lift:hover{transform:translateY(-8px);box-shadow:0 20px 40px #0000004d}.hover-glow{transition:box-shadow .3s}.hover-glow:hover{box-shadow:0 0 30px var(--syntx-glow)}.hover-scale{transition:transform .3s}.hover-scale:hover{transform:scale(1.05)}.hover-rotate{transition:transform .3s}.hover-rotate:hover{transform:rotate(5deg)}.hover-shine{position:relative;overflow:hidden}.hover-shine:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.hover-shine:hover:before{left:100%}.focus-glow:focus{outline:none;box-shadow:0 0 0 3px #00d4ff4d,0 0 20px #00d4ff33}.focus-ring:focus{ring:2px;ring-color:var(--syntx-cyan);ring-offset:2px;ring-offset-color:var(--syntx-bg);outline:none}.btn-cyber{color:var(--syntx-cyan);letter-spacing:2px;cursor:pointer;background:linear-gradient(135deg,#00d4ff33,#00d4ff0d);border:1px solid #00d4ff80;border-radius:12px;padding:12px 28px;font-family:JetBrains Mono,monospace;font-weight:600;transition:all .3s;position:relative;overflow:hidden}.btn-cyber:before{content:"";background:linear-gradient(90deg,#0000,#00d4ff4d,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.btn-cyber:hover{background:linear-gradient(135deg,#00d4ff4d,#00d4ff1a);transform:translateY(-2px);box-shadow:0 0 30px #00d4ff66,inset 0 0 20px #00d4ff1a}.btn-cyber:hover:before{left:100%}.btn-cyber:active{transform:translateY(0)}.btn-ripple{position:relative;overflow:hidden}.btn-ripple:after{content:"";background:radial-gradient(circle,#ffffff4d,#0000 70%);border-radius:50%;width:100%;height:100%;transition:transform .5s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.btn-ripple:active:after{opacity:0;transition:transform .5s,opacity .5s;transform:translate(-50%,-50%)scale(4)}.card-cyber{background:linear-gradient(135deg,#0a1a2ee6,#050b14f2);border:1px solid #ffffff1a;border-radius:20px;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.card-cyber:before{content:"";border-radius:inherit;background:linear-gradient(135deg,var(--syntx-cyan),transparent,var(--syntx-magenta));-webkit-mask-composite:xor;opacity:0;padding:2px;transition:opacity .3s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;mask-position:0 0,0 0;-webkit-mask-size:auto,auto;mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.card-cyber:hover{transform:translateY(-8px)scale(1.02);box-shadow:0 25px 50px #0006,0 0 40px #00d4ff1a}.card-cyber:hover:before{opacity:1}.card-tilt{transform-style:preserve-3d;perspective:1000px}.input-cyber{color:#fff;background:#0006;border:1px solid #ffffff1a;border-radius:12px;width:100%;padding:14px 20px;font-family:JetBrains Mono,monospace;font-size:14px;transition:all .3s}.input-cyber:focus{border-color:var(--syntx-cyan);outline:none;box-shadow:0 0 20px #00d4ff33,inset 0 0 10px #00d4ff0d}.input-cyber::placeholder{color:#ffffff4d}.badge-cyber{letter-spacing:1px;color:var(--syntx-cyan);background:#00d4ff1a;border:1px solid #00d4ff4d;border-radius:20px;align-items:center;gap:6px;padding:6px 14px;font-family:JetBrains Mono,monospace;font-size:11px;font-weight:600;display:inline-flex}.badge-pulse{animation:2s ease-in-out infinite pulse}.tooltip{position:relative}.tooltip:before,.tooltip:after{opacity:0;visibility:hidden;z-index:1000;transition:all .3s;position:absolute}.tooltip:before{content:attr(data-tooltip);color:#fff;white-space:nowrap;background:#000000f2;border:1px solid #00d4ff4d;border-radius:10px;padding:10px 16px;font-family:JetBrains Mono,monospace;font-size:12px;bottom:calc(100% + 10px);left:50%;transform:translate(-50%)translateY(10px);box-shadow:0 10px 30px #00000080,0 0 20px #00d4ff33}.tooltip:after{content:"";border:8px solid #0000;border-top-color:#00d4ff4d;bottom:calc(100% + 2px);left:50%;transform:translate(-50%)}.tooltip:hover:before,.tooltip:hover:after{opacity:1;visibility:visible}.tooltip:hover:before{transform:translate(-50%)translateY(0)}.progress-cyber{background:#ffffff1a;border-radius:4px;height:8px;position:relative;overflow:hidden}.progress-cyber-bar{background:linear-gradient(90deg,var(--syntx-cyan),var(--syntx-magenta));height:100%;box-shadow:0 0 20px var(--syntx-glow);border-radius:4px;transition:width .5s;position:relative}.progress-cyber-bar:after{content:"";background:linear-gradient(90deg,#0000,#fff6);width:30px;height:100%;animation:1.5s infinite shimmer;position:absolute;top:0;right:0}.skeleton{background:linear-gradient(90deg,#ffffff0d 25%,#ffffff1a 50%,#ffffff0d 75%) 0 0/200px 100%;border-radius:8px;animation:1.5s infinite skeletonShimmer}.skeleton-text{height:16px;margin-bottom:8px}.skeleton-title{width:60%;height:24px;margin-bottom:16px}.skeleton-avatar{border-radius:50%;width:48px;height:48px}.skeleton-card{border-radius:16px;height:200px}.holographic{background:linear-gradient(135deg,#ff00001a,#ff7f001a,#ffff001a,#00ff001a,#0000ff1a,#4b00821a,#9400d31a) 0 0/400% 400%;animation:8s infinite rainbow}.neon-underline{display:inline-block;position:relative}.neon-underline:after{content:"";background:var(--syntx-cyan);width:0;height:2px;box-shadow:0 0 10px var(--syntx-cyan),0 0 20px var(--syntx-cyan);transition:width .3s;position:absolute;bottom:-4px;left:0}.neon-underline:hover:after{width:100%}.crt{position:relative}.crt:before{content:"";pointer-events:none;z-index:10;background:linear-gradient(#0000 50%,#0000001a 51%) 0 0/100% 4px;position:absolute;inset:0}.vignette:after{content:"";pointer-events:none;background:radial-gradient(#0000 0%,#0006 100%);position:absolute;inset:0}@media (max-width:768px){.hide-mobile{display:none!important}.show-mobile{display:block!important}}@media (min-width:769px){.hide-desktop{display:none!important}.show-desktop{display:block!important}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media print{body{color:#000;background:#fff}.no-print{display:none!important}}
