*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#fff;color:#333;height:100vh;overflow:hidden}#login-panel{background:#f8f8f8;padding:30px;border-radius:12px;box-shadow:0 10px 30px #0000001a;width:360px;text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#login-panel h2{margin-bottom:20px;font-size:20px;color:#007aff}.input-group{margin-bottom:15px;text-align:left}.input-group label{font-size:12px;color:#666;margin-bottom:5px;display:block}.input-group input{width:100%;padding:10px;border:1px solid #ddd;background:#fff;color:#333;border-radius:6px;outline:none;font-size:14px}.input-group input:focus{border-color:#007aff}button.join-btn{width:100%;padding:12px;background:#007aff;border:none;color:#fff;border-radius:6px;font-size:16px;cursor:pointer;margin-top:10px;transition:background .2s}button.join-btn:hover{background:#0062cc}button.join-btn:disabled{background:#aaa;cursor:not-allowed}#video-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000}#local-stream{width:100%;height:100%}#local-stream video{width:100%;height:100%;object-fit:cover}#remote-stream{position:absolute;bottom:90px;right:20px;width:240px;height:180px;border-radius:8px;border:2px solid rgba(255,255,255,.3);overflow:hidden;display:none;background:#333}#remote-stream video{width:100%;height:100%;object-fit:cover}#status-bar{position:absolute;top:16px;right:16px;background:#00000080;padding:4px 10px;border-radius:12px;font-size:12px;color:#0f0;z-index:10}#user-list{position:absolute;top:44px;right:16px;background:#00000080;padding:8px 12px;border-radius:8px;font-size:12px;color:#fff;z-index:10;min-width:100px;text-align:right}#user-list .user-item{padding:2px 0}#user-list .user-item.me{color:#0f0}#toolbar{position:absolute;bottom:0;left:0;right:0;height:64px;background:#000000b3;display:flex;align-items:center;justify-content:center;gap:20px;z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}#toolbar button{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:#ffffff1a;color:#fff;font-size:12px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}#toolbar button:hover{background:#fff3}#toolbar button.off{background:#ffffff0d;border-color:#ffffff26;color:#999}#toolbar button.leave{background:#ff3b30cc;border-color:#ff3b3099;width:auto;padding:0 20px;border-radius:24px}#toolbar button.leave:hover{background:#ff3b30}#toolbar .btn-icon{font-size:18px;line-height:1}#toolbar .btn-label{font-size:10px}