@import "https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700;800&family=Syne:wght@700;800&display=swap";
:root{--bg-primary:#08080a;--bg-secondary:#0d0d10;--bg-tertiary:#151518;--accent-blue:#005bff;--accent-red:#ff1a40;--accent-gold:#ffbe00;--accent-purple:var(--accent-red);--accent-cyan:var(--accent-blue);--accent-rose:#ff1a40;--accent-emerald:#10b981;--accent-amber:var(--accent-gold);--text-primary:#fff;--text-secondary:#a1a1aa;--text-muted:#71717a;--glass-bg:#0d0d10;--glass-border:#ffffff14;--glass-highlight:#ffffff05;--shadow-sm:0 1px 2px #00000080;--shadow-md:0 4px 12px #0009;--shadow-lg:0 8px 24px #000c;--shadow-glow:0 4px 12px #0006;--shadow-glow-red:0 4px 12px #0006;--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"Space Grotesk", ui-monospace, SFMono-Regular, monospace;--font-brand:"Syne", sans-serif;--transition-fast:.15s ease;--transition-normal:.2s cubic-bezier(.16, 1, .3, 1);--transition-slow:.3s cubic-bezier(.16, 1, .3, 1)}*{box-sizing:border-box;outline:none;margin:0;padding:0;border-radius:0!important}html,body{background-color:var(--bg-primary);width:100%;min-height:100vh;color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;background-image:radial-gradient(at 50% 0,#005bff0f 0%,#0000 70%),linear-gradient(#08080aeb 0%,#08080af5 100%),url(/bg.jpg);background-position:50%;background-repeat:no-repeat;background-size:cover;background-attachment:fixed;overflow-x:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#ffffff1f}::-webkit-scrollbar-thumb:hover{background:#ffffff40}a{color:inherit;transition:var(--transition-fast);text-decoration:none}.container{max-width:1200px;margin:0 auto;padding:0 2rem}.glass-panel{background:var(--bg-secondary);box-shadow:var(--shadow-md);transition:border-color var(--transition-normal), box-shadow var(--transition-normal), transform .15s ease-out;transform-style:preserve-3d;border:1px solid #ffffff14}.glass-panel:hover{box-shadow:var(--shadow-lg);border-color:#ffffff29}.glass-card{background:var(--bg-tertiary);box-shadow:var(--shadow-sm);transition:transform .15s ease-out, border-color var(--transition-normal), box-shadow var(--transition-normal);transform-style:preserve-3d;perspective:1000px;border:1px solid #ffffff14;overflow:hidden}.glass-card:hover{box-shadow:var(--shadow-md);border-color:#ffffff29;transform:translateY(-2px)}.btn{font-weight:500;font-family:var(--font-sans);letter-spacing:.3px;cursor:pointer;transition:var(--transition-fast);border:1px solid #ffffff14;justify-content:center;align-items:center;gap:.5rem;padding:.6rem 1.25rem;font-size:.85rem;display:inline-flex;border-radius:0!important}.btn-primary{color:#000;background:#fff;border-color:#fff}.btn-primary:hover{color:#000;background:#e4e4e7;border-color:#e4e4e7}.btn-secondary{color:var(--text-primary);background:#121215;border:1px solid #ffffff14}.btn-secondary:hover{color:#fff;background:#1c1c21;border-color:#ffffff29}.btn-danger{background:var(--accent-red);color:#fff;border-color:var(--accent-red)}.btn-danger:hover{background:#e60026;border-color:#e60026}.form-input{width:100%;color:var(--text-primary);font-family:var(--font-sans);transition:var(--transition-fast);background:#0b0b0d;border:1px solid #ffffff14;padding:.65rem .85rem;font-size:.9rem;border-radius:0!important}.form-input:focus{border-color:var(--accent-blue);box-shadow:none}.switch{flex-shrink:0;width:48px;min-width:48px;height:24px;display:inline-block;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:var(--bg-tertiary);border:1px solid #ffffff26;transition:all .2s;position:absolute;inset:0;border-radius:0!important}.slider:before{content:"";background-color:var(--text-secondary);width:16px;height:16px;transition:all .2s;position:absolute;bottom:3px;left:3px;border-radius:0!important}input:checked+.slider{background-color:var(--accent-blue);border-color:var(--accent-blue)}input:checked+.slider:before{background-color:#fff;transform:translate(24px)}.status-dot{width:8px;height:8px;display:inline-block;border-radius:0!important}.status-dot.online{background-color:var(--accent-emerald);box-shadow:0 0 6px var(--accent-emerald)}.status-dot.idle{background-color:var(--accent-gold);box-shadow:0 0 6px var(--accent-gold)}.status-dot.dnd{background-color:var(--accent-red);box-shadow:0 0 6px var(--accent-red)}.status-dot.offline{background-color:var(--text-muted)}h1,h2,h3,h4{font-family:var(--font-mono)}@keyframes heroPulse{0%{border-color:var(--accent-red);box-shadow:0 0 15px #ff1a4066}50%{border-color:var(--accent-blue);box-shadow:0 0 30px #005bffb3}to{border-color:var(--accent-red);box-shadow:0 0 15px #ff1a4066}}.hero-logo-animated{animation:3s ease-in-out infinite heroPulse}@keyframes fadeIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.3s ease-in-out forwards fadeIn}.reveal{opacity:0;transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1);transition-delay:var(--reveal-delay,0s);transform:translateY(28px)}.reveal.is-visible{opacity:1;transform:translateY(0)}@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transition:none;transform:none}}@keyframes ambient-drift{0%{opacity:0;transform:translate(0,0)}8%{opacity:var(--ambient-op,.5)}92%{opacity:var(--ambient-op,.5)}to{transform:translate3d(var(--dx,30px), -140vh, 0);opacity:0}}.ambient-field{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.ambient-particle{background:var(--particle-color,var(--accent-blue));width:3px;height:3px;box-shadow:0 0 6px var(--particle-color,var(--accent-blue));animation:linear infinite ambient-drift;position:absolute;bottom:-10px}@keyframes livePulseBorder{0%,to{box-shadow:inset 0 0 #005bff00}50%{box-shadow:inset 0 3px 12px -4px var(--pulse-color,#005bff59)}}.live-pulse{animation:2.6s ease-in-out infinite livePulseBorder}@keyframes panelScanSweep{0%{opacity:0;transform:translateY(-100%)}10%{opacity:.5}90%{opacity:.5}to{opacity:0;transform:translateY(2000%)}}.panel-scan-line{content:"";pointer-events:none;background:linear-gradient(90deg,#0000,#005bff80,#0000);height:1px;animation:5s linear infinite panelScanSweep;position:absolute;left:0;right:0}@keyframes dataFlicker{0%,to{opacity:1}92%{opacity:1}94%{opacity:.4}96%{opacity:1}}.live-value{animation:6s ease-in-out infinite dataFlicker}@media (max-width:768px){html,body{overflow-x:hidden}.container{padding:0 .75rem!important}.dashboard-main-layout{flex-direction:column!important;gap:1rem!important;padding:.75rem!important}.mobile-sidebar-container{width:100%!important;height:auto!important;padding:1rem!important;position:relative!important;top:0!important}.mobile-nav-menu{white-space:nowrap!important;flex-direction:row!important;gap:.5rem!important;padding-bottom:.5rem!important;display:flex!important;overflow-x:auto!important}.mobile-nav-menu::-webkit-scrollbar{height:3px!important}.app-header-bar{flex-direction:column!important;align-items:stretch!important;gap:1rem!important;padding:1rem!important}.header-actions-group{flex-wrap:wrap!important;justify-content:space-between!important;width:100%!important}.header-user-group{border-top:1px solid #ffffff14!important;justify-content:space-between!important;width:100%!important;padding-top:.75rem!important}}.btn:disabled{background:var(--bg-tertiary)!important;border-color:var(--text-muted)!important;color:var(--text-muted)!important;cursor:not-allowed!important;box-shadow:none!important}.form-input:disabled{color:var(--text-muted)!important;cursor:not-allowed!important;background:#030308!important;border-color:#121224!important}input:disabled+.slider{cursor:not-allowed!important;background-color:#0c0c1a!important;border-color:#242448!important}input:disabled+.slider:before{background-color:var(--text-muted)!important}.landing-nav{background:#0d0d10eb;border:1px solid #ffffff14;justify-content:space-between;align-items:center;width:calc(100% - 3rem);max-width:1200px;margin:1.5rem auto;padding:1rem 2rem;display:flex;box-shadow:0 8px 32px #000000b3}.landing-hero-title{letter-spacing:-.01em;color:#fff;font-size:clamp(2rem,6.5vw,3.5rem);font-weight:800;line-height:1.15;font-family:var(--font-mono);margin-bottom:1.5rem}.landing-hero-desc{color:var(--text-secondary);max-width:800px;margin:0 auto 3.5rem;font-size:clamp(1rem,2.5vw,1.15rem);font-weight:400;line-height:1.7}.landing-action-cards{grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:2rem;max-width:850px;margin:0 auto;display:grid}.landing-metrics-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem;max-width:1000px;margin:0 auto;display:grid}.landing-comparison-container{width:100%;overflow-x:auto}.landing-comparison-table{min-width:600px}@media (max-width:768px){.landing-nav{text-align:center;flex-direction:column!important;gap:1rem!important;width:calc(100% - 1.5rem)!important;margin:1rem auto!important;padding:1.25rem 1rem!important}.landing-nav>div{flex-direction:column!important;align-items:center!important;gap:.5rem!important}.landing-nav-actions{width:100%;flex-direction:column!important;gap:.75rem!important}.landing-nav-actions button{width:100%}}@keyframes loader-fade-in{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes float-shield{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-8px)rotate(1deg)}}@keyframes draw-shield{0%{stroke-dashoffset:700px;opacity:.3}50%{opacity:.8}to{stroke-dashoffset:0;opacity:1}}@keyframes laser-strike-left{0%{opacity:0;width:2px;height:0;transform:translate(-150px,-150px)rotate(45deg)}15%{opacity:1;width:3px;height:250px}35%{opacity:0;height:0;transform:translate(80px,80px)rotate(45deg)}to{opacity:0;transform:translate(80px,80px)rotate(45deg)}}@keyframes laser-strike-right{0%{opacity:0;width:2px;height:0;transform:translate(150px,-150px)rotate(-45deg)}15%{opacity:1;width:3px;height:250px}35%{opacity:0;height:0;transform:translate(-80px,80px)rotate(-45deg)}to{opacity:0;transform:translate(-80px,80px)rotate(-45deg)}}@keyframes flare-burst{0%,12%{opacity:0;transform:scale(0)}15%{opacity:1;transform:scale(1.8)}30%{opacity:0;transform:scale(2.8)}to{opacity:0;transform:scale(0)}}@keyframes hope-stretch{0%,to{letter-spacing:.1em;opacity:.7;filter:drop-shadow(0 0 2px var(--accent-red));transform:scaleX(1)}50%{letter-spacing:.4em;opacity:1;filter:drop-shadow(0 0 12px var(--accent-blue));transform:scaleX(1.08)}}@keyframes particle-drift{0%{opacity:0;transform:translateY(20px)translate(0)}50%{opacity:.6}to{opacity:0;transform:translateY(-40px)translate(10px)}}@keyframes scan-line-v2{0%{opacity:0;top:0%}5%{opacity:.4}95%{opacity:.4}to{opacity:0;top:100%}}.superman-loader-container{background:radial-gradient(circle,#005bff08 0%,#0000 70%);flex-direction:column;justify-content:center;align-items:center;min-height:380px;padding:2rem;animation:.5s cubic-bezier(.16,1,.3,1) forwards loader-fade-in;display:flex;position:relative;overflow:hidden}.superman-loader-container.fullscreen{z-index:99999;background:var(--bg-primary);width:100vw;min-height:100vh;position:fixed;inset:0}.shield-wrapper{justify-content:center;align-items:center;width:140px;height:140px;margin-bottom:2rem;animation:4s ease-in-out infinite float-shield;display:flex;position:relative}.superman-shield-svg{filter:drop-shadow(0 0 12px #ff1a4040)}.shield-border{stroke-dasharray:700;stroke-dashoffset:700px;animation:4s ease-in-out infinite alternate draw-shield}.shield-inner-s{animation:2s ease-in-out infinite pulse-glow}@keyframes pulse-glow{0%,to{opacity:.6;filter:drop-shadow(0 0 4px var(--accent-gold))}50%{opacity:1;filter:drop-shadow(0 0 15px var(--accent-red))}}.laser-beam-effect{background:linear-gradient(to top, #fff, var(--accent-red), transparent);filter:drop-shadow(0 0 8px var(--accent-red)) drop-shadow(0 0 20px var(--accent-red));opacity:0;pointer-events:none;position:absolute}.laser-left{transform-origin:0 0;animation:2.5s cubic-bezier(.25,1,.5,1) infinite laser-strike-left;top:10px;left:10px}.laser-right{transform-origin:100% 0;animation:2.5s cubic-bezier(.25,1,.5,1) infinite laser-strike-right;top:10px;right:10px}.laser-flare-center{width:16px;height:16px;box-shadow:0 0 25px 12px var(--accent-gold), 0 0 50px 25px var(--accent-red);opacity:0;pointer-events:none;background:#fff;border-radius:50%;animation:2.5s cubic-bezier(.25,1,.5,1) infinite flare-burst;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)scale(0)}.hope-title{font-family:var(--font-brand);color:#0000;text-shadow:0 0 20px #005bff66;letter-spacing:.15em;text-transform:uppercase;background:linear-gradient(90deg, #fff, var(--accent-gold), #fff);-webkit-background-clip:text;background-clip:text;margin-bottom:.5rem;font-size:2.25rem;font-weight:900;animation:3s ease-in-out infinite hope-stretch}.loader-particle{background:var(--accent-blue);pointer-events:none;opacity:0;border-radius:50%;width:4px;height:4px;position:absolute}.p1{animation:3s ease-in-out .5s infinite particle-drift;bottom:20%;left:25%}.p2{background:var(--accent-gold);animation:3.5s ease-in-out 1.2s infinite particle-drift;bottom:15%;left:45%}.p3{background:var(--accent-red);animation:2.8s ease-in-out .2s infinite particle-drift;bottom:25%;right:30%}.p4{animation:3.2s ease-in-out .8s infinite particle-drift;bottom:18%;right:15%}.scanning-grid{pointer-events:none;background:linear-gradient(90deg,#0000,#005bff4d,#0000);height:1px;animation:2.5s linear infinite scan-line-v2;position:absolute;left:0;right:0}@keyframes laser-strike-left-mobile{0%{opacity:0;width:2px;height:0;transform:translate(-90px,-90px)rotate(45deg)}15%{opacity:1;width:2px;height:150px}35%{opacity:0;height:0;transform:translate(50px,50px)rotate(45deg)}to{opacity:0;transform:translate(50px,50px)rotate(45deg)}}@keyframes laser-strike-right-mobile{0%{opacity:0;width:2px;height:0;transform:translate(90px,-90px)rotate(-45deg)}15%{opacity:1;width:2px;height:150px}35%{opacity:0;height:0;transform:translate(-50px,50px)rotate(-45deg)}to{opacity:0;transform:translate(-50px,50px)rotate(-45deg)}}@media (max-width:520px){.superman-loader-container{min-height:280px;padding:1.5rem 1rem}.shield-wrapper{width:90px;height:90px;margin-bottom:1.5rem}.hope-title{font-size:1.6rem}.laser-left{animation:2.5s cubic-bezier(.25,1,.5,1) infinite laser-strike-left-mobile}.laser-right{animation:2.5s cubic-bezier(.25,1,.5,1) infinite laser-strike-right-mobile}.laser-flare-center{width:10px;height:10px}}
