:root{--primary:#6366f1;--bg-color:#0f172a;--glass-bg:#1e293b99;--glass-border:#ffffff1a;--text-primary:#f8fafc;--text-secondary:#94a3b8;--accent:#10b981}html,body{overscroll-behavior:none;touch-action:none;width:100%;height:100%;margin:0;padding:0;position:fixed;overflow:hidden}#root{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0;overflow:hidden}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--bg-color);color:var(--text-primary);background-image:radial-gradient(circle at 100% 0,#6366f126 0%,#0000 40%),radial-gradient(circle at 0 100%,#10b98126 0%,#0000 40%);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}.app-container{background:var(--glass-bg);-webkit-backdrop-filter:blur(16px);border:1px solid var(--glass-border);touch-action:none;border-radius:24px;flex-direction:column;width:90%;max-width:1200px;height:80vh;padding:2rem;display:flex;position:relative;overflow:hidden;box-shadow:0 25px 50px -12px #00000080}header{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;margin-bottom:.75rem;padding-bottom:.5rem;display:flex}h1{background:linear-gradient(90deg,#818cf8,#34d399);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin:0;font-size:1.5rem;font-weight:600}.status{color:var(--text-secondary);cursor:pointer;align-items:center;gap:.5rem;font-size:.875rem;display:flex;position:relative}.status-indicator{background:var(--accent);width:10px;height:10px;box-shadow:0 0 10px var(--accent);border-radius:50%}.status-tooltip{visibility:hidden;border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(8px);z-index:1000;width:320px;color:var(--text-primary);opacity:0;pointer-events:none;text-align:left;background:#0f172af2;border-radius:8px;flex-direction:column;gap:.35rem;padding:.75rem 1rem;font-size:.75rem;transition:opacity .2s,visibility .2s;display:flex;position:absolute;top:130%;right:0;box-shadow:0 10px 15px -3px #00000080,0 4px 6px -2px #00000080}.status:hover .status-tooltip{visibility:visible;opacity:1;pointer-events:auto;transition-delay:.6s}.status-tooltip.visible{visibility:visible!important;opacity:1!important;pointer-events:auto!important;transition-delay:0s!important}.status-tooltip-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;padding-bottom:.2rem;display:flex}.status-tooltip-row:last-child{border-bottom:none;padding-bottom:0}.status-tooltip-label{color:var(--text-secondary);font-weight:500}.status-tooltip-value{color:var(--accent);font-family:monospace}.main-content{flex:1;gap:2rem;min-height:0;display:flex}.rooms-grid{box-sizing:border-box;flex:1;grid-template-rows:repeat(3,minmax(0,1fr));grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;height:100%;min-height:0;padding:2px;display:grid;overflow:hidden}.room-speakers-list{border-top:1px solid var(--glass-border);flex-direction:column;flex:1;min-height:0;margin-top:1.5rem;padding-top:1rem;display:flex;overflow-y:auto}.room-speakers-title{text-transform:uppercase;letter-spacing:.05em;color:var(--text-secondary);margin-bottom:.75rem;font-size:.75rem}.speakers-list{flex-direction:column;flex:1;gap:.75rem;display:flex;overflow-y:auto}.speaker-row{background:#ffffff0a;border-radius:8px;align-items:center;gap:.5rem;margin-top:.25rem;padding:.4rem .5rem;transition:all .15s;display:flex}.speaker-avatar{background:linear-gradient(135deg, var(--primary), var(--accent));color:#fff;border-radius:50%;justify-content:center;align-items:center;width:24px;height:24px;font-size:.75rem;font-weight:700;display:flex}.speaker-info{flex-direction:column;flex:1;gap:.15rem;display:flex}.speaker-ssrc{color:var(--text-secondary);font-family:monospace;font-size:.7rem}.speaker-meter{background:#ffffff1a;border-radius:3px;height:6px;overflow:hidden}.meter-fill{border-radius:3px;height:100%;transition:width .1s linear,background-color .2s}.speaker-score{color:var(--text-primary);text-align:right;min-width:3ch;font-size:.875rem;font-weight:600}.empty-state{color:var(--text-secondary);text-align:center;margin-top:2rem;font-size:.875rem}.room-card{border:1px solid var(--glass-border);box-sizing:border-box;-webkit-user-select:none;user-select:none;background:#ffffff08;border-radius:12px;flex-direction:column;height:100%;padding:.75rem 1rem;transition:background .15s,border-color .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.room-card:hover{background:#ffffff0d;transform:none!important}.room-card:active{transform:none!important}.room-header{margin-bottom:.15rem;font-size:.95rem;font-weight:600}.room-participants{color:var(--text-secondary);margin-bottom:.35rem;font-size:.75rem}.room-actions{flex-direction:column;gap:.4rem;margin-top:.25rem;display:flex}button{color:var(--text-primary);cursor:pointer;background:#ffffff1a;border:1px solid #ffffff1a;border-radius:8px;flex:1;padding:.75rem 1.5rem;font-weight:500;transition:all .2s}button:hover{background:#ffffff26}button.ptt{background:var(--primary);border-color:#0000}button.ptt:active{background:#4f46e5;transform:scale(.98)}.hamburger-btn{border:1px solid var(--glass-border);background:0 0;flex:none;padding:.5rem 1rem}.sidebar-backdrop{z-index:1000;background:#00000080;border-radius:24px;position:absolute;inset:0}.sidebar{border-right:1px solid var(--glass-border);background:#1e293b;border-top-left-radius:24px;border-bottom-left-radius:24px;flex-direction:column;gap:.75rem;width:350px;padding:1rem;display:flex;position:absolute;top:0;bottom:0;left:0}.sidebar-header{justify-content:space-between;align-items:center;display:flex}.sidebar-header h2{margin:0;font-size:1.25rem}.close-btn{background:0 0;border:none;flex:none;width:30px;padding:0;font-size:1.5rem}.search-input{border:1px solid var(--glass-border);color:#fff;background:#0003;border-radius:8px;outline:none;padding:.5rem .75rem}.sidebar-list{flex-direction:column;gap:.5rem;display:flex;overflow-y:auto}.sidebar-item{background:#ffffff0d;border-radius:8px;justify-content:space-between;align-items:center;padding:.5rem .75rem;display:flex}.sidebar-item-name{font-weight:500}.sidebar-item-meta{color:var(--text-secondary);font-size:.75rem}.sidebar-btn{flex:none;padding:.4rem .75rem;font-size:.75rem}.sidebar-btn-active{background:#ef4444;border-color:#ef4444;flex:none;padding:.4rem .75rem;font-size:.75rem}.room-header-row{justify-content:space-between;align-items:flex-start;display:flex}.remove-grid-btn{width:30px;color:var(--text-secondary);background:0 0;border:none;flex:none;padding:0;font-size:1.25rem}.remove-grid-btn:hover{color:#fff;background:#ffffff1a}.shout-bar{border-bottom:1px solid var(--glass-border);align-items:center;gap:.75rem;margin-bottom:1rem;padding:.75rem 0;display:flex}.shout-btn,.shout-btn-active{cursor:pointer;border-radius:8px;flex:none;padding:.5rem 1rem;font-size:.8rem;font-weight:600;transition:all .2s}.shout-btn:hover{box-shadow:0 0 8px var(--shout-color);background:#ffffff1a!important}.shout-btn-active{box-shadow:0 0 16px var(--shout-color);animation:1.5s ease-in-out infinite shout-glow}.shout-live-indicator{letter-spacing:.1em;font-size:.65rem;font-weight:700}@keyframes shout-glow{0%,to{box-shadow:0 0 8px var(--shout-color)}50%{box-shadow:0 0 20px var(--shout-color)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}input[type=range].pan-slider{appearance:none;z-index:5;background:0 0;outline:none;height:20px;margin:-8px 0 -4px;position:relative}input[type=range].pan-slider::-webkit-slider-runnable-track{background:#fff3;border-radius:2px;height:4px}input[type=range].pan-slider::-moz-range-track{background:#fff3;border-radius:2px;height:4px}input[type=range].pan-slider::-moz-range-progress{background:0 0}input[type=range].pan-slider::-webkit-slider-thumb{appearance:none;background:var(--accent);border-radius:50%;width:12px;height:12px;margin-top:-4px;transition:transform .1s;box-shadow:0 0 4px #00000080}input[type=range].pan-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}input[type=range].pan-slider::-moz-range-thumb{background:var(--accent);border:none;border-radius:50%;width:12px;height:12px;transition:transform .1s;box-shadow:0 0 4px #00000080}input[type=range].pan-slider::-moz-range-thumb:hover{transform:scale(1.2)}input[type=range].volume-slider{appearance:none;z-index:5;background:0 0;outline:none;height:20px;margin:-8px 0 -4px;position:relative}input[type=range].volume-slider::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) var(--volume-percent,50%), #fff3 var(--volume-percent,50%));border-radius:2px;height:4px}input[type=range].volume-slider::-moz-range-track{background:#fff3;border-radius:2px;height:4px}input[type=range].volume-slider::-webkit-slider-thumb{appearance:none;background:#fff;border-radius:50%;width:12px;height:12px;margin-top:-4px;box-shadow:0 0 4px #00000080}input[type=range].volume-slider::-moz-range-thumb{background:#fff;border:none;border-radius:50%;width:12px;height:12px;box-shadow:0 0 4px #00000080}@media (width<=768px){#root{width:100%;height:100%;display:block;position:absolute;overflow:auto}.app-container{box-sizing:border-box;border:none;border-radius:0;flex-direction:column;width:100%;height:100dvh;padding:.75rem;display:flex}header{flex-direction:column;align-items:flex-start;gap:.5rem;width:100%;margin-bottom:.5rem;padding-bottom:.5rem}header>div{flex-wrap:wrap;justify-content:flex-start;gap:.4rem;width:100%}header button{margin:0!important;padding:.2rem .5rem!important;font-size:.75rem!important}header h1{font-size:1.15rem!important}.status{border-top:1px solid #ffffff0d;justify-content:space-between;width:100%;padding-top:.25rem;margin-left:0!important}.shout-bar{flex-wrap:wrap;gap:.35rem;margin-bottom:.5rem;padding:.35rem}.shout-btn,.shout-btn-active{padding:.25rem .5rem!important;font-size:.7rem!important}.main-content{flex-direction:column;flex:1;gap:.75rem;min-height:0;overflow-y:auto}.rooms-grid{flex:none;grid-template-rows:auto;grid-template-columns:repeat(2,minmax(0,1fr));height:auto;overflow-y:auto;gap:.4rem!important}.room-card{height:auto;min-height:75px!important;padding:.35rem .4rem!important}.room-card>div{flex-direction:column!important;gap:.25rem!important}.room-card .room-header{font-size:.75rem!important}.room-card .room-participants{font-size:.65rem!important}.room-card .room-actions{gap:.2rem!important;margin-top:.2rem!important}.room-card button{height:18px!important;padding:.1rem!important;font-size:.65rem!important}.room-card .room-speakers-list{border-top:1px solid var(--glass-border);flex:none!important;width:100%!important;max-height:60px!important;margin-top:.25rem!important;padding-top:.25rem!important}.room-card .room-speakers-title{display:none!important}.room-card .empty-state{margin-top:.15rem!important;font-size:.65rem!important}.room-card .speaker-row{border-radius:4px!important;gap:.25rem!important;padding:.1rem .2rem!important}.room-card .speaker-avatar{width:12px!important;height:12px!important;font-size:.45rem!important}.room-card .speaker-ssrc{font-size:.6rem!important}.room-card div[style*="width: 1px"]{display:none!important}}