@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap";:root{--neon-cyan: #00f3ff;--neon-magenta: #ff00ff;--dark-bg: #050505;--grid-color: rgba(0, 243, 255, .2)}*{margin:0;padding:0;box-sizing:border-box}body{background-color:var(--dark-bg);color:var(--neon-cyan);font-family:Courier New,Courier,monospace;overflow:hidden;height:100vh;width:100vw;display:flex;justify-content:center;align-items:center}.warp-container{position:fixed;top:0;left:0;width:100%;height:100%;z-index:0;overflow:hidden;pointer-events:none}.warp-star{position:absolute;top:50%;left:50%;width:var(--size);height:var(--size);background:var(--neon-cyan);border-radius:50%;box-shadow:0 0 4px var(--neon-cyan);transform:rotate(var(--angle)) translate(var(--start-distance));animation:warp-travel 20s linear infinite}.warp-star:nth-child(2n){background:var(--neon-magenta);box-shadow:0 0 4px var(--neon-magenta)}.warp-star:nth-child(3n){background:#fff;box-shadow:0 0 3px #fff}@keyframes warp-travel{0%{transform:rotate(var(--angle)) translate(5vw);opacity:0;width:1px;height:1px}10%{opacity:1}to{transform:rotate(var(--angle)) translate(100vw);opacity:0;width:calc(var(--size) * 3);height:calc(var(--size) * 3)}}.warp-container.warping .warp-star{animation-duration:2s!important;box-shadow:0 0 8px var(--neon-cyan)}.warp-container.warping .warp-star:nth-child(2n){box-shadow:0 0 8px var(--neon-magenta)}.vignette{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:50;background:radial-gradient(ellipse at center,transparent 50%,rgba(150,0,100,calc(var(--vignette-intensity, .3) * .2)) 75%,rgba(255,0,150,calc(var(--vignette-intensity, .3) * .4)) 90%,rgba(200,0,120,calc(var(--vignette-intensity, .3) * .6)) 100%);transition:background .5s ease-out}.cyber-grid{position:absolute;top:0;left:-50vw;width:200vw;height:100vh;background-image:linear-gradient(var(--grid-color) 1px,transparent 1px),linear-gradient(90deg,var(--grid-color) 1px,transparent 1px);background-size:40px 40px;background-position:center;transform:perspective(300px) rotateX(80deg) translateY(100px);transform-origin:50% 100%;animation:grid-move var(--grid-speed, 5s) linear infinite;z-index:0;pointer-events:none;-webkit-mask-image:linear-gradient(to bottom,transparent 5%,black 60%);mask-image:linear-gradient(to bottom,transparent 5%,black 60%);transition:animation-duration .5s ease-out}.cyber-grid.grid-active{--grid-color: rgba(0, 243, 255, .35)}@keyframes grid-move{0%{background-position:center 0}to{background-position:center 40px}}.core-container{display:flex;justify-content:center;align-items:center;position:relative;z-index:10;--bass-scale: 1;--mid-opacity: .5;--treble-color: var(--neon-cyan)}.core-complex{position:relative;width:300px;height:300px;display:flex;justify-content:center;align-items:center}.center-reactor{width:80px;height:80px;background:radial-gradient(circle at center,#f05,#301);border:4px solid hsl(var(--eye-hue, 180),100%,50%);border-radius:50%;box-shadow:0 0 30px hsl(var(--eye-hue, 180),100%,50%),inset 0 0 20px hsl(var(--eye-hue, 180),100%,50%);position:relative;z-index:5;transform:translate(var(--eye-x),var(--eye-y)) scale(var(--bass-scale));transition:transform .5s ease-out,border-color .5s ease-out,box-shadow .5s ease-out}.reactor-eye{width:100%;height:100%;background:radial-gradient(circle,#fff,hsl(var(--eye-hue, 180),100%,50%));opacity:var(--mid-opacity);border-radius:50%;mix-blend-mode:overlay;transition:opacity .5s ease-out,background .5s ease-out}.orbit-ring{position:absolute;border-radius:50%;border:1px solid transparent;box-shadow:0 0 10px var(--treble-color);transition:box-shadow .5s ease-out,transform .5s ease-out,border-color .5s ease-out}.ring-1{width:140px;height:140px;border-top:2px solid var(--neon-cyan);border-bottom:2px solid var(--neon-cyan);animation:spin 4s infinite linear}.ring-2{width:200px;height:200px;border-left:4px solid var(--neon-magenta);border-right:2px dashed var(--neon-cyan);animation:spin-reverse 8s infinite linear}.ring-3{width:260px;height:260px;border:1px dotted var(--treble-color);transform:rotate(45deg);animation:pulse-rotate 10s infinite ease-in-out}.ring-4{width:320px;height:320px;border:1px solid rgba(0,243,255,.1);animation:spin 20s infinite linear reverse}.chroma-layer{position:absolute;width:90px;height:90px;border-radius:50%;pointer-events:none;transition:opacity .2s ease-out}.chroma-r{background:radial-gradient(circle,rgba(255,0,100,.5),transparent 60%);transform:translate(-5px,-3px)}.chroma-b{background:radial-gradient(circle,rgba(0,100,255,.5),transparent 60%);transform:translate(5px,3px)}.pupil{position:absolute;top:50%;left:50%;width:30px;height:30px;background:radial-gradient(circle,#f6a 20%,#f08,#804);border-radius:50%;transform:translate(-50%,-50%) scale(.5);transition:transform .2s ease-out;box-shadow:0 0 15px #f08c,0 0 30px #f086}.footer{position:absolute;bottom:30px;width:100%;text-align:center;z-index:1000;font-family:Inter,sans-serif;letter-spacing:1px;pointer-events:none}.copyright{color:var(--neon-cyan);font-size:14px;text-shadow:0 0 5px var(--neon-cyan);margin-bottom:8px;text-transform:uppercase}.email{color:var(--neon-magenta);font-size:12px;text-shadow:0 0 5px var(--neon-magenta);font-family:Courier New,monospace}.system-hud{position:absolute;top:50%;left:30px;transform:translateY(-50%);width:200px;background:#000510b3;border-left:2px solid var(--neon-cyan);border-right:1px solid rgba(0,243,255,.2);padding:15px;z-index:100;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:0 0 15px #00000080;font-family:Inter,sans-serif;color:#fff}.system-hud:before{content:"";position:absolute;top:-2px;left:-2px;width:10px;height:2px;background:var(--neon-cyan)}.system-hud:after{content:"";position:absolute;bottom:-2px;left:-2px;width:10px;height:2px;background:var(--neon-cyan)}.hud-header{font-size:14px;color:var(--neon-cyan);text-transform:uppercase;letter-spacing:2px;margin-bottom:20px;border-bottom:1px solid rgba(0,243,255,.2);padding-bottom:5px;text-shadow:0 0 5px var(--neon-cyan)}.hud-section{display:flex;flex-direction:column;gap:15px;margin-bottom:20px}.stat-item{width:100%}.stat-meta{display:flex;justify-content:space-between;font-size:11px;margin-bottom:4px;font-family:Courier New,monospace;font-weight:700}.stat-label{text-shadow:0 0 3px currentColor}.graph-container{width:100%;height:30px;background:#0000004d;border:1px solid rgba(255,255,255,.1);overflow:hidden}.hud-info{border-top:1px solid rgba(0,243,255,.2);padding-top:15px;display:flex;flex-direction:column;gap:8px}.info-row{display:flex;justify-content:space-between;font-size:10px;font-family:Courier New,monospace}.info-row .label{color:#888}.info-row .value{color:var(--neon-magenta);text-align:right}.ip-text{filter:blur(4px);transition:filter .3s;cursor:pointer}.ip-text:hover{filter:blur(0)}@keyframes spin{0%{transform:rotate(0) scale(var(--bass-scale))}to{transform:rotate(360deg) scale(var(--bass-scale))}}@keyframes spin-reverse{0%{transform:rotate(360deg) scale(calc(var(--bass-scale) * .9))}to{transform:rotate(0) scale(calc(var(--bass-scale) * .9))}}@keyframes pulse-rotate{0%{transform:rotate(0) scale(1);opacity:.5}50%{transform:rotate(180deg) scale(1.1);opacity:1}to{transform:rotate(360deg) scale(1);opacity:.5}}.particle{position:absolute;background:var(--neon-cyan);border-radius:50%;box-shadow:0 0 5px var(--neon-cyan);transform:scale(var(--particle-kick));opacity:var(--mid-opacity);pointer-events:none;animation:float-particle 4s infinite ease-in-out;transition:transform .5s ease-out,opacity .5s ease-out}.outer-particle{opacity:.3!important;z-index:1;animation-duration:10s;background:#fff;box-shadow:0 0 4px #fff}.particle:nth-child(2n){background:var(--neon-magenta);box-shadow:0 0 5px var(--neon-magenta)}@keyframes float-particle{0%,to{transform:translate(0) scale(var(--particle-kick))}50%{transform:translate(10px,-10px) scale(calc(var(--particle-kick) * 1.5))}}.glitch-layer{position:absolute;top:0;left:0;width:100%;height:100%;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,243,255,.05) 3px,rgba(0,243,255,.05) 3px);pointer-events:none;z-index:100}.audio-control{position:absolute;top:30px;right:30px;z-index:200}.pill-toggle{background:#050505cc;border:1px solid var(--neon-cyan);color:var(--neon-cyan);border-radius:50px;padding:8px 20px;display:flex;align-items:center;gap:12px;cursor:pointer;transition:all .3s ease;box-shadow:0 0 5px var(--neon-cyan);min-width:100px;justify-content:center}.pill-toggle:hover{box-shadow:0 0 15px var(--neon-cyan);background:#00f3ff1a}.pill-toggle.playing{box-shadow:0 0 15px var(--neon-cyan)}.bars{display:flex;align-items:flex-end;gap:2px;height:14px}.bar{width:3px;height:100%;background:var(--neon-cyan);transform:scaleY(.4);transform-origin:bottom}.playing .bar{animation:bar-dance .8s infinite ease-in-out}.playing .bar:nth-child(2){animation-delay:.2s}.playing .bar:nth-child(3){animation-delay:.4s}@keyframes bar-dance{0%{transform:scaleY(.4)}50%{transform:scaleY(1)}to{transform:scaleY(.4)}}.status-text{font-family:Inter,sans-serif;font-weight:700;font-size:14px;letter-spacing:1px}@keyframes pulse{0%,to{transform:rotate(45deg) scale(1);box-shadow:0 0 20px var(--neon-magenta)}50%{transform:rotate(45deg) scale(1.1);box-shadow:0 0 40px var(--neon-magenta),0 0 10px var(--neon-cyan)}}@keyframes rotate-forward{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes rotate-reverse{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}