*{margin:0;padding:0;box-sizing:border-box}html,body,#root{width:100%;height:100%;overflow:hidden;font-family:Space Grotesk,Segoe UI,system-ui,sans-serif;background:linear-gradient(135deg,#0a0a0f,#1a1a2e,#16213e)}.lobby{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;color:#fff;padding:2rem}.lobby h1{font-size:clamp(2rem,8vw,4rem);font-weight:900;background:linear-gradient(135deg,#ff6b6b,#ffa502,#ff6b6b);background-size:200% 200%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:gradient-shift 3s ease infinite;text-shadow:0 0 40px rgba(255,107,107,.3);letter-spacing:-.02em}@keyframes gradient-shift{0%,to{background-position:0% 50%}50%{background-position:100% 50%}}.lobby p{font-size:1.25rem;color:#8892b0;max-width:600px;text-align:center;line-height:1.6}.lobby-input{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:400px}.lobby-input input{padding:1rem 1.5rem;font-size:1.1rem;border:2px solid #2d3748;border-radius:12px;background:#1a202ccc;color:#fff;outline:none;transition:all .3s ease}.lobby-input input:focus{border-color:#ff6b6b;box-shadow:0 0 20px #ff6b6b33}.lobby-input input::placeholder{color:#4a5568}.button-group{display:flex;gap:1rem;width:100%;flex-wrap:wrap;justify-content:center}.lobby button{padding:1rem 2rem;font-size:1.1rem;font-weight:700;border:none;border-radius:12px;cursor:pointer;transition:all .3s ease;text-transform:uppercase;letter-spacing:.05em;flex:1;min-width:180px}.btn-normal{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-normal:hover{transform:translateY(-2px);box-shadow:0 10px 30px #667eea66}.btn-vr{background:linear-gradient(135deg,#ff6b6b,#ffa502);color:#fff}.btn-vr:hover{transform:translateY(-2px);box-shadow:0 10px 30px #ff6b6b66}.btn-disabled{opacity:.5;cursor:not-allowed}.btn-disabled:hover{transform:none;box-shadow:none}.vr-badge{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#ff6b6b33;border:1px solid rgba(255,107,107,.3);border-radius:20px;color:#ff6b6b;font-size:.9rem}.status{position:fixed;top:1rem;right:1rem;padding:.5rem 1rem;border-radius:20px;font-size:.85rem;font-weight:600;z-index:100}.status.connected{background:#48bb7833;border:1px solid rgba(72,187,120,.3);color:#48bb78}.status.disconnected{background:#f5656533;border:1px solid rgba(245,101,101,.3);color:#f56565}.status.connecting{background:#ed893633;border:1px solid rgba(237,137,54,.3);color:#ed8936}.hud{position:fixed;top:1rem;left:1rem;display:flex;flex-direction:column;gap:.5rem;z-index:100}.player-list{background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:1rem;min-width:200px}.player-list h3{font-size:.85rem;color:#8892b0;text-transform:uppercase;letter-spacing:.1em;margin-bottom:.75rem}.player-item{display:flex;align-items:center;gap:.5rem;padding:.4rem 0;color:#fff;font-size:.9rem}.player-dot{width:8px;height:8px;border-radius:50%}.player-dot.giant{background:#ff6b6b;box-shadow:0 0 8px #ff6b6b80}.player-dot.small{background:#667eea;box-shadow:0 0 8px #667eea80}.player-tag{font-size:.7rem;padding:.15rem .4rem;border-radius:4px;margin-left:auto}.player-tag.giant{background:#ff6b6b33;color:#ff6b6b}.player-tag.small{background:#667eea33;color:#667eea}.player-tag.you{background:#48bb7833;color:#48bb78}.canvas-container{width:100%;height:100%;position:relative}.instructions{position:fixed;bottom:1rem;left:50%;transform:translate(-50%);background:#0009;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;padding:1rem 1.5rem;color:#fff;font-size:.85rem;display:flex;gap:1.5rem;z-index:100}.instructions kbd{background:#ffffff1a;padding:.2rem .5rem;border-radius:4px;margin-right:.3rem}.loading{display:flex;flex-direction:column;align-items:center;gap:1rem;color:#fff}.spinner{width:50px;height:50px;border:4px solid #2d3748;border-top-color:#ff6b6b;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.lobby h1{font-size:2rem}.lobby p{font-size:1rem}.instructions{flex-direction:column;gap:.5rem;font-size:.75rem}}