body{background-color:#272b30;font:100% Helvetica,sans-serif}.p5Canvas{height:80vh!important;max-width:100%;width:auto!important}.mute-button{background-color:#444;border:2px solid #888;border-radius:5px;color:#fff;cursor:pointer;font-size:16px;padding:10px 20px;transition:all .3s ease}.mute-button:hover{background-color:#555;border-color:#aaa}.mute-button.muted{background-color:#666}.mute-button.muted:hover{background-color:#777}.name-modal{align-items:center;background-color:rgba(0,0,0,.7);display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:1000}.name-modal.hidden{display:none}.name-modal-content{background-color:#444;border:2px solid #888;border-radius:10px;box-shadow:0 4px 20px rgba(0,0,0,.5);min-width:300px;padding:30px;text-align:center}.name-modal-content h2{color:#fff;font-size:28px;margin-bottom:20px}.name-modal-content p{color:#ccc;font-size:16px;margin-bottom:15px}.name-input{background-color:#333;border:2px solid #888;border-radius:5px;box-sizing:border-box;color:#fff;font-size:16px;margin-bottom:20px;padding:12px;width:100%}.name-input:focus{background-color:#3a3a3a;border-color:#aaa;outline:none}.name-input::placeholder{color:#777}.submit-name-btn{background-color:#4caf50;border:none;border-radius:5px;color:#fff;cursor:pointer;font-size:16px;padding:12px 30px;transition:all .3s ease;width:100%}.submit-name-btn:hover{background-color:#45a049}.submit-name-btn:active{transform:scale(.98)}