#ch.tg .tg-dcv{position:absolute;inset:0;z-index:8;display:flex;flex-direction:column;background:#070b09;color:#eef3ef;animation:tg-dcv-in .22s var(--tg-ease)}
#ch.tg .tg-dcv[hidden]{display:none}
@keyframes tg-dcv-in{from{opacity:0}to{opacity:1}}
#ch.tg[data-anim="0"] .tg-dcv{animation:none}
#ch.tg .tg-dcv-top{flex:none;display:flex;align-items:center;gap:10px;height:var(--tg-topbar-h);padding:0 12px 0 8px;background:linear-gradient(180deg,rgba(0,0,0,.55),transparent);position:relative;z-index:2}
#ch.tg .tg-dcv-top-ic{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(var(--tg-primary-rgb),.16);color:var(--tg-primary)}
#ch.tg .tg-dcv-top-ic .tgico{font-size:19px}
#ch.tg .tg-dcv-title{font-size:16.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
#ch.tg .tg-dcv-count{flex:none;padding:2px 8px;border-radius:10px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.7);font-size:12px;font-weight:600}
#ch.tg .tg-dcv-sp{flex:1}
#ch.tg .tg-dcv-tbtn{color:rgba(255,255,255,.75)}
#ch.tg .tg-dcv-tbtn:hover{color:#fff;background:rgba(255,255,255,.08)}
#ch.tg .tg-dcv-stage{flex:1;min-height:0;display:flex;padding:8px 16px 4px;overflow:hidden}
#ch.tg .tg-dcv-grid{flex:1;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:10px;max-height:100%}
#ch.tg .tg-dcv-tile{position:relative;min-height:0;min-width:0;aspect-ratio:16/9;flex:none;width:var(--tw,320px);border-radius:12px;overflow:hidden;display:grid;place-items:center;background:color-mix(in srgb,var(--dc-c) 30%,#141a17);cursor:pointer;box-shadow:0 0 0 0 transparent;transition:box-shadow .12s}
#ch.tg .tg-dcv-tile.speaking{box-shadow:inset 0 0 0 3px var(--tg-primary),0 0 0 1px rgba(var(--tg-primary-rgb),.4)}
#ch.tg .tg-dcv-tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
#ch.tg .tg-dcv-tile.scr video{object-fit:contain}
#ch.tg .tg-dcv-av .tg-avatar{box-shadow:0 4px 18px rgba(0,0,0,.35)}
#ch.tg .tg-dcv-name{position:absolute;bottom:10px;inset-inline-start:10px;max-width:calc(100% - 20px);display:flex;align-items:center;gap:5px;padding:3px 9px;border-radius:8px;background:rgba(0,0,0,.55);color:#fff;font-size:13px;font-weight:600;opacity:.92;backdrop-filter:blur(6px)}
#ch.tg .tg-dcv-name span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#ch.tg .tg-dcv-name .tgico{font-size:15px;color:rgba(255,255,255,.8)}
#ch.tg .tg-dcv-name .tgico.tg-dc-srv{color:var(--tg-danger)}
#ch.tg .tg-dcv-live{position:absolute;top:10px;inset-inline-end:10px}
#ch.tg .tg-dcv-spot{flex:1;min-width:0;display:flex;flex-direction:column;gap:10px}
#ch.tg .tg-dcv-spot>.tg-dcv-tile{flex:1;width:auto;aspect-ratio:auto;height:auto;background:#000}
#ch.tg .tg-dcv-strip{flex:none;display:flex;gap:8px;justify-content:center;overflow-x:auto;padding-bottom:2px}
#ch.tg .tg-dcv-tile.small{flex:none;width:150px;height:auto}
#ch.tg .tg-dcv-tile.small .tg-dcv-name{bottom:6px;inset-inline-start:6px;font-size:11.5px;padding:2px 6px}
#ch.tg .tg-dcv-empty{margin:auto;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:rgba(255,255,255,.65);font-size:14px}
#ch.tg .tg-dcv-empty b{font-size:20px;color:#fff}
#ch.tg .tg-dcv-empty-ic{display:grid;place-items:center;width:84px;height:84px;border-radius:50%;background:rgba(var(--tg-primary-rgb),.12);color:var(--tg-primary);margin-bottom:6px}
#ch.tg .tg-dcv-empty-ic .tgico{font-size:42px}
#ch.tg .tg-dcv-bar{flex:none;display:flex;align-items:center;gap:12px;min-height:84px;padding:10px 16px 14px;background:linear-gradient(0deg,rgba(0,0,0,.6),transparent)}
#ch.tg .tg-dcv-bar>.tg-dcv-conn,#ch.tg .tg-dcv-bar>.tg-dcv-sp{flex:1 1 0;min-width:0}
#ch.tg .tg-dcv-conn{display:flex;align-items:center;gap:7px;color:var(--tg-warning);font-size:13px;font-weight:700}
#ch.tg .tg-dcv-conn.ok{color:var(--tg-primary)}
#ch.tg .tg-dcv-conn .tg-call-sig{display:inline-flex;align-items:flex-end;gap:2px;height:12px}
#ch.tg .tg-dcv-conn .tg-call-sig i{width:3px;border-radius:1px;background:currentColor}
#ch.tg .tg-dcv-conn .tg-call-sig i:nth-child(1){height:5px}
#ch.tg .tg-dcv-conn .tg-call-sig i:nth-child(2){height:8px}
#ch.tg .tg-dcv-conn .tg-call-sig i:nth-child(3){height:12px}
#ch.tg .tg-dcv-ctl{flex:none;display:flex;align-items:center;gap:10px;padding:6px;border-radius:30px;background:rgba(255,255,255,.06)}
#ch.tg .tg-dcv-btn{position:relative;overflow:hidden;display:grid;place-items:center;width:52px;height:52px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;transition:background-color .15s,transform .1s}
#ch.tg .tg-dcv-btn .tgico{font-size:24px}
#ch.tg .tg-dcv-btn:hover:not(:disabled){background:rgba(255,255,255,.2)}
#ch.tg .tg-dcv-btn:active:not(:disabled){transform:scale(.95)}
#ch.tg .tg-dcv-btn.on{background:#fff;color:#0b100d}
#ch.tg .tg-dcv-btn.off{background:rgba(var(--tg-danger-rgb),.22);color:#ff8a95}
#ch.tg .tg-dcv-btn.locked::after{content:"";position:absolute;top:8px;inset-inline-end:8px;width:9px;height:9px;border-radius:50%;background:var(--tg-danger)}
#ch.tg .tg-dcv-btn.end{width:64px;border-radius:26px;background:#e5484d}
#ch.tg .tg-dcv-btn.end:hover{background:#f05257}
#ch.tg .tg-dcv-btn:disabled{opacity:.4;cursor:not-allowed}
#ch.tg .tg-dcv-bar.idle{justify-content:center}
#ch.tg .tg-dcv-idle{display:flex;flex-direction:column;align-items:center;gap:10px;color:rgba(255,255,255,.7);font-size:13.5px}
#ch.tg .tg-dcv-join{min-width:220px;height:44px;border-radius:22px;font-size:15px;font-weight:700}
#ch.tg .tg-dcv-vol{padding:8px 14px 6px;min-width:220px}
#ch.tg .tg-dcv-vol-h{display:flex;justify-content:space-between;font-size:13px;color:var(--tg-text-2);margin-bottom:4px}
#ch.tg .tg-dcv-vol input{width:100%;accent-color:var(--tg-primary)}
#ch.tg.dc-voice-view .tg-chat .tg-composer-host,#ch.tg.dc-voice-view .tg-chat-fabs{visibility:hidden}
