.room-manager{position:fixed;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;z-index:1000}.room-manager-container{background:#fff;padding:3rem;border-radius:20px;box-shadow:0 20px 60px #0000004d;max-width:400px;width:90%}.room-manager h1{margin:0 0 .5rem;font-size:2rem;color:#333;text-align:center}.subtitle{margin:0 0 2rem;color:#666;text-align:center;font-size:.9rem}.input-group{margin-bottom:1.5rem}.input-group label{display:block;margin-bottom:.5rem;color:#333;font-weight:600;font-size:.9rem}.input-group input{width:100%;padding:.75rem;border:2px solid #e0e0e0;border-radius:10px;font-size:1rem;transition:all .3s ease;box-sizing:border-box}.input-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.input-group input:disabled{background:#f5f5f5;cursor:not-allowed}.button-group{margin-bottom:1.5rem}.create-button,.join-button{width:100%;padding:1rem;border:none;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.create-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.create-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #667eea4d}.join-button{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.join-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #f5576c4d}.create-button:disabled,.join-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.divider{text-align:center;position:relative;margin:2rem 0}.divider:before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:#e0e0e0}.divider span{background:#fff;padding:0 1rem;position:relative;color:#999;font-size:.85rem;font-weight:600}.error-message{background:#fee;color:#c33;padding:.75rem;border-radius:8px;text-align:center;font-size:.9rem;margin-top:1rem;border:1px solid #fcc}.invite-notification{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:1rem;border-radius:10px;text-align:center;margin-bottom:1.5rem;font-size:.95rem;box-shadow:0 4px 15px #667eea4d;animation:slideIn .3s ease-out}.invite-notification strong{font-weight:700;letter-spacing:1px}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.game-hud{position:absolute;top:20px;left:20px;right:20px;z-index:100;display:flex;justify-content:space-between;align-items:flex-start;pointer-events:none}.game-info{background:#fffffff2;padding:1.5rem;border-radius:15px;box-shadow:0 10px 30px #0003;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);pointer-events:auto}.info-item{display:flex;align-items:center;margin-bottom:.75rem;gap:.5rem}.info-item:last-child{margin-bottom:0}.label{font-weight:600;color:#666;font-size:.9rem}.value{font-weight:700;color:#333;font-size:1rem}.value.code{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.25rem .75rem;border-radius:8px;font-family:Courier New,monospace;letter-spacing:2px}.leave-button{background:#ff4444f2;color:#fff;border:none;padding:.75rem 1.5rem;border-radius:10px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #ff44444d;pointer-events:auto}.leave-button:hover{background:#ff2828f2;transform:translateY(-2px);box-shadow:0 6px 20px #f446}.leave-button:active{transform:translateY(0)}.invite-section{margin-top:.5rem;padding-top:.75rem;border-top:2px solid #f0f0f0}.invite-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.6rem 1.2rem;border-radius:8px;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #667eea4d;width:100%}.invite-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.invite-button:active{transform:translateY(0)}html,body,#root{height:100%;margin:0}canvas{display:block}