.toolbar-wrapper{display:flex;flex-direction:column;align-items:center;gap:6px}.toolbar-row{display:flex;align-items:center;gap:4px}.toolbar-grip{color:#ffffff4d;cursor:grab;padding:4px 2px;transition:color .2s ease;display:flex;align-items:center}.toolbar-grip:hover{color:#ffffffb3}.toolbar-grip:active{cursor:grabbing}.toolbar-container{border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;position:relative;transition:width .3s ease-out,border-radius .3s ease-out,background .2s ease,box-shadow .2s ease;height:40px}.toolbar-collapsed{width:40px;border-radius:50%;cursor:pointer;background:rgba(0,0,0,.5);box-shadow:0 4px 16px #0000004d;overflow:hidden}.toolbar-collapsed:hover{background:rgba(0,0,0,.85);box-shadow:0 6px 20px #0006}.toolbar-expanded{border-radius:20px;padding:0 10px 0 5px;background:rgba(0,0,0,.9)!important;box-shadow:0 4px 20px #0006;overflow:visible}.toolbar-content{display:flex;align-items:center;gap:6px;opacity:1;transition:opacity .2s ease-out .1s}.toolbar-content.hidden{opacity:0;pointer-events:none;position:absolute;transition:opacity .12s ease-in}.collapsed-content{transition:opacity .2s ease-out .1s}.collapsed-content.hidden{transition:opacity .12s ease-in}.collapsed-indicator{color:#ffffff80;transition:color .2s ease,transform .2s ease;display:flex;align-items:center;justify-content:center}.toolbar-collapsed:hover .collapsed-indicator{color:#fff;transform:translate(1px)}.toolbar-btn{width:30px;height:30px;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease}.toolbar-btn:hover{background:rgba(255,255,255,.12)}.toolbar-btn:disabled{color:#71717a;cursor:not-allowed;opacity:.5}.toolbar-divider{width:1px;height:18px;background:rgba(255,255,255,.1)}.collapse-btn{width:24px;height:30px;border-radius:4px;border:none;background:transparent;color:#ffffff59;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s ease;padding:0;margin-right:-2px}.collapse-btn:hover{color:#fffc;background:rgba(255,255,255,.05)}.video-panel{display:flex;align-items:center;gap:4px;padding:6px 8px;background-color:#000000e6;border-radius:16px;border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 16px #0006;align-self:center;margin-left:20px;opacity:0;transform:translateY(-8px);transition:opacity .2s ease,transform .2s ease}.video-panel.visible{opacity:1;transform:translateY(0)}.video-panel-btn{display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;transition:all .15s ease}.video-panel-btn:hover{background:rgba(255,255,255,.15)}.video-panel-btn.play-btn{width:32px;height:32px;border-radius:50%;border-color:#22c55e66;background:rgba(34,197,94,.15);color:#22c55e}.video-panel-btn.play-btn:hover{background:rgba(34,197,94,.25)}.video-panel-btn.exit-btn{border-color:#ef44444d;background:rgba(239,68,68,.1);color:#ef4444}.video-panel-btn.exit-btn:hover{background:rgba(239,68,68,.2)}.video-panel-divider{width:1px;height:18px;background:rgba(255,255,255,.1);margin:0 2px}.volume-control{display:flex;align-items:center}.volume-slider-container{width:0;overflow:hidden;transition:width .2s ease,opacity .2s ease;opacity:0;display:flex;align-items:center}.volume-slider-container.expanded{width:60px;opacity:1;margin-left:4px}.volume-slider{width:100%;height:3px;border-radius:2px;outline:none;cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:10px;height:10px;border-radius:50%;background:#fff;cursor:pointer;box-shadow:0 0 2px #00000080}.volume-slider::-moz-range-thumb{width:10px;height:10px;border-radius:50%;background:#fff;cursor:pointer;border:none;box-shadow:0 0 2px #00000080}.app-container{display:flex;height:100vh;width:100vw;background-color:#1a1a1a;color:#fff;overflow:hidden}.main-content{flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:center;background:radial-gradient(circle at center,#2a2a2a 0%,#1a1a1a 100%);padding:0;position:relative}.video-container{width:100%;height:100%;display:flex;justify-content:center;align-items:center;box-shadow:0 10px 30px #00000080;border-radius:12px;overflow:hidden;background-color:#000}.sidebar{width:300px;background-color:#242424;border-left:1px solid #333;display:flex;flex-direction:column;padding:20px;box-shadow:-5px 0 15px #0000004d;z-index:10;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;transition:width .3s ease,padding .3s ease,border .3s ease,opacity .3s ease}.sidebar.closed{width:0;padding:0;border-left:none;opacity:0;overflow:hidden}.sidebar-header{margin-bottom:10px}.sidebar-section{min-width:0;overflow-x:hidden;overflow-y:hidden;width:100%;box-sizing:border-box}.sidebar-section h3{font-size:14px;text-transform:uppercase;letter-spacing:1.5px;color:#888;margin-bottom:15px;border-bottom:1px solid #333;padding-bottom:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.placeholder-content{background-color:#2a2a2a;padding:15px;border-radius:8px;color:#666;font-size:14px;text-align:center;border:1px dashed #444}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px);max-height:0}to{opacity:1;transform:translateY(0);max-height:100px}}.color-panel{animation:slideDown .3s ease-out}@keyframes slideDownCentered{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}.fullscreen-overlay{position:fixed;top:20px;left:50%;transform:translate(-50%);background-color:#202020e6;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:12px 24px;border-radius:16px;display:flex;gap:16px;z-index:10001;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px #0006;transition:transform .3s ease,opacity .3s ease;opacity:0;pointer-events:none}.fullscreen-overlay.visible{transform:translate(-50%);opacity:1;pointer-events:auto}.fullscreen-overlay.hidden{transform:translate(-50%,-100%);opacity:0;pointer-events:none}.users-container{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.2) transparent}.users-container::-webkit-scrollbar{width:6px}.users-container::-webkit-scrollbar-track{background:transparent}.users-container::-webkit-scrollbar-thumb{background-color:#fff3;border-radius:3px}.users-container::-webkit-scrollbar-thumb:hover{background-color:#ffffff4d}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#0f0f0f;color:#e5e5e5;height:100%;overflow:hidden}html{height:100%}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.icon-btn{background:transparent;border:none;color:#71717a;cursor:pointer;padding:6px;border-radius:6px;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center}.icon-btn:hover{background:rgba(255,255,255,.08);color:#fff}.icon-btn:active{transform:scale(.96)}.icon-btn svg{width:18px;height:18px;stroke-width:2px}.icon-btn.small svg{width:14px;height:14px}.icon-btn.danger:hover{color:#fca5a5;background:rgba(220,38,38,.1)}.icon-btn.success{color:#86efac}.switch{position:relative;display:inline-block;width:36px;height:20px;vertical-align:middle}.switch input{opacity:0;width:0;height:0}.slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#27272a;transition:.3s;border-radius:20px;border:1px solid #3f3f46}.slider:before{position:absolute;content:"";height:14px;width:14px;left:2px;bottom:2px;background-color:#71717a;transition:.3s;border-radius:50%}input:checked+.slider{background-color:#e5e5e5;border-color:#e5e5e5}input:checked+.slider:before{transform:translate(16px);background-color:#18181b}.minimal-input{background:rgba(255,255,255,.03);border:1px solid #27272a;border-radius:6px;color:#fff;padding:8px 12px;outline:none;transition:all .2s;font-size:14px;width:100%;box-sizing:border-box}.minimal-input:focus{border-color:#52525b;background:rgba(255,255,255,.05)}.tooltip-container{position:relative;display:inline-block;overflow:visible}.tooltip{visibility:hidden;background-color:#18181b;color:#d4d4d8;text-align:center;padding:4px 8px;border-radius:4px;position:absolute;z-index:1000;bottom:125%;left:50%;transform:translate(-50%);opacity:0;transition:opacity .2s;font-size:11px;white-space:nowrap;border:1px solid #27272a;pointer-events:none;overflow:visible}.tooltip.bottom{bottom:auto;top:125%}.sidebar-section .tooltip-container,.sidebar .tooltip-container{overflow:visible!important}.sidebar .tooltip-container .tooltip{max-width:200px;word-wrap:break-word;white-space:normal;position:fixed!important;transform-origin:center bottom}.users-container,.sidebar-section{overflow-x:visible!important}.tooltip-container:hover .tooltip{visibility:visible;opacity:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}