@import"https://fonts.googleapis.com/css2?family=VT323&display=swap";@import"https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap";*{box-sizing:border-box;margin:0;padding:0;cursor:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='48' viewport='0 0 100 100' style='fill:black;font-size:24px;'><text y='50%'>🔥</text></svg>") 16 0,auto}:root{--neon-text-color: #f40;--neon-border-color: #08f;--bg-color: #111;--text-color: #0f0;--laser-color-1: #ff0080;--laser-color-2: #00ffff}body{font-family:VT323,monospace;background-color:var(--bg-color);background-image:radial-gradient(circle,rgba(255,0,255,.2) 2px,transparent 2px),radial-gradient(circle,rgba(0,255,255,.2) 2px,transparent 2px);background-size:50px 50px;background-position:0 0,25px 25px;height:100vh;display:flex;justify-content:center;align-items:center;overflow:hidden;animation:backgroundPulse 5s infinite alternate}.chat-container{width:90%;max-width:800px;height:80vh;background-color:#1e1e28cc;border-radius:10px;box-shadow:0 0 10px #f0f,0 0 20px #f0f,0 0 30px #f0f,0 0 40px #f0f;display:flex;flex-direction:column;border:3px solid var(--neon-border-color);animation:glowingBox 2s infinite alternate,shake 10s infinite,rotate 20s infinite;overflow:hidden}.chat-header{padding:20px;border-bottom:3px solid #f0f;text-align:center;background-color:#203;color:#f0f;border-radius:7px 7px 0 0;font-size:2em;text-shadow:0 0 5px #fff,0 0 10px #fff,0 0 15px #f0f,0 0 20px #f0f,0 0 25px #f0f;letter-spacing:5px;animation:textFlicker 2s infinite alternate}.chat-messages-container{flex:1;position:relative;overflow:hidden;background-image:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0h20v20H0V0zm10 17.5a7.5 7.5 0 1 0 0-15 7.5 7.5 0 0 0 0 15zM20 20h20v20H20V20zm10 17.5a7.5 7.5 0 1 0 0-15 7.5 7.5 0 0 0 0 15z' fill='%23333' fill-opacity='0.1' fill-rule='evenodd'/%3E%3C/svg%3E")}.chat-messages{position:absolute;top:0;left:0;right:0;bottom:0;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:15px;scrollbar-width:thin;scrollbar-color:#f0f #222}.chat-messages::-webkit-scrollbar{width:12px}.chat-messages::-webkit-scrollbar-track{background:#222}.chat-messages::-webkit-scrollbar-thumb{background-color:#f0f;border-radius:20px;border:3px solid #222;animation:colorChange 3s infinite}.message{max-width:70%;padding:12px 16px;border-radius:18px;position:relative;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;font-size:1.2em;letter-spacing:1px;overflow:hidden;flex-shrink:0;margin-bottom:10px}.user{align-self:flex-end;background-color:#306;color:#f5f;border:2px solid #ff00ff;border-bottom-right-radius:5px;text-shadow:0 0 5px #f0f;box-shadow:0 0 10px #f0f;animation:pulse 2s infinite,wobble 1s infinite;transform-origin:center}.system{align-self:flex-start;background-color:#033;color:#0fa;border:2px solid #00ffcc;border-bottom-left-radius:5px;text-shadow:0 0 5px #0ff;box-shadow:0 0 10px #0ff;animation:systemPulse 3s infinite,bounce 2s infinite}.chat-input-container{display:flex;padding:15px;border-top:3px solid #f0f;background-color:#203;position:relative;overflow:hidden;flex-shrink:0}.chat-input-container:before{content:"";position:absolute;top:0;left:-150%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,0,255,.4),transparent);animation:scanline 3s infinite linear}#user-input{flex:1;padding:12px;border:3px solid #0ff;border-radius:30px;resize:none;height:60px;font-family:VT323,monospace;margin-right:10px;background-color:#000000b3;color:#0f0;font-size:1.5em;text-shadow:0 0 5px #0f0;transition:all .3s;animation:borderGlow 2s infinite alternate}#user-input:focus{outline:none;border-color:#f0f;box-shadow:0 0 15px #f0f;transform:scale(1.02)}#send-button{background-color:#f0c;color:#fff;border:none;border-radius:30px;padding:0 20px;cursor:pointer;font-weight:700;transition:all .3s;font-family:VT323,monospace;font-size:1.5em;text-shadow:0 0 5px white;box-shadow:0 0 10px #f0f,0 0 20px #f0f;position:relative;overflow:hidden;animation:rainbow 3s infinite,pulse 2s infinite}#send-button:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(255,255,255,.8) 0%,rgba(255,255,255,0) 70%);transform:scale(0);transition:transform .5s}#send-button:hover{background-color:#f0f;transform:scale(1.1) rotate(5deg)}#send-button:hover:before{transform:scale(1)}#send-button:active{transform:scale(.95)}.loading-dots{display:flex;justify-content:center;align-items:center;gap:8px}.loading-dots span{width:12px;height:12px;border-radius:50%;background-color:#0ff;animation:loadingDots 1s infinite alternate}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}@keyframes glowingBox{0%{box-shadow:0 0 10px #f0f,0 0 20px #f0f}to{box-shadow:0 0 20px #f0f,0 0 40px #f0f,0 0 60px #f0f}}@keyframes textFlicker{0%,19.999%,22%,62.999%,64%,64.999%,70%,to{opacity:1;text-shadow:0 0 5px #fff,0 0 10px #fff,0 0 15px #f0f,0 0 20px #f0f}20%,21.999%,63%,63.999%,65%,69.999%{opacity:.4;text-shadow:none}}@keyframes rainbow{0%{background-color:red;box-shadow:0 0 10px red}14%{background-color:#ff7f00;box-shadow:0 0 10px #ff7f00}28%{background-color:#ff0;box-shadow:0 0 10px #ff0}42%{background-color:#0f0;box-shadow:0 0 10px #0f0}57%{background-color:#00f;box-shadow:0 0 10px #00f}71%{background-color:indigo;box-shadow:0 0 10px indigo}85%{background-color:#9400d3;box-shadow:0 0 10px #9400d3}to{background-color:red;box-shadow:0 0 10px red}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@keyframes systemPulse{0%{transform:scale(1);box-shadow:0 0 10px #0ff}50%{transform:scale(1.03);box-shadow:0 0 20px #0ff}to{transform:scale(1);box-shadow:0 0 10px #0ff}}@keyframes wobble{0%,to{transform:translate(0)}15%{transform:translate(-2%) rotate(-1deg)}30%{transform:translate(1.5%) rotate(.8deg)}45%{transform:translate(-1.2%) rotate(-.6deg)}60%{transform:translate(.8%) rotate(.4deg)}75%{transform:translate(-.5%) rotate(-.2deg)}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-6px)}60%{transform:translateY(-3px)}}@keyframes fadeIn{0%{opacity:.5}to{opacity:1}}@keyframes loadingDots{0%{transform:scale(1);opacity:.3}to{transform:scale(2);opacity:1}}@keyframes borderGlow{0%{border-color:#0ff;box-shadow:0 0 5px #0ff}to{border-color:#f0f;box-shadow:0 0 15px #f0f}}@keyframes colorChange{0%{background-color:#f0f}33%{background-color:#0ff}66%{background-color:#ff0}to{background-color:#f0f}}@keyframes shake{0%,to{transform:translate(0)}1%,3%,5%{transform:translate(-3px) rotate(-1deg)}2%,4%,6%{transform:translate(3px) rotate(1deg)}7%,39%{transform:translate(0)}40%,42%,44%{transform:translate(-3px) rotate(-1deg)}41%,43%,45%{transform:translate(3px) rotate(1deg)}46%,79%{transform:translate(0)}80%,82%,84%{transform:translate(-3px) rotate(-1deg)}81%,83%,85%{transform:translate(3px) rotate(1deg)}86%,99%{transform:translate(0)}}@keyframes rotate{0%{transform:rotate(0)}10%{transform:rotate(.5deg)}20%{transform:rotate(0)}30%{transform:rotate(-.5deg)}40%{transform:rotate(0)}50%{transform:rotate(.7deg)}60%{transform:rotate(0)}70%{transform:rotate(-.7deg)}80%{transform:rotate(0)}90%{transform:rotate(.5deg)}to{transform:rotate(0)}}@keyframes scanline{0%{left:-150%}to{left:150%}}@keyframes backgroundPulse{0%{background-color:var(--bg-color)}to{background-color:#202}}.floating{position:absolute;width:20px;height:20px;pointer-events:none;animation:float 15s linear infinite;z-index:-1}@keyframes float{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(-800px) rotate(360deg);opacity:0}}.laser{position:absolute;height:2px;width:100%;opacity:.7;z-index:1}.laser1{top:20%;background:linear-gradient(to right,transparent,var(--laser-color-1),transparent);animation:laserMove1 8s infinite linear}.laser2{top:80%;background:linear-gradient(to right,transparent,var(--laser-color-2),transparent);animation:laserMove2 12s infinite linear}@keyframes laserMove1{0%{transform:translateY(0) scaleY(1)}50%{transform:translateY(20vh) scaleY(3)}to{transform:translateY(0) scaleY(1)}}@keyframes laserMove2{0%{transform:translateY(0) scaleY(2)}50%{transform:translateY(-30vh) scaleY(5)}to{transform:translateY(0) scaleY(2)}}.glitch-container{position:relative;width:100%}.glitch{position:relative;width:100%;color:#fff}.glitch:before,.glitch:after{content:attr(data-text);position:absolute;top:0;left:0;width:100%;height:100%;background:#220033}.glitch:before{left:2px;text-shadow:-1px 0 red;animation:glitch-anim-1 2s infinite linear alternate-reverse}.glitch:after{left:-2px;text-shadow:-1px 0 blue;animation:glitch-anim-2 3s infinite linear alternate-reverse}@keyframes glitch-anim-1{0%{clip-path:inset(80% 0 0 0)}20%{clip-path:inset(20% 0 80% 0)}40%{clip-path:inset(40% 0 40% 0)}60%{clip-path:inset(80% 0 20% 0)}80%{clip-path:inset(10% 0 70% 0)}to{clip-path:inset(30% 0 50% 0)}}@keyframes glitch-anim-2{0%{clip-path:inset(10% 0 60% 0)}20%{clip-path:inset(30% 0 0% 0)}40%{clip-path:inset(50% 0 30% 0)}60%{clip-path:inset(0% 0 90% 0)}80%{clip-path:inset(70% 0 10% 0)}to{clip-path:inset(90% 0 5% 0)}}.matrix-container{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;opacity:.15;pointer-events:none}#matrix-canvas{width:100%;height:100%}.typing-effect{border-right:.15em solid #0ff;white-space:normal;overflow-wrap:break-word;word-wrap:break-word;word-break:break-word;animation:blink-caret .75s step-end infinite}@keyframes typing{0%{width:0}to{width:100%}}@keyframes blink-caret{0%,to{border-color:transparent}50%{border-color:#0ff}}.glow-effect{position:absolute;top:0;left:0;width:100%;height:100%;background:radial-gradient(circle at center,rgba(255,0,255,.1) 0%,transparent 70%);pointer-events:none;animation:glowPulse 5s infinite}@keyframes glowPulse{0%{opacity:.1}50%{opacity:.3}to{opacity:.1}}.btn-shine{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,.3) 50%,rgba(255,255,255,0) 100%);transform:rotate(30deg);animation:shineEffect 4s infinite}@keyframes shineEffect{0%{left:-50%}to{left:150%}}@media (max-width: 768px){.chat-container{width:100%;height:100vh;border-radius:0;animation:glowingBox 2s infinite alternate}.chat-header{border-radius:0;font-size:1.5em}.message{max-width:85%}}