@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&family=Space+Grotesk:wght@300;400;500;600;700&display=swap";
:root{--bg-deep:#0a0a0f;--bg-panel:#12121a;--bg-card:#1a1a2e;--bg-card-hover:#22223a;--cyan:#00f0ff;--cyan-dim:#00a0aa;--magenta:#f0a;--magenta-dim:#a07;--yellow:#f0e000;--red:#f24;--green:#0f8;--orange:#f80;--text-primary:#e0e0f0;--text-secondary:#88a;--text-muted:#557;--border-glow:#00f0ff4d;--border-subtle:#ffffff0f;--font-display:"Orbitron",monospace;--font-body:"Space Grotesk",sans-serif;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--transition-fast:.15s ease;--transition-normal:.3s ease;--transition-slow:.5s ease}*{box-sizing:border-box;margin:0;padding:0}html,body{background:var(--bg-deep);height:100%;color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;overflow-x:hidden}body{background-image:radial-gradient(ellipse at 20% 50%,#00f0ff08 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,#ff00aa08 0%,transparent 50%),linear-gradient(180deg,var(--bg-deep)0%,#0d0d15 100%);background-attachment:fixed}body:before{content:"";pointer-events:none;z-index:0;background-image:linear-gradient(#00f0ff05 1px,#0000 1px),linear-gradient(90deg,#00f0ff05 1px,#0000 1px);background-size:40px 40px;width:100%;height:100%;position:fixed;top:0;left:0}h1,h2,h3,h4{font-family:var(--font-display);letter-spacing:.05em}a{color:var(--cyan);transition:var(--transition-fast);text-decoration:none}a:hover{color:var(--magenta);text-shadow:0 0 10px var(--magenta)}button{font-family:var(--font-display);cursor:pointer;transition:var(--transition-normal);border:none;outline:none}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-deep)}::-webkit-scrollbar-thumb{background:var(--cyan-dim);border-radius:3px}@keyframes glow-pulse{0%,to{opacity:.6}50%{opacity:1}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes glitch{0%{transform:translate(0)}20%{transform:translate(-2px,2px)}40%{transform:translate(-2px,-2px)}60%{transform:translate(2px,2px)}80%{transform:translate(2px,-2px)}to{transform:translate(0)}}@keyframes scanline{0%{transform:translateY(-100%)}to{transform:translateY(100vh)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes neonFlicker{0%,19%,21%,23%,25%,54%,56%,to{text-shadow:0 0 7px var(--cyan),0 0 10px var(--cyan),0 0 21px var(--cyan)}20%,24%,55%{text-shadow:none}}.cyber-btn{border:1px solid var(--cyan-dim);color:var(--cyan);letter-spacing:.1em;text-transform:uppercase;border-radius:var(--radius-md);background:linear-gradient(135deg,#00f0ff1a 0%,#00f0ff0d 100%);justify-content:center;align-items:center;gap:8px;padding:12px 32px;font-size:.9rem;font-weight:600;display:inline-flex;position:relative;overflow:hidden}.cyber-btn:before{content:"";background:linear-gradient(90deg,#0000,#00f0ff33,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.cyber-btn:hover{border-color:var(--cyan);background:linear-gradient(135deg,#00f0ff33 0%,#00f0ff1a 100%);transform:translateY(-2px);box-shadow:0 0 20px #00f0ff4d,inset 0 0 20px #00f0ff0d}.cyber-btn:hover:before{left:100%}.cyber-btn:active{transform:translateY(0)}.cyber-btn--magenta{border-color:var(--magenta-dim);color:var(--magenta);background:linear-gradient(135deg,#ff00aa1a 0%,#ff00aa0d 100%)}.cyber-btn--magenta:hover{border-color:var(--magenta);background:linear-gradient(135deg,#f0a3 0%,#ff00aa1a 100%);box-shadow:0 0 20px #ff00aa4d,inset 0 0 20px #ff00aa0d}.cyber-btn--red{border-color:var(--red);color:var(--red);background:linear-gradient(135deg,#ff22441a 0%,#ff22440d 100%)}.cyber-btn--red:hover{box-shadow:0 0 20px #ff22444d}.cyber-btn:disabled{opacity:.3;cursor:not-allowed;transform:none}.cyber-panel{background:var(--bg-panel);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:24px;position:relative}.cyber-panel--glow{border-color:var(--border-glow);box-shadow:0 0 30px #00f0ff0d}.neon-text{color:var(--cyan);text-shadow:0 0 7px var(--cyan),0 0 10px var(--cyan),0 0 21px var(--cyan)}.neon-text--magenta{color:var(--magenta);text-shadow:0 0 7px var(--magenta),0 0 10px var(--magenta),0 0 21px var(--magenta)}
