/* 单个视频的液态控制条: 点击视频后在该视频底部浮出；无描边半透明玻璃，空间不足时工具区自动折到第二行 */
.tbar{position:absolute;left:10px;right:10px;bottom:10px;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;padding:6px 10px;border-radius:26px;opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .25s,transform .25s;cursor:default}
.tile.show-bar .tbar{opacity:1;transform:none;pointer-events:auto}
.tile.show-bar .sub{margin-top:-64px}
.tb-main{display:flex;align-items:center;gap:6px;flex:1 1 200px;min-width:0}
.tb-tools{display:flex;align-items:center;gap:1px;flex:0 0 auto;margin-left:auto}
.tb-btn{appearance:none;border:0;background:transparent;color:#fff;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;cursor:pointer;flex:none;font-size:12px;font-weight:700;transition:background .2s,opacity .2s}
.tb-btn:hover{background:rgba(255,255,255,.14)}.tb-btn svg{width:20px;height:20px;fill:currentColor}
.tb-btn.txt{width:auto;padding:0 8px;border-radius:999px}.tb-btn.off{opacity:.45}.tb-btn.on{color:var(--g1)}.tb-btn.cc{font-size:11px}
.tb-seek{flex:1;min-width:40px;margin:0 4px}.tb-vol{width:60px;margin:0 6px 0 0}
.tb-time{font-size:11px;opacity:.85;font-variant-numeric:tabular-nums;white-space:nowrap}
@container (max-width:380px){.tb-time{display:none}}
@container (max-width:300px){.tb-vol{display:none}}