:root{--bg: #0f1724;--card: #0b1320;--muted: #9aa7b2;--accent: #4f46e5;--glass: rgba(255, 255, 255, .03)}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:linear-gradient(180deg,#071027,#0d1a2b);color:#e6eef6}.app-root{min-height:100vh;display:flex;flex-direction:column}.topbar{display:flex;align-items:center;justify-content:space-between;padding:18px 28px;background:transparent}.topbar h1{margin:0;font-size:18px;letter-spacing:.2px}.container{display:grid;grid-template-columns:320px 1fr;gap:20px;padding:0 24px 24px;flex:1;min-height:0}.card{background:var(--card);padding:18px;border-radius:12px;box-shadow:0 6px 18px #02061799}.controls label{display:block;font-size:13px;color:var(--muted);margin-bottom:10px}.controls input{width:100%;padding:10px;border-radius:8px;border:1px solid rgba(255,255,255,.04);background:var(--glass);color:inherit}.actions{margin-top:12px;display:flex;gap:12px;flex-wrap:wrap}.primary{background:linear-gradient(90deg,var(--accent),#06b6d4);border:0;padding:10px 14px;color:#fff;border-radius:10px;cursor:pointer}.videos h2{margin-top:0;color:var(--muted);font-weight:600}.videos{display:flex;flex-direction:column;min-height:0;height:100%}.videos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));grid-auto-rows:minmax(280px,1fr);gap:12px;flex:1;min-height:0;align-content:stretch}.videos-grid.single-tile .track-wrap{grid-column:1 / -1}.track-wrap{position:relative;min-width:0;min-height:280px;height:100%;display:flex;align-items:stretch;justify-content:stretch;overflow:hidden;border-radius:24px;background:#020817;border:1px solid rgba(255,255,255,.06);transition:border-color .16s ease,box-shadow .16s ease}.track-wrap.speaking{border-color:#38bdf8f2;box-shadow:0 0 0 3px #38bdf847,0 18px 38px #082f496b}.track-status{position:absolute;inset:16px 16px auto 16px;display:flex;justify-content:space-between;pointer-events:none;z-index:2}.track-status-badge{width:40px;height:40px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;color:#fecaca;background:#0f172ac7;border:1px solid rgba(248,113,113,.35);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.track-status-badge svg{width:18px;height:18px}.track-status-badge.hidden{visibility:hidden}.track-placeholder{position:absolute;top:0;right:0;bottom:96px;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:24px 24px 20px;gap:14px;background:radial-gradient(circle at top,rgba(14,165,233,.18),transparent 42%),linear-gradient(180deg,#0f172a,#020617)}.track-avatar{width:clamp(116px,22%,220px);aspect-ratio:1;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:#ffffff14;border:1px solid rgba(255,255,255,.12);color:#f8fafc;font-size:clamp(40px,7vw,72px);font-weight:700;letter-spacing:.06em}.track-placeholder-name{max-width:min(76%,420px);text-align:center;color:#f1f5f9eb;font-size:clamp(16px,1.8vw,24px);font-weight:600;line-height:1.2;text-wrap:balance;overflow-wrap:anywhere}.track-label{position:absolute;left:16px;right:16px;bottom:16px;padding:10px 12px;background:#071027d1;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);color:#fff;border:1px solid rgba(255,255,255,.08);border-radius:16px;font-size:13px;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:64px}.track-name{flex:1;min-width:0;font-size:14px;font-weight:600;letter-spacing:.01em}.track-actions{display:flex;align-items:center;gap:8px}.track-actions-spacer{width:88px;height:40px;flex:0 0 88px}.track-video{width:100%;height:100%;object-fit:cover;display:block}.local-track-video{transform:scaleX(1)!important}.track-video-hidden{opacity:0;pointer-events:none}.track-icon-btn{width:40px;height:40px;border-radius:999px;border:1px solid rgba(255,255,255,.08);background:#ffffff0f;color:#f8fafc;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.track-icon-btn svg{width:18px;height:18px}.track-icon-btn.active{background:#0ea5e938;color:#dbeafe;border-color:#38bdf859}.track-icon-btn.inactive{background:#ef444433;color:#fecaca;border-color:#f8717159}.leave-btn{background:#ef4444;color:#fff;border:0;padding:8px 12px;border-radius:8px;cursor:pointer}#local-wrap{box-shadow:0 8px 30px #0f172499}.footer{padding:18px;text-align:center;color:var(--muted);font-size:13px}@media (max-width:840px){.container{grid-template-columns:1fr;padding:16px}.videos{min-height:60vh}.track-wrap{min-height:46vh}.track-placeholder{bottom:88px;padding:20px 18px 16px}.track-avatar{width:min(38vw,180px)}.track-placeholder-name{max-width:82%}.track-label{left:12px;right:12px;bottom:12px}}