:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}:root{--bg-color: #0a0a0d;--panel-bg: rgba(20, 20, 30, .75);--accent-purple: #8b5cf6;--accent-cyan: #22d3ee;--accent-green: #4ade80;--text-light: #e5e7eb;--text-muted: #9ca3af;--glass-border: rgba(255,255,255,.15)}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-color) url(/assets/metaverse-BputTvQg.png) center/cover fixed;font-family:Orbitron,sans-serif;color:var(--text-light);overflow-x:hidden;line-height:1.4}.room-form-wrapper{display:flex;justify-content:center;align-items:center;min-height:100vh;width:100%;padding:20px;position:relative;overflow:hidden;background:radial-gradient(circle at 50% 50%,#8b5cf61a,#22d3ee0d)}.room-form-wrapper:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 45%,rgba(139,92,246,.1) 50%,transparent 55%);animation:matrix 20s linear infinite;z-index:-1}@keyframes matrix{0%{transform:translate(0) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.room-form{z-index:1;background:#14141ee6;backdrop-filter:blur(10px);background:var(--panel-bg);border:1px solid var(--glass-border);border-radius:12px;padding:2rem;max-width:480px;margin:0 auto;width:100%;box-shadow:0 0 20px #0009;position:relative;overflow:hidden;transition:transform .3s ease}.room-form:hover{transform:translateY(-5px)}.room-form:after{content:"";position:absolute;inset:0;border-radius:12px;z-index:-1;animation:borderGlow 3s ease-in-out infinite;background:linear-gradient(45deg,var(--accent-purple),var(--accent-cyan),var(--accent-purple));mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px}@keyframes borderGlow{0%,to{opacity:.8}50%{opacity:.4}}.room-form h2{text-align:center;margin-bottom:1.5rem;font-size:1.75rem;color:var(--accent-purple);text-shadow:0 0 8px var(--accent-purple);font-family:Orbitron,sans-serif;font-weight:700;letter-spacing:2px;animation:titleFloat 3s ease-in-out infinite}@keyframes titleFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.form-group{margin-bottom:1.2rem}.form-group label{display:block;margin-bottom:.5rem;font-weight:600;color:var(--text-light)}.form-group input{width:100%;padding:.8rem;border:1px solid var(--glass-border);border-radius:6px;background:#0f0f19e6;color:var(--text-light);font-size:1rem;transition:all .3s ease}.form-group input:focus{outline:none;border-color:var(--accent-cyan);box-shadow:0 0 15px #22d3ee4d}.form-actions button{background:linear-gradient(45deg,var(--accent-purple),var(--accent-cyan));border:none;padding:1rem 2rem;border-radius:8px;color:#fff;font-weight:700;text-transform:uppercase;letter-spacing:1px;transition:all .3s ease;position:relative;overflow:hidden;width:100%;margin:.5rem 0}.form-actions button:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent 25%,rgba(255,255,255,.1) 50%,transparent 75%);animation:buttonGlow 3s linear infinite}@keyframes buttonGlow{to{transform:translate(50%,50%) rotate(360deg)}}.form-actions button:hover{transform:scale(1.05);box-shadow:0 0 25px #8b5cf666}.divider{position:relative;margin:2rem 0;text-align:center}.divider:before,.divider:after{content:"";position:absolute;top:50%;width:45%;height:1px;background:linear-gradient(90deg,transparent,var(--accent-cyan),transparent)}.divider:before{left:0}.divider:after{right:0}.error{background:#ff323233;padding:1rem;border-radius:8px;border:1px solid rgba(255,50,50,.5);margin-bottom:1.5rem;animation:errorPulse 1.5s ease-in-out infinite}@keyframes errorPulse{0%,to{opacity:1}50%{opacity:.7}}.video-chat-container{position:fixed;top:2rem;right:2rem;width:320px;background:var(--panel-bg);border:1px solid var(--glass-border);border-radius:12px;padding:1rem;box-shadow:0 0 20px #000000b3;z-index:1000}.local-video-container,.remote-video-container{position:relative;margin-bottom:1rem}.local-video,.remote-video{width:100%;border-radius:8px;background:#000;border:2px solid var(--glass-border);box-shadow:inset 0 0 8px #000c}.local-video{border-color:var(--accent-green)}.remote-video{border-color:var(--accent-cyan)}.username-label,.username{position:absolute;bottom:.5rem;left:.5rem;background:#0009;padding:.25rem .5rem;border-radius:4px;font-size:.85rem;color:var(--text-light);text-shadow:0 0 4px rgba(0,0,0,.8)}.connected-title,.proximity-title{font-size:1rem;margin:.75rem 0;color:var(--accent-purple);text-shadow:0 0 6px var(--accent-purple);text-align:center}.start-call-button,.end-all-button{width:100%;padding:.75rem;margin:.5rem 0;border:none;border-radius:6px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s}.start-call-button{background:var(--accent-green);box-shadow:0 0 8px var(--accent-green);color:#000}.end-all-button{background:var(--accent-purple);box-shadow:0 0 8px var(--accent-purple);color:#fff}.start-call-button:hover,.end-all-button:hover{transform:translateY(-2px)}.game-wrapper{display:flex;gap:2rem;width:100%;padding:2rem}.game-section{flex:2;display:flex;flex-direction:column;gap:1.5rem}.video-section{flex:1}.chat-container{position:relative;width:100%;max-width:800px;background:var(--panel-bg);border:1px solid var(--glass-border);border-radius:12px;display:flex;flex-direction:column;padding:.75rem;box-shadow:0 0 20px #000000b3;overflow:hidden;margin-top:1.5rem;align-self:center}.chat-messages{flex:1;overflow-y:auto;padding:.5rem;background:#0000004d;border-radius:6px;margin-bottom:.75rem}.message{margin-bottom:.6rem;padding:.6rem;border-radius:6px;background:#ffffff1a;box-shadow:0 1px 3px #00000080}.message.own-message{background:#14321480}.message-header{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:.3rem;color:var(--accent-cyan)}.sender{font-weight:700}.timestamp{color:var(--text-muted)}.message-text{font-size:.9rem;color:var(--text-light);word-break:break-word}.chat-input{display:flex;gap:.5rem}.chat-input input{flex:1;padding:.6rem;border:1px solid var(--glass-border);border-radius:6px;background:#0000004d;color:var(--text-light)}.chat-input button{padding:.6rem 1rem;background:var(--accent-purple);border:none;border-radius:6px;color:#fff;font-weight:600;box-shadow:0 0 8px var(--accent-purple);transition:filter .2s}.chat-input button:hover{filter:brightness(1.1)}.metaverse-portal{position:fixed;top:0;left:0;width:100vw;height:100vh;pointer-events:none;z-index:0;overflow:hidden}.cube-container{position:absolute;width:100vw;height:100vh;perspective:1000px;top:0;left:0}.cube{position:absolute;width:50px;height:50px;background:#ffffff1a;border:2px solid currentColor;transform-style:preserve-3d;animation:cubeFloat 12s infinite linear}.cube:nth-child(1){animation-delay:0s;left:10%;top:20%;color:var(--accent-purple)}.cube:nth-child(2){animation-delay:2s;left:30%;top:60%;color:var(--accent-cyan)}.cube:nth-child(3){animation-delay:4s;left:70%;top:40%;color:var(--accent-green)}@keyframes cubeFloat{0%{transform:rotateX(0) rotateY(0) rotate(0) translateZ(0);opacity:0}25%{transform:rotateX(180deg) rotateY(360deg) rotate(90deg) translateZ(300px);opacity:1}50%{transform:rotateX(360deg) rotateY(720deg) rotate(180deg) translateZ(600px);opacity:.5}75%{transform:rotateX(540deg) rotateY(1080deg) rotate(270deg) translateZ(300px);opacity:1}to{transform:rotateX(720deg) rotateY(1440deg) rotate(360deg) translateZ(0);opacity:0}}.particle-network{position:absolute;width:100%;height:100%}.particle{position:absolute;width:6px;height:6px;background:currentColor;border-radius:50%;animation:particleShimmer 3s infinite;filter:blur(1px)}@keyframes particleShimmer{0%,to{transform:translate(0);opacity:0;box-shadow:0 0 10px currentColor}50%{transform:translate(100px,-50px);opacity:1;box-shadow:0 0 20px currentColor}}.holographic-grid{position:absolute;width:200%;height:200%;background:linear-gradient(90deg,rgba(139,92,246,.2) 1px,transparent 1px),linear-gradient(180deg,rgba(34,211,238,.2) 1px,transparent 1px);background-size:40px 40px;animation:gridFlow 40s linear infinite}@keyframes gridFlow{0%{transform:rotate(15deg) translate(0)}to{transform:rotate(15deg) translate(-50px,-50px)}}.metaverse-title{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:4rem;white-space:nowrap}@keyframes titleGlow{0%{opacity:.8;filter:blur(2px)}to{opacity:1;filter:blur(0px)}}