.event-loop-page{--neon-green:#0f0;--neon-cyan:#0ff;--neon-pink:#f0f;--neon-yellow:#ff0;--neon-orange:#f80;--neon-red:#f04;--neon-purple:#a855f7;--event-bg-light:#f8fafc;--event-surface-light:#fff;--event-text-light:#1e293b;--event-muted-light:#64748b;--event-border-light:#e2e8f0;--event-bg-dark:#0a0a0f;--event-surface-dark:#12121a;--event-text-dark:#e4e4e7;--event-muted-dark:#71717a;--event-border-dark:#27272a;--event-bg:var(--event-bg-light);--event-surface:var(--event-surface-light);--event-text:var(--event-text-light);--event-muted:var(--event-muted-light);--event-border:var(--event-border-light);background:var(--event-bg);color:var(--event-text);scrollbar-width:thin;scrollbar-color:var(--neon-green) var(--event-bg)}.dark .event-loop-page,[data-theme=dark] .event-loop-page{--event-bg:var(--event-bg-dark);--event-surface:var(--event-surface-dark);--event-text:var(--event-text-dark);--event-muted:var(--event-muted-dark);--event-border:var(--event-border-dark);background:var(--event-bg);color:var(--event-text)}.bg-event-bg{background-color:var(--event-bg)}.bg-event-surface{background-color:var(--event-surface)}.text-event-text{color:var(--event-text)}.text-event-muted{color:var(--event-muted)}.border-event-border{border-color:var(--event-border)}.text-neon-green{color:var(--neon-green)}.text-neon-cyan{color:var(--neon-cyan)}.text-neon-pink{color:var(--neon-pink)}.text-neon-yellow{color:var(--neon-yellow)}.text-neon-orange{color:var(--neon-orange)}.text-neon-red{color:var(--neon-red)}.text-neon-purple{color:var(--neon-purple)}.bg-neon-green{background-color:var(--neon-green)}.bg-neon-cyan{background-color:var(--neon-cyan)}.bg-neon-pink{background-color:var(--neon-pink)}.bg-neon-yellow{background-color:var(--neon-yellow)}.bg-neon-orange{background-color:var(--neon-orange)}.bg-neon-red{background-color:var(--neon-red)}.bg-neon-purple{background-color:var(--neon-purple)}.border-neon-green{border-color:var(--neon-green)}.border-neon-cyan{border-color:var(--neon-cyan)}.border-neon-pink{border-color:var(--neon-pink)}.border-neon-yellow{border-color:var(--neon-yellow)}.border-neon-red{border-color:var(--neon-red)}.border-neon-purple{border-color:var(--neon-purple)}.event-loop-page ::-webkit-scrollbar{width:8px;height:8px}.event-loop-page ::-webkit-scrollbar-track{background:var(--event-bg)}.event-loop-page ::-webkit-scrollbar-thumb{background:var(--neon-green);border-radius:4px}.event-loop-page ::-webkit-scrollbar-thumb:hover{background:#16a34a}.event-loop-page ::selection{color:var(--event-text);background:#00ff004d}.neon-text{text-shadow:0 0 5px,0 0 10px,0 0 20px,0 0 40px}.neon-box{box-shadow:0 0 5px,0 0 10px,0 0 20px,inset 0 0 5px}.neon-border{box-shadow:0 0 2px,0 0 5px,0 0 10px}.phase-sync{--phase-color:#fbbf24;color:#fbbf24}.phase-microtask{--phase-color:#a855f7;color:#a855f7}.phase-timers{--phase-color:#ef4444;color:#ef4444}.phase-io{--phase-color:#3b82f6;color:#3b82f6}.phase-check{--phase-color:#22c55e;color:#22c55e}.phase-close{--phase-color:#ec4899;color:#ec4899}.gradient-border{background:var(--event-surface);border-radius:12px;position:relative}.gradient-border:before{content:"";background:linear-gradient(90deg, var(--neon-green), var(--neon-cyan), var(--neon-pink), var(--neon-red), var(--neon-green));z-index:-1;background-size:400% 400%;border-radius:14px;animation:8s infinite gradient;position:absolute;inset:-2px}@keyframes gradient{0%{background-position:0%}50%{background-position:100%}to{background-position:0%}}.event-loop-page:not(.dark) .gradient-border:before,:not(.dark) .event-loop-page .gradient-border:before{opacity:.6}.bg-grid-pattern{background-image:linear-gradient(var(--neon-green) 1px, transparent 1px), linear-gradient(90deg, var(--neon-green) 1px, transparent 1px)}.bg-grid{background-size:50px 50px}.event-loop-page:not(.dark) .bg-grid-pattern{background-image:linear-gradient(#00c86426 1px,#0000 1px),linear-gradient(90deg,#00c86426 1px,#0000 1px)}.terminal-cursor{background:var(--neon-green);width:10px;height:20px;animation:1s step-end infinite blink;display:inline-block}@keyframes blink{50%{opacity:0}}@keyframes scan-line{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}.animate-scan-line{animation:8s linear infinite scan-line}@keyframes slideIn{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.event-entry{animation:.3s ease-out forwards slideIn}.glitch{position:relative}.glitch:before,.glitch:after{content:attr(data-text);width:100%;height:100%;position:absolute;top:0;left:0}.glitch:before{text-shadow:-2px 0 var(--neon-pink);clip-path:polygon(0 0,100% 0,100% 35%,0 35%);animation:2s linear infinite alternate-reverse glitch-anim;left:2px}.glitch:after{text-shadow:-2px 0 var(--neon-cyan);clip-path:polygon(0 65%,100% 65%,100% 100%,0 100%);animation:3s linear infinite alternate-reverse glitch-anim;left:-2px}@keyframes glitch-anim{0%{clip-path:polygon(0 20%,100% 20%,100% 21%,0 21%)}20%{clip-path:polygon(0 67%,100% 67%,100% 68%,0 68%)}40%{clip-path:polygon(0 33%,100% 33%,100% 34%,0 34%)}60%{clip-path:polygon(0 90%,100% 90%,100% 91%,0 91%)}80%{clip-path:polygon(0 5%,100% 5%,100% 6%,0 6%)}to{clip-path:polygon(0 45%,100% 45%,100% 46%,0 46%)}}.code-editor{font-family:JetBrains Mono,Fira Code,monospace;font-size:14px;line-height:1.6}.cyber-button{transition:all .3s;position:relative;overflow:hidden}.cyber-button:before{content:"";background:linear-gradient(90deg,#0000,#fff3,#0000);width:100%;height:100%;transition:all .5s;position:absolute;top:0;left:-100%}.cyber-button:hover:before{left:100%}.pulse-ring{animation:1.5s ease-out infinite pulse-ring}@keyframes pulse-ring{0%{opacity:1;transform:scale(.8)}to{opacity:0;transform:scale(2)}}.loading-dots:after{content:"";animation:1.5s infinite loading-dots}@keyframes loading-dots{0%,20%{content:"."}40%{content:".."}60%,to{content:"..."}}.phase-connector{position:relative}.phase-connector:after{content:"";background:linear-gradient(currentColor,#0000);width:2px;height:20px;position:absolute;bottom:-20px;left:50%}.font-display{font-family:Orbitron,Inter,system-ui,sans-serif;font-weight:700}.font-mono{font-family:JetBrains Mono,Fira Code,Monaco,monospace}.event-loop-page:not(.dark) .phase-card-timers{background:linear-gradient(135deg,#fef2f2 0%,#fee2e2 100%);border-color:#fca5a5}.event-loop-page:not(.dark) .phase-card-microtask{background:linear-gradient(135deg,#faf5ff 0%,#f3e8ff 100%);border-color:#c4b5fd}.event-loop-page:not(.dark) .phase-card-io{background:linear-gradient(135deg,#eff6ff 0%,#dbeafe 100%);border-color:#93c5fd}.event-loop-page:not(.dark) .phase-card-check{background:linear-gradient(135deg,#f0fdf4 0%,#dcfce7 100%);border-color:#86efac}.event-loop-page:not(.dark) .phase-card-close{background:linear-gradient(135deg,#fdf4ff 0%,#fae8ff 100%);border-color:#f0abfc}.dark .event-loop-page .phase-card-timers,.event-loop-page.dark .phase-card-timers{background:#ef44441a;border-color:#ef44444d}.dark .event-loop-page .phase-card-microtask,.event-loop-page.dark .phase-card-microtask{background:#a855f71a;border-color:#a855f74d}.dark .event-loop-page .phase-card-io,.event-loop-page.dark .phase-card-io{background:#3b82f61a;border-color:#3b82f64d}.dark .event-loop-page .phase-card-check,.event-loop-page.dark .phase-card-check{background:#22c55e1a;border-color:#22c55e4d}.dark .event-loop-page .phase-card-close,.event-loop-page.dark .phase-card-close{background:#ec48991a;border-color:#ec48994d}.gradient-green-cyan{background:linear-gradient(135deg, var(--neon-green), var(--neon-cyan))}.gradient-pink-purple{background:linear-gradient(135deg, var(--neon-pink), var(--neon-purple))}.gradient-orange-red{background:linear-gradient(135deg, var(--neon-orange), var(--neon-red))}.gradient-cyan-pink{background:linear-gradient(135deg, var(--neon-cyan), var(--neon-pink))}@media (max-width:768px){.gradient-border:before{inset:-1px}.bg-grid{background-size:30px 30px}}.event-loop-page *{transition-property:color,background-color,border-color,fill,stroke,opacity,box-shadow,transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.event-loop-page button:focus-visible,.event-loop-page input:focus-visible,.event-loop-page textarea:focus-visible{outline:2px solid var(--neon-green);outline-offset:2px}.animate-bounce-slow{animation:2s infinite bounce}.animate-pulse-glow{animation:2s infinite pulse-glow}@keyframes pulse-glow{0%,to{box-shadow:0 0 5px var(--neon-green), 0 0 10px var(--neon-green)}50%{box-shadow:0 0 20px var(--neon-green), 0 0 40px var(--neon-green)}}
