#root{display:flex}button{min-width:130px;border-radius:8px;border:1px solid #1a1a1a;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#f9f9f9;cursor:pointer;transition:border-color .25s}.hide-btn{display:none}.join-btn button{float:right}input{border-radius:8px;border:1px solid #1a1a1a;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;transition:border-color .25s}button:hover{background-color:#ddd}button:active{background-color:#ccc}#root .left-side{margin:10px;padding:10px;display:none}#root .right-side .waiting{margin:10px;padding:10px;display:flex}#root .right-side{display:flex;margin:10px;padding:10px;flex-wrap:wrap}#root button,#root input{margin:10px;padding:10px}#root h3{padding:0 10px}#root .button-on{background-color:#079eff;color:#fff}#root .right-side video{height:300px!important;max-width:400px;margin:10px;border-radius:4px;aspect-ratio:16/9}.buttons{position:fixed;bottom:11%;text-align:center;width:100vw;left:0}.common{background-color:#00f;height:9%;width:100vw}.footer{position:fixed;left:0;bottom:0}.header{position:fixed;left:0;top:0}.content{position:absolute;left:0;top:9%;bottom:0%;width:98%;background:black;overflow:auto;color:#fff;padding:0 1%}.activeuser{height:35%;overflow:auto}.alluser{height:64%;border-top:1px solid;width:100%;overflow:auto}.nojoin{text-align:center;margin-top:8%}.join-btn{display:flex;width:100%;height:100%;justify-content:end}.userslist{float:left;width:10vw;height:10vw;background:green;border-radius:15px;margin-right:1vw;margin-top:1vw}.userTile{width:100px;height:100px;border-radius:12px;background:#16a34a;color:#0b0b0b;padding:12px;box-sizing:border-box;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 6px 18px #00000040}.userTile-small{width:100px;height:100px;border-radius:10px;float:left;margin:3px 2px}.avatar-circle{width:40px;height:40px;border-radius:999px;background:rgba(255,255,255,.85);display:grid;place-items:center;font-weight:700;font-size:18px;color:#000;box-shadow:inset 0 -6px 12px #0000000f,0 6px 18px #0000001f;margin-bottom:8px}.tile-username{position:absolute;left:10px;bottom:5px;font-size:1.4em;font-weight:700;color:#fff;text-overflow:ellipsis;white-space:nowrap}.userTile:hover .tile-username{color:#fff;font-weight:700;transform:scale(1.05);white-space:normal}.tile-uid{position:absolute;right:10px;bottom:10px;font-size:11px;color:#ffffffe6}.mic-badge{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:999px;display:grid;place-items:center;box-shadow:0 4px 10px #00000040;z-index:5}.mic-badge.mic-off{background:#ef4444;color:#fff}.mic-badge.mic-on{background:#10b981;color:#fff}.userTile.speaking{transform:translateY(-8px) scale(1.03);box-shadow:0 16px 40px #00000059}.userTile-speakingColor{background:#fb923c;color:#000}@media (max-width: 600px){.userTile,.userTile-small{width:120px;height:120px}.avatar-circle{width:56px;height:56px;font-size:16px}.tile-username{font-size:12px}}.center-mic-wrapper{margin-top:20px;display:flex;justify-content:center}.mic-button{width:60px;height:60px;min-width:60px;border-radius:999px;border:none;outline:none;background:white;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .25s ease;box-shadow:0 6px 18px #0003,0 0 0 5px #ffffff80 inset}.mic-button.mic-on{background:#1e90ff;box-shadow:0 8px 25px #1e90ff99,0 0 0 5px #fff6 inset}.mic-button.mic-off{background:#ef4444;box-shadow:0 8px 25px #ef444499,0 0 0 5px #fff6 inset}.mic-button:hover{transform:scale(1.1)}.mic-button:active{transform:scale(.92)}.switch{position:relative;display:inline-block;width:58px;height:30px}.switch input{display:none}.slider{position:absolute;top:0;right:0;bottom:0;left:0;cursor:pointer;background:#ccc;border-radius:50px;transition:.3s}.slider:before{content:"";position:absolute;width:24px;height:24px;left:3px;top:3px;background:white;border-radius:50%;transition:.3s}.switch input:checked+.slider{background:#22c55e}.switch input:checked+.slider:before{transform:translate(28px)}.status{margin-top:15px;font-weight:600}.start-btn{margin-top:20px;width:100%;padding:14px;border:none;background:#1d84ff;color:#fff;border-radius:8px;font-size:18px}