vue-video-plus 1.4.0 → 1.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +188 -1
- package/dist/style.css +1 -1
- package/dist/types/src/App.vue.d.ts +64 -8
- package/dist/types/src/package/components/ContextmenuNew.vue.d.ts +43 -0
- package/dist/types/src/package/components/LiveBadge.vue.d.ts +26 -0
- package/dist/types/src/package/components/QualitySelector.vue.d.ts +12 -0
- package/dist/types/src/package/components/VueVideoPlus.vue.d.ts +56 -4
- package/dist/types/src/package/composables/useHls.d.ts +28 -0
- package/dist/types/src/package/config/contextmenu.d.ts +12 -0
- package/dist/types/src/package/config/index.d.ts +77 -0
- package/dist/types/src/package/types/contextmenu.d.ts +117 -0
- package/dist/types/src/package/types/hls.d.ts +103 -0
- package/dist/types/src/package/utils/contextmenu.d.ts +54 -0
- package/dist/types/src/package/utils/hlsDetector.d.ts +24 -0
- package/dist/types/src/package/version.d.ts +1 -1
- package/dist/vueVideo-es.js +23548 -1054
- package/dist/vueVideo-umd.js +40 -1
- package/package.json +11 -2
- package/dist/types/src/package/components/Contextmenu.vue.d.ts +0 -21
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# 🎬vuevideoplus
|
|
1
|
+
bagn # 🎬vuevideoplus
|
|
2
2
|
|
|
3
3
|
<div align="center">
|
|
4
4
|
|
|
@@ -27,8 +27,10 @@
|
|
|
27
27
|
- 🎨 **主题定制** - 支持纯色/渐变主题,可自定义播放器颜色
|
|
28
28
|
- 📱 **响应式设计** - 完美适配桌面端和移动端
|
|
29
29
|
- 🎯 **丰富功能** - 倍速播放、画中画、全屏、关灯模式等
|
|
30
|
+
- 🎬 **清晰度切换** - 支持多清晰度无缝切换,自动记忆用户偏好
|
|
30
31
|
- ⌨️ **快捷键支持** - 空格播放/暂停、方向键快进快退、音量调节
|
|
31
32
|
- 🔄 **自动播放策略** - 智能处理浏览器自动播放限制
|
|
33
|
+
- 💾 **状态持久化** - 自动保存音量、倍速、清晰度等设置,刷新页面也能记住
|
|
32
34
|
- 🎭 **镜像画面** - 支持视频镜像翻转
|
|
33
35
|
- 🔊 **音量记忆** - 自动记住用户音量设置
|
|
34
36
|
- 🎬 **循环播放** - 支持视频循环播放
|
|
@@ -210,11 +212,57 @@ import myVideo from '@/assets/video.mp4'
|
|
|
210
212
|
|-----|------|------|--------|
|
|
211
213
|
| `speed` | 是否支持快进快退 | `Boolean` | `true` |
|
|
212
214
|
| `speedRate` | 倍速选项 | `Array` | `['2.0', '1.5', '1.25', '1.0', '0.75', '0.5']` |
|
|
215
|
+
| `qualities` | 清晰度选项列表 | `Array<QualityOption>` | `[]` |
|
|
213
216
|
| `mirror` | 镜像画面 | `Boolean` | `false` |
|
|
214
217
|
| `lightOff` | 关灯模式 | `Boolean` | `false` |
|
|
215
218
|
| `webFullScreen` | 网页全屏 | `Boolean` | `false` |
|
|
216
219
|
| `playsinline` | iOS 内联播放(不全屏) | `Boolean` | `false` |
|
|
217
220
|
|
|
221
|
+
#### 🎬 清晰度配置 (qualities)
|
|
222
|
+
|
|
223
|
+
**类型定义:**
|
|
224
|
+
```typescript
|
|
225
|
+
interface QualityOption {
|
|
226
|
+
label: string // 显示标签,如 "1080P"
|
|
227
|
+
value: string // 清晰度标识,如 "1080p"
|
|
228
|
+
url: string // 对应的视频源地址
|
|
229
|
+
default?: boolean // 是否为默认清晰度
|
|
230
|
+
}
|
|
231
|
+
```
|
|
232
|
+
|
|
233
|
+
**使用示例:**
|
|
234
|
+
```vue
|
|
235
|
+
<VueVideoPlus
|
|
236
|
+
src="/video-1080p.mp4"
|
|
237
|
+
:qualities="[
|
|
238
|
+
{
|
|
239
|
+
label: '超清 1080P',
|
|
240
|
+
value: '1080p',
|
|
241
|
+
url: '/video-1080p.mp4',
|
|
242
|
+
default: true
|
|
243
|
+
},
|
|
244
|
+
{
|
|
245
|
+
label: '高清 720P',
|
|
246
|
+
value: '720p',
|
|
247
|
+
url: '/video-720p.mp4'
|
|
248
|
+
},
|
|
249
|
+
{
|
|
250
|
+
label: '标清 480P',
|
|
251
|
+
value: '480p',
|
|
252
|
+
url: '/video-480p.mp4'
|
|
253
|
+
}
|
|
254
|
+
]"
|
|
255
|
+
/>
|
|
256
|
+
```
|
|
257
|
+
|
|
258
|
+
**注意事项:**
|
|
259
|
+
- 空数组 `[]` 表示不启用清晰度切换功能
|
|
260
|
+
- 建议提供 3-5 个清晰度选项
|
|
261
|
+
- 切换清晰度时会保持播放位置和播放状态
|
|
262
|
+
- 用户选择的清晰度会自动保存(需启用 `storage.fields.quality`)
|
|
263
|
+
|
|
264
|
+
**📖 详细文档:** [清晰度切换配置指南](./docs/features/清晰度切换配置指南.md)
|
|
265
|
+
|
|
218
266
|
### UI 配置
|
|
219
267
|
|
|
220
268
|
| 参数 | 说明 | 类型 | 默认值 |
|
|
@@ -255,6 +303,81 @@ import myVideo from '@/assets/video.mp4'
|
|
|
255
303
|
|-----|------|------|--------|
|
|
256
304
|
| `playRetryTimeout` | 播放重试超时时间(毫秒) | `Number` | `500` |
|
|
257
305
|
|
|
306
|
+
### 💾 状态持久化配置
|
|
307
|
+
|
|
308
|
+
播放器支持自动保存用户设置到本地存储(localStorage),刷新页面后自动恢复。
|
|
309
|
+
|
|
310
|
+
| 参数 | 说明 | 类型 | 默认值 |
|
|
311
|
+
|-----|------|------|--------|
|
|
312
|
+
| `storage` | 持久化配置对象 | `Object` | 见下方说明 |
|
|
313
|
+
| `videoId` | 视频唯一标识(用于区分不同视频的播放位置) | `String` | `''` |
|
|
314
|
+
|
|
315
|
+
**storage 配置项:**
|
|
316
|
+
|
|
317
|
+
```javascript
|
|
318
|
+
storage: {
|
|
319
|
+
enabled: true, // 是否启用持久化
|
|
320
|
+
prefix: 'vue-video-player', // localStorage key 前缀
|
|
321
|
+
|
|
322
|
+
// 要持久化的字段
|
|
323
|
+
fields: {
|
|
324
|
+
volume: true, // ✅ 音量(强烈推荐)
|
|
325
|
+
playbackRate: true, // ✅ 播放速度(强烈推荐)
|
|
326
|
+
muted: true, // ✅ 静音状态(推荐)
|
|
327
|
+
quality: true, // ✅ 清晰度偏好(推荐)
|
|
328
|
+
currentTime: false // ⚖️ 播放位置(默认关闭,可按需开启)
|
|
329
|
+
},
|
|
330
|
+
|
|
331
|
+
// 播放位置保存配置(仅当 fields.currentTime=true 时生效)
|
|
332
|
+
currentTimeConfig: {
|
|
333
|
+
enabled: false, // 是否启用播放位置保存
|
|
334
|
+
minDuration: 300, // 最小保存时长(秒),视频<5分钟不保存
|
|
335
|
+
minProgress: 0.05, // 最小保存进度(5%),避免保存刚开始的视频
|
|
336
|
+
maxProgress: 0.95 // 最大保存进度(95%),避免保存已完成的视频
|
|
337
|
+
},
|
|
338
|
+
|
|
339
|
+
// 过期时间配置
|
|
340
|
+
expiration: {
|
|
341
|
+
global: 0, // 全局设置过期时间(毫秒),0=永不过期
|
|
342
|
+
currentTime: 30 * 24 * 60 * 60 * 1000 // 播放位置过期时间(30天)
|
|
343
|
+
}
|
|
344
|
+
}
|
|
345
|
+
```
|
|
346
|
+
|
|
347
|
+
**使用示例:**
|
|
348
|
+
|
|
349
|
+
```vue
|
|
350
|
+
<template>
|
|
351
|
+
<VueVideoPlus
|
|
352
|
+
src="/video.mp4"
|
|
353
|
+
videoId="my-video-001"
|
|
354
|
+
:storage="{
|
|
355
|
+
enabled: true,
|
|
356
|
+
prefix: 'my-app-video',
|
|
357
|
+
fields: {
|
|
358
|
+
volume: true,
|
|
359
|
+
playbackRate: true,
|
|
360
|
+
currentTime: true // 启用断点续播
|
|
361
|
+
},
|
|
362
|
+
currentTimeConfig: {
|
|
363
|
+
enabled: true,
|
|
364
|
+
minDuration: 300
|
|
365
|
+
}
|
|
366
|
+
}"
|
|
367
|
+
/>
|
|
368
|
+
</template>
|
|
369
|
+
```
|
|
370
|
+
|
|
371
|
+
**💡 使用场景:**
|
|
372
|
+
|
|
373
|
+
- **默认配置(推荐)**:自动保存音量、倍速、静音状态
|
|
374
|
+
- **启用断点续播**:适合长视频、课程、电影等场景,设置 `fields.currentTime: true`
|
|
375
|
+
- **禁用持久化**:设置 `storage: { enabled: false }`
|
|
376
|
+
|
|
377
|
+
**📖 详细文档:**
|
|
378
|
+
|
|
379
|
+
持久化功能配置较为复杂,详细说明请查看:[状态持久化配置指南](./docs/features/状态持久化配置指南.md)
|
|
380
|
+
|
|
258
381
|
## 🎮 事件
|
|
259
382
|
|
|
260
383
|
### 原生视频事件
|
|
@@ -450,6 +573,18 @@ const options = reactive({
|
|
|
450
573
|
'fullScreen'
|
|
451
574
|
],
|
|
452
575
|
|
|
576
|
+
// 持久化配置
|
|
577
|
+
storage: {
|
|
578
|
+
enabled: true,
|
|
579
|
+
prefix: 'my-video-app',
|
|
580
|
+
fields: {
|
|
581
|
+
volume: true,
|
|
582
|
+
playbackRate: true,
|
|
583
|
+
muted: true,
|
|
584
|
+
currentTime: false
|
|
585
|
+
}
|
|
586
|
+
},
|
|
587
|
+
|
|
453
588
|
// 高级配置
|
|
454
589
|
playRetryTimeout: 500
|
|
455
590
|
})
|
|
@@ -595,6 +730,58 @@ if (Hls.isSupported()) {
|
|
|
595
730
|
}
|
|
596
731
|
```
|
|
597
732
|
|
|
733
|
+
### 5. 如何启用断点续播功能?
|
|
734
|
+
|
|
735
|
+
设置 `storage.fields.currentTime: true` 并配置 `currentTimeConfig`:
|
|
736
|
+
|
|
737
|
+
```vue
|
|
738
|
+
<VueVideoPlus
|
|
739
|
+
src="/movie.mp4"
|
|
740
|
+
videoId="movie-001"
|
|
741
|
+
:storage="{
|
|
742
|
+
fields: {
|
|
743
|
+
currentTime: true
|
|
744
|
+
},
|
|
745
|
+
currentTimeConfig: {
|
|
746
|
+
enabled: true,
|
|
747
|
+
minDuration: 300, // 只保存5分钟以上的视频
|
|
748
|
+
minProgress: 0.05, // 进度>5%才保存
|
|
749
|
+
maxProgress: 0.95 // 进度<95%才保存
|
|
750
|
+
}
|
|
751
|
+
}"
|
|
752
|
+
/>
|
|
753
|
+
```
|
|
754
|
+
|
|
755
|
+
**注意**:记得设置 `videoId` 来区分不同视频的播放位置。
|
|
756
|
+
|
|
757
|
+
### 6. 为什么刷新后音量/倍速没有保存?
|
|
758
|
+
|
|
759
|
+
确保持久化功能已启用(默认启用):
|
|
760
|
+
|
|
761
|
+
```javascript
|
|
762
|
+
storage: {
|
|
763
|
+
enabled: true, // 确保为 true
|
|
764
|
+
fields: {
|
|
765
|
+
volume: true, // 保存音量
|
|
766
|
+
playbackRate: true // 保存倍速
|
|
767
|
+
}
|
|
768
|
+
}
|
|
769
|
+
```
|
|
770
|
+
|
|
771
|
+
如果仍然不生效,检查浏览器是否禁用了 localStorage。
|
|
772
|
+
|
|
773
|
+
### 7. 如何清除已保存的播放数据?
|
|
774
|
+
|
|
775
|
+
打开浏览器开发者工具(F12):
|
|
776
|
+
1. 进入 Application → Local Storage
|
|
777
|
+
2. 找到 `vue-video-player-settings` 键(或你自定义的 prefix)
|
|
778
|
+
3. 右键删除
|
|
779
|
+
|
|
780
|
+
或在代码中清除:
|
|
781
|
+
```javascript
|
|
782
|
+
localStorage.removeItem('vue-video-player-settings')
|
|
783
|
+
```
|
|
784
|
+
|
|
598
785
|
## 📄 License
|
|
599
786
|
|
|
600
787
|
MIT License
|
package/dist/style.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@import"//at.alicdn.com/t/c/font_4726673_pdcujlcxe7l.css";.icon[data-v-c2c4e023]{width:1em;height:1em;vertical-align:-.15em;fill:currentColor;overflow:hidden}.rotating[data-v-c2c4e023]{animation:rotating-c2c4e023 2s linear infinite}@keyframes rotating-c2c4e023{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.cc[data-v-c2c4e023]{background-color:red}ul[data-v-b2b7b6a5],ol[data-v-b2b7b6a5]{list-style:none;padding-left:0;margin-left:0}li[data-v-b2b7b6a5]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-b2b7b6a5]:before,li[data-v-b2b7b6a5]::marker{display:none!important;content:none!important}.iconfont[data-v-b2b7b6a5]{display:inline-block}.d-flex-x[data-v-b2b7b6a5],.d-flex-y[data-v-b2b7b6a5],.flex-center[data-v-b2b7b6a5]{display:flex}.d-flex-x[data-v-b2b7b6a5]{align-items:center}.d-flex-y[data-v-b2b7b6a5]{justify-content:center}.flex-center[data-v-b2b7b6a5]{justify-content:center;align-items:center}.mr5[data-v-b2b7b6a5]{margin-right:5px}.mr10[data-v-b2b7b6a5]{margin-right:10px}.ml5[data-v-b2b7b6a5]{margin-left:5px}.ml10[data-v-b2b7b6a5]{margin-left:10px}.d-pointer[data-v-b2b7b6a5]{cursor:pointer}@keyframes rotating-b2b7b6a5{to{-webkit-transform:rotate(360deg)}}.rotating[data-v-b2b7b6a5]{animation:rotating-b2b7b6a5 2s linear infinite}@keyframes showAni-b2b7b6a5{0%{display:none}50%{display:block}to{display:none}}.showH[data-v-b2b7b6a5]:hover{-webkit-animation:showAni-b2b7b6a5 .5s;animation:showAni-b2b7b6a5 .5s}@keyframes biggerAni-b2b7b6a5{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.biggerAni[data-v-b2b7b6a5]:hover{-webkit-animation:biggerAni-b2b7b6a5 .5s;animation:biggerAni-b2b7b6a5 .5s}@keyframes biggerScaleAni-b2b7b6a5{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}}.biggerScaleAni[data-v-b2b7b6a5]:hover{-webkit-animation:biggerScaleAni-b2b7b6a5 .5s;animation:biggerScaleAni-b2b7b6a5 .5s}@keyframes ScaleAni-b2b7b6a5{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}to{-webkit-transform:rotate(90deg)}}.ScaleAni[data-v-b2b7b6a5]:hover{-webkit-animation:ScaleAni-b2b7b6a5 .5s linear infinite;animation:ScaleAni-b2b7b6a5 .5s linear infinite}@keyframes playBtnPulse-b2b7b6a5{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes svgWave-b2b7b6a5{0%,to{y1:7;y2:13;opacity:.6}50%{y1:3;y2:17;opacity:1}}.rotateHover[data-v-b2b7b6a5]{transition:.2s}.rotateHover[data-v-b2b7b6a5]:hover{transform:rotate(90deg)}.scaleHover[data-v-b2b7b6a5]{transition:.2s}.scaleHover[data-v-b2b7b6a5]:hover{transform:scale(1.2)}.control-icon-hover[data-v-b2b7b6a5]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover[data-v-b2b7b6a5]:hover{transform:scale(1.09)}.control-icon-hover-large[data-v-b2b7b6a5]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover-large[data-v-b2b7b6a5]:hover{transform:scale(1.25)}.fade-in-enter-active[data-v-b2b7b6a5],.fade-in-leave-active[data-v-b2b7b6a5]{transition:.5s}.fade-in-enter-from[data-v-b2b7b6a5],.fade-in-leave-to[data-v-b2b7b6a5]{opacity:0}.play-btn-center.scale-out-enter-active[data-v-b2b7b6a5]{animation:scaleOutEnter-b2b7b6a5 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-center.scale-out-leave-active[data-v-b2b7b6a5]{animation:scaleOutLeave-b2b7b6a5 .3s ease forwards}@keyframes scaleOutEnter-b2b7b6a5{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes scaleOutLeave-b2b7b6a5{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes scaleOutEnterBottom-b2b7b6a5{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scaleOutLeaveBottom-b2b7b6a5{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.play-btn-bottom-right.scale-out-enter-active[data-v-b2b7b6a5],.play-btn-bottom-left.scale-out-enter-active[data-v-b2b7b6a5]{animation:scaleOutEnterBottom-b2b7b6a5 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-bottom-right.scale-out-leave-active[data-v-b2b7b6a5],.play-btn-bottom-left.scale-out-leave-active[data-v-b2b7b6a5]{animation:scaleOutLeaveBottom-b2b7b6a5 .3s ease forwards}.play-btn-rotate-enter-active[data-v-b2b7b6a5],.play-btn-rotate-leave-active[data-v-b2b7b6a5]{transition:all .3s ease}.play-btn-rotate-enter-from[data-v-b2b7b6a5]{opacity:0;transform:scale(.8) rotate(-90deg)}.play-btn-rotate-enter-to[data-v-b2b7b6a5],.play-btn-rotate-leave-from[data-v-b2b7b6a5]{opacity:1;transform:scale(1) rotate(0)}.play-btn-rotate-leave-to[data-v-b2b7b6a5]{opacity:0;transform:scale(.8) rotate(90deg)}.play-btn-scale-enter-active[data-v-b2b7b6a5],.play-btn-scale-leave-active[data-v-b2b7b6a5]{transition:all .25s cubic-bezier(.34,1.56,.64,1)}.play-btn-scale-enter-from[data-v-b2b7b6a5]{opacity:0;transform:scale(0)}.play-btn-scale-enter-to[data-v-b2b7b6a5],.play-btn-scale-leave-from[data-v-b2b7b6a5]{opacity:1;transform:scale(1)}.play-btn-scale-leave-to[data-v-b2b7b6a5]{opacity:0;transform:scale(0)}.play-btn-flip-enter-active[data-v-b2b7b6a5],.play-btn-flip-leave-active[data-v-b2b7b6a5]{transition:all .4s ease;transform-style:preserve-3d}.play-btn-flip-enter-from[data-v-b2b7b6a5]{opacity:0;transform:rotateY(-180deg)}.play-btn-flip-enter-to[data-v-b2b7b6a5],.play-btn-flip-leave-from[data-v-b2b7b6a5]{opacity:1;transform:rotateY(0)}.play-btn-flip-leave-to[data-v-b2b7b6a5]{opacity:0;transform:rotateY(180deg)}.play-btn-slide-enter-active[data-v-b2b7b6a5],.play-btn-slide-leave-active[data-v-b2b7b6a5]{transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.play-btn-slide-enter-from[data-v-b2b7b6a5]{opacity:0;transform:translate(-20px)}.play-btn-slide-enter-to[data-v-b2b7b6a5],.play-btn-slide-leave-from[data-v-b2b7b6a5]{opacity:1;transform:translate(0)}.play-btn-slide-leave-to[data-v-b2b7b6a5]{opacity:0;transform:translate(20px)}.play-pause-btn[data-v-b2b7b6a5]{position:relative;display:flex;align-items:center;justify-content:center}.play-pause-btn[data-v-b2b7b6a5]:hover svg{animation:playBtnPulse-b2b7b6a5 .6s ease-out}.volume-icon-svg[data-v-b2b7b6a5]{display:block;overflow:visible;opacity:.8;transition:opacity .3s ease}.volume-btn-wrapper[data-v-b2b7b6a5]{cursor:pointer;position:relative;display:flex;align-items:center;gap:4px}.volume-btn-wrapper:hover .volume-icon-svg[data-v-b2b7b6a5]{animation:volumeIconAni-b2b7b6a5 .5s}@keyframes volumeIconAni-b2b7b6a5{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.speaker-icon[data-v-b2b7b6a5]{transform-origin:center;transition:transform .3s ease}.sound-wave-svg[data-v-b2b7b6a5]{display:none;margin-left:2px}.volume-btn-wrapper:hover .sound-wave-svg[data-v-b2b7b6a5]{display:block}.wave-line[data-v-b2b7b6a5]{transform-origin:center;animation:svgWave-b2b7b6a5 .8s ease-in-out infinite}.wave-line.wave-1[data-v-b2b7b6a5]{animation-delay:0s}.wave-line.wave-2[data-v-b2b7b6a5]{animation-delay:.26s}.wave-line.wave-3[data-v-b2b7b6a5]{animation-delay:.52s}.play-control-btn[data-v-b2b7b6a5]{display:inline-block;transition:all .3s ease}.animation-rotate[data-v-b2b7b6a5]{animation:playBtnRotate-b2b7b6a5 .25s ease-in-out}@keyframes playBtnRotate-b2b7b6a5{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.95)}to{transform:rotate(90deg) scale(1)}}.animation-scale[data-v-b2b7b6a5]{animation:playBtnScale-b2b7b6a5 .3s ease}@keyframes playBtnScale-b2b7b6a5{0%{transform:scale(1)}50%{transform:scale(.8)}to{transform:scale(1)}}.animation-flip[data-v-b2b7b6a5]{animation:playBtnFlip-b2b7b6a5 .4s ease}@keyframes playBtnFlip-b2b7b6a5{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.animation-slide[data-v-b2b7b6a5]{animation:playBtnSlide-b2b7b6a5 .3s ease}@keyframes playBtnSlide-b2b7b6a5{0%{transform:translate(-10px);opacity:.5}to{transform:translate(0);opacity:1}}.animation-none[data-v-b2b7b6a5]{animation:none}.f50[data-v-b2b7b6a5]{font-size:50px}.f24[data-v-b2b7b6a5]{font-size:24px}.loading[data-v-b2b7b6a5]{position:absolute;left:0;right:0;bottom:0;top:0;display:flex;align-items:center;justify-content:center;background:#0000004d;z-index:2;color:#efefef;text-align:center;font-size:13px}.progress[data-v-420f2350]{position:relative}.progress .progress__runway[data-v-420f2350]{width:100%;height:var(--fff82272);background-color:#333;position:relative;cursor:pointer;vertical-align:middle}.progress .progress__runway .progress__cursor[data-v-420f2350],.progress .progress__runway .progress__preload[data-v-420f2350],.progress .progress__runway .progress__bar[data-v-420f2350]{position:absolute;top:0;left:0;height:100%}.progress .progress__runway .progress__cursor[data-v-420f2350]{display:none;z-index:1;width:1px;background-color:#fff;pointer-events:none}.progress .progress__runway .progress__cursor .progress__tips[data-v-420f2350]{pointer-events:none;color:#fff;position:absolute;white-space:nowrap;z-index:2;bottom:14px;left:50%;padding:4px;box-sizing:border-box;display:block;font-size:12px;background:#0009;border-radius:3px;transform:translate(-50%)}.progress .progress__runway:hover .progress__cursor[data-v-420f2350]{display:block}.progress .progress__runway .progress__preload[data-v-420f2350]{background:#717171}.progress .progress__runway .progress__bar[data-v-420f2350]:before{display:block;content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;transition:.2s;transform:translateY(-50%) scale(1);border-radius:50%;background:#fff;box-shadow:0 0 0 5px #ffffff80}.progress.is-vertical[data-v-420f2350]{height:100%;display:inline-block}.progress.is-vertical .progress__runway[data-v-420f2350]{position:relative;height:100%;width:var(--fff82272);margin:0 6px}.progress.is-vertical .progress__runway .progress__preload[data-v-420f2350],.progress.is-vertical .progress__runway .progress__bar[data-v-420f2350],.progress.is-vertical .progress__runway .progress__cursor[data-v-420f2350]{bottom:0;top:auto;width:100%}.progress.is-vertical .progress__runway .progress__cursor[data-v-420f2350]{height:1px}.progress.is-vertical .progress__runway .progress__bar[data-v-420f2350]:before{top:-6px;left:50%;width:12px;height:12px;transform:translate(-50%) scale(1)}.switch[data-v-a7b31d07]{position:relative;height:18px;width:var(--4f83a38f);background:#757575;border-radius:10px;display:inline-flex;align-items:center;vertical-align:middle}.switch .switch_input[data-v-a7b31d07]{position:relative;z-index:1;margin:0;width:100%;height:100%;opacity:0}.switch .switch_action[data-v-a7b31d07]{position:absolute;transition:.2s;left:2px;top:2px;z-index:0;height:14px;width:14px;background:#fff;border-radius:50%}.switch.is-checked[data-v-a7b31d07]{background-color:var(--62a76f06)}.switch.is-checked .switch_action[data-v-a7b31d07]{background:#fff;left:24px}ul[data-v-31ec79a9],ol[data-v-31ec79a9]{list-style:none;padding-left:0;margin-left:0}li[data-v-31ec79a9]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-31ec79a9]:before,li[data-v-31ec79a9]::marker{display:none!important;content:none!important}.iconfont[data-v-31ec79a9]{display:inline-block}.d-flex-x[data-v-31ec79a9],.d-flex-y[data-v-31ec79a9],.flex-center[data-v-31ec79a9]{display:flex}.d-flex-x[data-v-31ec79a9]{align-items:center}.d-flex-y[data-v-31ec79a9]{justify-content:center}.flex-center[data-v-31ec79a9]{justify-content:center;align-items:center}.mr5[data-v-31ec79a9]{margin-right:5px}.mr10[data-v-31ec79a9]{margin-right:10px}.ml5[data-v-31ec79a9]{margin-left:5px}.ml10[data-v-31ec79a9]{margin-left:10px}.d-pointer[data-v-31ec79a9]{cursor:pointer}.status[data-v-31ec79a9]{text-align:center;font-size:14px;vertical-align:middle;background:#000c;padding:0 8px;height:30px;border-radius:5px;display:flex;align-items:center;color:#fffffff2}.status .status-icon[data-v-31ec79a9]{width:24px!important;display:inline-block;margin-right:5px}ul[data-v-3bff361c],ol[data-v-3bff361c]{list-style:none;padding-left:0;margin-left:0}li[data-v-3bff361c]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-3bff361c]:before,li[data-v-3bff361c]::marker{display:none!important;content:none!important}.iconfont[data-v-3bff361c]{display:inline-block}.d-flex-x[data-v-3bff361c],.d-flex-y[data-v-3bff361c],.flex-center[data-v-3bff361c]{display:flex}.d-flex-x[data-v-3bff361c]{align-items:center}.d-flex-y[data-v-3bff361c]{justify-content:center}.flex-center[data-v-3bff361c]{justify-content:center;align-items:center}.mr5[data-v-3bff361c]{margin-right:5px}.mr10[data-v-3bff361c]{margin-right:10px}.ml5[data-v-3bff361c]{margin-left:5px}.ml10[data-v-3bff361c]{margin-left:10px}.d-pointer[data-v-3bff361c]{cursor:pointer}@keyframes rotating-3bff361c{to{-webkit-transform:rotate(360deg)}}.rotating[data-v-3bff361c]{animation:rotating-3bff361c 2s linear infinite}@keyframes showAni-3bff361c{0%{display:none}50%{display:block}to{display:none}}.showH[data-v-3bff361c]:hover{-webkit-animation:showAni-3bff361c .5s;animation:showAni-3bff361c .5s}@keyframes biggerAni-3bff361c{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.biggerAni[data-v-3bff361c]:hover{-webkit-animation:biggerAni-3bff361c .5s;animation:biggerAni-3bff361c .5s}@keyframes biggerScaleAni-3bff361c{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}}.biggerScaleAni[data-v-3bff361c]:hover{-webkit-animation:biggerScaleAni-3bff361c .5s;animation:biggerScaleAni-3bff361c .5s}@keyframes ScaleAni-3bff361c{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}to{-webkit-transform:rotate(90deg)}}.ScaleAni[data-v-3bff361c]:hover{-webkit-animation:ScaleAni-3bff361c .5s linear infinite;animation:ScaleAni-3bff361c .5s linear infinite}@keyframes playBtnPulse-3bff361c{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes svgWave-3bff361c{0%,to{y1:7;y2:13;opacity:.6}50%{y1:3;y2:17;opacity:1}}.rotateHover[data-v-3bff361c]{transition:.2s}.rotateHover[data-v-3bff361c]:hover{transform:rotate(90deg)}.scaleHover[data-v-3bff361c]{transition:.2s}.scaleHover[data-v-3bff361c]:hover{transform:scale(1.2)}.control-icon-hover[data-v-3bff361c]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover[data-v-3bff361c]:hover{transform:scale(1.09)}.control-icon-hover-large[data-v-3bff361c]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover-large[data-v-3bff361c]:hover{transform:scale(1.25)}.fade-in-enter-active[data-v-3bff361c],.fade-in-leave-active[data-v-3bff361c]{transition:.5s}.fade-in-enter-from[data-v-3bff361c],.fade-in-leave-to[data-v-3bff361c]{opacity:0}.play-btn-center.scale-out-enter-active[data-v-3bff361c]{animation:scaleOutEnter-3bff361c .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-center.scale-out-leave-active[data-v-3bff361c]{animation:scaleOutLeave-3bff361c .3s ease forwards}@keyframes scaleOutEnter-3bff361c{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes scaleOutLeave-3bff361c{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes scaleOutEnterBottom-3bff361c{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scaleOutLeaveBottom-3bff361c{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.play-btn-bottom-right.scale-out-enter-active[data-v-3bff361c],.play-btn-bottom-left.scale-out-enter-active[data-v-3bff361c]{animation:scaleOutEnterBottom-3bff361c .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-bottom-right.scale-out-leave-active[data-v-3bff361c],.play-btn-bottom-left.scale-out-leave-active[data-v-3bff361c]{animation:scaleOutLeaveBottom-3bff361c .3s ease forwards}.play-btn-rotate-enter-active[data-v-3bff361c],.play-btn-rotate-leave-active[data-v-3bff361c]{transition:all .3s ease}.play-btn-rotate-enter-from[data-v-3bff361c]{opacity:0;transform:scale(.8) rotate(-90deg)}.play-btn-rotate-enter-to[data-v-3bff361c],.play-btn-rotate-leave-from[data-v-3bff361c]{opacity:1;transform:scale(1) rotate(0)}.play-btn-rotate-leave-to[data-v-3bff361c]{opacity:0;transform:scale(.8) rotate(90deg)}.play-btn-scale-enter-active[data-v-3bff361c],.play-btn-scale-leave-active[data-v-3bff361c]{transition:all .25s cubic-bezier(.34,1.56,.64,1)}.play-btn-scale-enter-from[data-v-3bff361c]{opacity:0;transform:scale(0)}.play-btn-scale-enter-to[data-v-3bff361c],.play-btn-scale-leave-from[data-v-3bff361c]{opacity:1;transform:scale(1)}.play-btn-scale-leave-to[data-v-3bff361c]{opacity:0;transform:scale(0)}.play-btn-flip-enter-active[data-v-3bff361c],.play-btn-flip-leave-active[data-v-3bff361c]{transition:all .4s ease;transform-style:preserve-3d}.play-btn-flip-enter-from[data-v-3bff361c]{opacity:0;transform:rotateY(-180deg)}.play-btn-flip-enter-to[data-v-3bff361c],.play-btn-flip-leave-from[data-v-3bff361c]{opacity:1;transform:rotateY(0)}.play-btn-flip-leave-to[data-v-3bff361c]{opacity:0;transform:rotateY(180deg)}.play-btn-slide-enter-active[data-v-3bff361c],.play-btn-slide-leave-active[data-v-3bff361c]{transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.play-btn-slide-enter-from[data-v-3bff361c]{opacity:0;transform:translate(-20px)}.play-btn-slide-enter-to[data-v-3bff361c],.play-btn-slide-leave-from[data-v-3bff361c]{opacity:1;transform:translate(0)}.play-btn-slide-leave-to[data-v-3bff361c]{opacity:0;transform:translate(20px)}.play-pause-btn[data-v-3bff361c]{position:relative;display:flex;align-items:center;justify-content:center}.play-pause-btn[data-v-3bff361c]:hover svg{animation:playBtnPulse-3bff361c .6s ease-out}.volume-icon-svg[data-v-3bff361c]{display:block;overflow:visible;opacity:.8;transition:opacity .3s ease}.volume-btn-wrapper[data-v-3bff361c]{cursor:pointer;position:relative;display:flex;align-items:center;gap:4px}.volume-btn-wrapper:hover .volume-icon-svg[data-v-3bff361c]{animation:volumeIconAni-3bff361c .5s}@keyframes volumeIconAni-3bff361c{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.speaker-icon[data-v-3bff361c]{transform-origin:center;transition:transform .3s ease}.sound-wave-svg[data-v-3bff361c]{display:none;margin-left:2px}.volume-btn-wrapper:hover .sound-wave-svg[data-v-3bff361c]{display:block}.wave-line[data-v-3bff361c]{transform-origin:center;animation:svgWave-3bff361c .8s ease-in-out infinite}.wave-line.wave-1[data-v-3bff361c]{animation-delay:0s}.wave-line.wave-2[data-v-3bff361c]{animation-delay:.26s}.wave-line.wave-3[data-v-3bff361c]{animation-delay:.52s}.play-control-btn[data-v-3bff361c]{display:inline-block;transition:all .3s ease}.animation-rotate[data-v-3bff361c]{animation:playBtnRotate-3bff361c .25s ease-in-out}@keyframes playBtnRotate-3bff361c{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.95)}to{transform:rotate(90deg) scale(1)}}.animation-scale[data-v-3bff361c]{animation:playBtnScale-3bff361c .3s ease}@keyframes playBtnScale-3bff361c{0%{transform:scale(1)}50%{transform:scale(.8)}to{transform:scale(1)}}.animation-flip[data-v-3bff361c]{animation:playBtnFlip-3bff361c .4s ease}@keyframes playBtnFlip-3bff361c{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.animation-slide[data-v-3bff361c]{animation:playBtnSlide-3bff361c .3s ease}@keyframes playBtnSlide-3bff361c{0%{transform:translate(-10px);opacity:.5}to{transform:translate(0);opacity:1}}.animation-none[data-v-3bff361c]{animation:none}.player-contextmenu[data-v-3bff361c],.player-dialog[data-v-3bff361c]{position:absolute;left:0;top:0;bottom:50px;width:100%;z-index:5}.player-contextmenu .player-copyText[data-v-3bff361c]{opacity:0}.player-contextmenu .player-contextmenu-body[data-v-3bff361c]{position:absolute;border-radius:5px;font-size:12px;background:#000c;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);color:#efefef;text-align:left;width:130px;box-sizing:border-box;padding:5px 0}.player-contextmenu .player-contextmenu-body li[data-v-3bff361c]{padding:8px 20px;margin:0;cursor:pointer;transition:.2s}.player-contextmenu .player-contextmenu-body li[data-v-3bff361c]:hover{background-color:gray;opacity:.9}.player-dialog[data-v-3bff361c]{display:flex;justify-content:center;align-items:center}.player-dialog .player-dialog-body[data-v-3bff361c]{background-color:#000000e6;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border-radius:5px;color:#fff;min-width:200px;padding:0 0 10px}.player-dialog .player-dialog-body .player-dialog-title[data-v-3bff361c]{position:relative;font-size:14px;font-weight:400;margin:0 0 10px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.15);text-align:center}.player-dialog .player-dialog-body .player-dialog-title .icon-close[data-v-3bff361c]{position:absolute;right:0;top:0;width:40px;height:40px;line-height:40px;text-align:center;cursor:pointer}.player-dialog .player-dialog-body .player-hotkey-panel[data-v-3bff361c]{font-size:12px;color:#87ceeb;padding-right:40px}.player-dialog .player-dialog-body .player-hotkey-panel .player-hotkey-panel-item[data-v-3bff361c]{line-height:26px}.player-dialog .player-dialog-body .player-hotkey-panel .player-hotkey-panel-item span[data-v-3bff361c]{text-align:center;display:inline-block;width:120px}.player-dialog .player-dialog-body .player-hotkey-panel .player-hotkey-panel-item span[data-v-3bff361c]:nth-child(2){color:#fff;opacity:.9;width:160px}.player-dialog .player-dialog-body .player-filter-panel[data-v-3bff361c]{width:320px;padding:0 20px}.player-dialog .player-dialog-body .player-filter-panel .player-filter-reset[data-v-3bff361c]{cursor:pointer;margin-top:10px;padding:3px 20px;display:inline-block;border-radius:2px;font-size:12px;background:#85858580}.player-dialog .player-dialog-body .player-filter-panel .player-filter-reset[data-v-3bff361c]:hover{background:#ffffff4d}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item[data-v-3bff361c]{height:32px;display:flex;align-items:center}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item .filter-panel-progress[data-v-3bff361c]{width:100%}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item .filter-panel-progress[data-v-3bff361c] .progress__runway{background-color:#999}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item .filter-panel-progress[data-v-3bff361c] .progress__runway .progress__bar:before{width:8px;height:8px;box-shadow:0 0 0 5px #ffffff80}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item span[data-v-3bff361c]{font-size:12px;display:block;width:80px;text-align:center}.settings-icon-svg[data-v-dd6a4ec6]{display:block;overflow:visible;cursor:pointer;opacity:.8;transition:opacity .3s ease}.settings-gear-outer[data-v-dd6a4ec6]{transform-origin:center;transform:rotate(0) scale(1)}.settings-gear-inner[data-v-dd6a4ec6]{transform-origin:center}.setting-btn:hover .settings-icon-svg{animation:settingsIconAni .5s}@keyframes settingsIconAni{0%{opacity:1}50%{opacity:.8}to{opacity:1}}.setting-btn:hover .settings-icon-svg .settings-gear-outer{animation:settingsMatrixAnimation .5s ease-in-out forwards}@keyframes settingsMatrixAnimation{0%{transform:scale(1)}50%{transform:matrix(0,1.3,-1.3,0,0,0)}75%{transform:matrix(-1.065,.746,-.746,-1.065,0,0)}to{transform:scale(-1)}}.volume-icon-svg[data-v-3dcc70e7]{display:block;overflow:visible;opacity:1;transition:opacity .3s ease}.speaker-icon[data-v-3dcc70e7]{transform-origin:center;opacity:1;transition:transform .3s ease}.sound-waves[data-v-3dcc70e7]{opacity:1}.sound-wave[data-v-3dcc70e7]{transform-origin:center;opacity:1}.volume-btn-wrapper:hover .volume-icon-svg{animation:volumeIconAni .5s}@keyframes volumeIconAni{0%{opacity:1}50%{opacity:.8}to{opacity:1}}.volume-btn-wrapper:hover .volume-icon-svg .sound-wave.wave-outer{animation:volumeIconWaveRipple .6s ease-out 2}.volume-btn-wrapper:hover .volume-icon-svg .sound-waves:not(:has(.wave-outer)) .sound-wave.wave-inner{animation:volumeIconWaveRipple .6s ease-out 2}.volume-btn-wrapper:hover .volume-icon-svg .speaker-icon{animation:volumeIconSpeakerScale .6s ease-out .01s}@keyframes volumeIconWaveRipple{0%{opacity:0;transform:scale(.7)}20%{opacity:1;transform:scale(.9)}45%{opacity:1;transform:scale(1.1)}70%{opacity:.6;transform:scale(1.3)}to{opacity:0;transform:scale(1.5)}}@keyframes volumeIconSpeakerScale{0%{transform:scale(1)}40%{transform:scale(1.3)}80%{transform:scale(1)}to{transform:scale(1)}}@keyframes rotating-39e7ee83{to{-webkit-transform:rotate(360deg)}}.rotating[data-v-39e7ee83]{animation:rotating-39e7ee83 2s linear infinite}@keyframes showAni-39e7ee83{0%{display:none}50%{display:block}to{display:none}}.showH[data-v-39e7ee83]:hover{-webkit-animation:showAni-39e7ee83 .5s;animation:showAni-39e7ee83 .5s}@keyframes biggerAni-39e7ee83{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.biggerAni[data-v-39e7ee83]:hover{-webkit-animation:biggerAni-39e7ee83 .5s;animation:biggerAni-39e7ee83 .5s}@keyframes biggerScaleAni-39e7ee83{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}}.biggerScaleAni[data-v-39e7ee83]:hover{-webkit-animation:biggerScaleAni-39e7ee83 .5s;animation:biggerScaleAni-39e7ee83 .5s}@keyframes ScaleAni-39e7ee83{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}to{-webkit-transform:rotate(90deg)}}.ScaleAni[data-v-39e7ee83]:hover{-webkit-animation:ScaleAni-39e7ee83 .5s linear infinite;animation:ScaleAni-39e7ee83 .5s linear infinite}@keyframes playBtnPulse-39e7ee83{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes svgWave-39e7ee83{0%,to{y1:7;y2:13;opacity:.6}50%{y1:3;y2:17;opacity:1}}.rotateHover[data-v-39e7ee83]{transition:.2s}.rotateHover[data-v-39e7ee83]:hover{transform:rotate(90deg)}.scaleHover[data-v-39e7ee83]{transition:.2s}.scaleHover[data-v-39e7ee83]:hover{transform:scale(1.2)}.control-icon-hover[data-v-39e7ee83]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover[data-v-39e7ee83]:hover{transform:scale(1.09)}.control-icon-hover-large[data-v-39e7ee83]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover-large[data-v-39e7ee83]:hover{transform:scale(1.25)}.fade-in-enter-active[data-v-39e7ee83],.fade-in-leave-active[data-v-39e7ee83]{transition:.5s}.fade-in-enter-from[data-v-39e7ee83],.fade-in-leave-to[data-v-39e7ee83]{opacity:0}.play-btn-center.scale-out-enter-active[data-v-39e7ee83]{animation:scaleOutEnter-39e7ee83 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-center.scale-out-leave-active[data-v-39e7ee83]{animation:scaleOutLeave-39e7ee83 .3s ease forwards}@keyframes scaleOutEnter-39e7ee83{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes scaleOutLeave-39e7ee83{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes scaleOutEnterBottom-39e7ee83{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scaleOutLeaveBottom-39e7ee83{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.play-btn-bottom-right.scale-out-enter-active[data-v-39e7ee83],.play-btn-bottom-left.scale-out-enter-active[data-v-39e7ee83]{animation:scaleOutEnterBottom-39e7ee83 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-bottom-right.scale-out-leave-active[data-v-39e7ee83],.play-btn-bottom-left.scale-out-leave-active[data-v-39e7ee83]{animation:scaleOutLeaveBottom-39e7ee83 .3s ease forwards}.play-btn-rotate-enter-active[data-v-39e7ee83],.play-btn-rotate-leave-active[data-v-39e7ee83]{transition:all .3s ease}.play-btn-rotate-enter-from[data-v-39e7ee83]{opacity:0;transform:scale(.8) rotate(-90deg)}.play-btn-rotate-enter-to[data-v-39e7ee83],.play-btn-rotate-leave-from[data-v-39e7ee83]{opacity:1;transform:scale(1) rotate(0)}.play-btn-rotate-leave-to[data-v-39e7ee83]{opacity:0;transform:scale(.8) rotate(90deg)}.play-btn-scale-enter-active[data-v-39e7ee83],.play-btn-scale-leave-active[data-v-39e7ee83]{transition:all .25s cubic-bezier(.34,1.56,.64,1)}.play-btn-scale-enter-from[data-v-39e7ee83]{opacity:0;transform:scale(0)}.play-btn-scale-enter-to[data-v-39e7ee83],.play-btn-scale-leave-from[data-v-39e7ee83]{opacity:1;transform:scale(1)}.play-btn-scale-leave-to[data-v-39e7ee83]{opacity:0;transform:scale(0)}.play-btn-flip-enter-active[data-v-39e7ee83],.play-btn-flip-leave-active[data-v-39e7ee83]{transition:all .4s ease;transform-style:preserve-3d}.play-btn-flip-enter-from[data-v-39e7ee83]{opacity:0;transform:rotateY(-180deg)}.play-btn-flip-enter-to[data-v-39e7ee83],.play-btn-flip-leave-from[data-v-39e7ee83]{opacity:1;transform:rotateY(0)}.play-btn-flip-leave-to[data-v-39e7ee83]{opacity:0;transform:rotateY(180deg)}.play-btn-slide-enter-active[data-v-39e7ee83],.play-btn-slide-leave-active[data-v-39e7ee83]{transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.play-btn-slide-enter-from[data-v-39e7ee83]{opacity:0;transform:translate(-20px)}.play-btn-slide-enter-to[data-v-39e7ee83],.play-btn-slide-leave-from[data-v-39e7ee83]{opacity:1;transform:translate(0)}.play-btn-slide-leave-to[data-v-39e7ee83]{opacity:0;transform:translate(20px)}.play-pause-btn[data-v-39e7ee83]{position:relative;display:flex;align-items:center;justify-content:center}.play-pause-btn[data-v-39e7ee83]:hover svg{animation:playBtnPulse-39e7ee83 .6s ease-out}.volume-icon-svg[data-v-39e7ee83]{display:block;overflow:visible;opacity:.8;transition:opacity .3s ease}.volume-btn-wrapper[data-v-39e7ee83]{cursor:pointer;position:relative;display:flex;align-items:center;gap:4px}.volume-btn-wrapper:hover .volume-icon-svg[data-v-39e7ee83]{animation:volumeIconAni-39e7ee83 .5s}@keyframes volumeIconAni-39e7ee83{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.speaker-icon[data-v-39e7ee83]{transform-origin:center;transition:transform .3s ease}.sound-wave-svg[data-v-39e7ee83]{display:none;margin-left:2px}.volume-btn-wrapper:hover .sound-wave-svg[data-v-39e7ee83]{display:block}.wave-line[data-v-39e7ee83]{transform-origin:center;animation:svgWave-39e7ee83 .8s ease-in-out infinite}.wave-line.wave-1[data-v-39e7ee83]{animation-delay:0s}.wave-line.wave-2[data-v-39e7ee83]{animation-delay:.26s}.wave-line.wave-3[data-v-39e7ee83]{animation-delay:.52s}.play-control-btn[data-v-39e7ee83]{display:inline-block;transition:all .3s ease}.animation-rotate[data-v-39e7ee83]{animation:playBtnRotate-39e7ee83 .25s ease-in-out}@keyframes playBtnRotate-39e7ee83{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.95)}to{transform:rotate(90deg) scale(1)}}.animation-scale[data-v-39e7ee83]{animation:playBtnScale-39e7ee83 .3s ease}@keyframes playBtnScale-39e7ee83{0%{transform:scale(1)}50%{transform:scale(.8)}to{transform:scale(1)}}.animation-flip[data-v-39e7ee83]{animation:playBtnFlip-39e7ee83 .4s ease}@keyframes playBtnFlip-39e7ee83{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.animation-slide[data-v-39e7ee83]{animation:playBtnSlide-39e7ee83 .3s ease}@keyframes playBtnSlide-39e7ee83{0%{transform:translate(-10px);opacity:.5}to{transform:translate(0);opacity:1}}.animation-none[data-v-39e7ee83]{animation:none}ul[data-v-39e7ee83],ol[data-v-39e7ee83]{list-style:none;padding-left:0;margin-left:0}li[data-v-39e7ee83]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-39e7ee83]:before,li[data-v-39e7ee83]::marker{display:none!important;content:none!important}.iconfont[data-v-39e7ee83]{display:inline-block}.d-flex-x[data-v-39e7ee83],.d-flex-y[data-v-39e7ee83],.flex-center[data-v-39e7ee83]{display:flex}.d-flex-x[data-v-39e7ee83]{align-items:center}.d-flex-y[data-v-39e7ee83]{justify-content:center}.flex-center[data-v-39e7ee83]{justify-content:center;align-items:center}.mr5[data-v-39e7ee83]{margin-right:5px}.mr10[data-v-39e7ee83]{margin-right:10px}.ml5[data-v-39e7ee83]{margin-left:5px}.ml10[data-v-39e7ee83]{margin-left:10px}.d-pointer[data-v-39e7ee83]{cursor:pointer}.player-wrap[data-v-39e7ee83]{position:relative;overflow:hidden;background-color:#000}.player-wrap.web-full-screen[data-v-39e7ee83]{z-index:9999999;position:fixed;left:0;top:0;width:100vw!important;height:100vh!important}.player-wrap .Player[data-v-39e7ee83]{position:relative;z-index:1;width:100%;height:100%}.player-wrap .Player .player-video-poster[data-v-39e7ee83]{position:absolute;height:100%;width:100%;top:0;left:0}.player-wrap .Player .player-video-poster img[data-v-39e7ee83]{display:block;width:100%;height:100%;object-fit:cover}.player-wrap .Player .Player-video[data-v-39e7ee83]{width:100%;height:100%;transition:.2s}.player-wrap .Player .Player-video.video-mirror[data-v-39e7ee83]{transform:rotateY(180deg)}.player-wrap .player-control[data-v-39e7ee83]{transition:.1s;transform:translateY(45px);position:absolute;z-index:2;left:0;bottom:0;height:56px;width:100%;color:#fff}.player-wrap .player-control .control-progress[data-v-39e7ee83]{width:100%;position:relative;height:10px;cursor:pointer}.player-wrap .player-control .control-progress .progress-bar[data-v-39e7ee83]{position:absolute;left:0;right:0;bottom:0;width:100%;transition:height .1s;height:3px;z-index:1}.player-wrap .player-control .control-progress .progress-bar[data-v-39e7ee83] .progress__runway{transition:height .1s;height:100%}.player-wrap .player-control .control-progress .progress-bar[data-v-39e7ee83] .progress__runway .progress__bar:before{transform:translateY(-50%) scale(0)}.player-wrap .player-control .control-progress:hover .progress-bar[data-v-39e7ee83]{height:100%}.player-wrap .player-control .control-progress:hover .progress-bar[data-v-39e7ee83] .progress__bar:before{transform:translateY(-50%) scale(1)!important}.player-wrap .player-control .control-tool[data-v-39e7ee83]{position:absolute;padding:0 10px;background:#000c;display:flex;justify-content:space-between;align-items:center;top:10px;left:0;bottom:0;width:100%;box-sizing:border-box}.player-wrap .player-control .control-tool .tool-bar[data-v-39e7ee83]{display:flex;height:100%}.player-wrap .player-control .control-tool .tool-bar .speed[data-v-39e7ee83]{opacity:.9}.player-wrap .player-control .control-tool .tool-bar .speed[data-v-39e7ee83]:hover{opacity:1;font-weight:700}.player-wrap .player-control .control-tool .tool-bar .tool-item[data-v-39e7ee83]{position:relative;height:100%;cursor:pointer;text-align:center;padding:0 8px;display:flex;align-items:center;font-size:13px}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main[data-v-39e7ee83]{position:absolute;white-space:nowrap;z-index:2;bottom:90%;left:50%;padding:6px 16px;box-sizing:border-box;display:none;background:#000000f2;border-radius:5px;transform:translate(-50%)}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main[data-v-39e7ee83]:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:rgba(0,0,0,.95) transparent transparent transparent}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main[data-v-39e7ee83]{padding:0 10px}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main li[data-v-39e7ee83]{cursor:pointer;line-height:34px;font-size:12px;color:#fff}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main li[data-v-39e7ee83]:hover{opacity:.8}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main li.speed-active[data-v-39e7ee83]{color:rgba(var(--primary-color),1);font-weight:700}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box[data-v-39e7ee83]{height:160px;width:50px;align-items:center;justify-content:center}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box .volume-main[data-v-39e7ee83]{height:90%;display:flex;width:60px;flex-direction:column;align-items:center}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box .volume-main .volume-text-size[data-v-39e7ee83]{margin-bottom:10px;font-size:12px;font-weight:400}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box .volume-main.is-muted[data-v-39e7ee83] .progress__bar{height:0!important}.player-wrap .player-control .control-tool .tool-bar .tool-item:hover .tool-item-main[data-v-39e7ee83]{display:flex}.player-wrap .player-control .control-tool .tool-time[data-v-39e7ee83]{font-size:12px;color:#fff;font-weight:300}.player-wrap .player-control .control-tool .tool-time .total-time[data-v-39e7ee83]{color:#fffc}.player-wrap.player-wrap-hover .player-control[data-v-39e7ee83]{transform:translateY(0)}.player-state[data-v-39e7ee83],.player-input[data-v-39e7ee83]{position:absolute;left:0;top:0;right:0;bottom:40px;display:flex;justify-content:center;align-items:center;overflow:hidden;z-index:1}.player-input[data-v-39e7ee83]{width:100%;border:none;opacity:0;cursor:default}.play-btn[data-v-39e7ee83]{width:90px;height:90px;color:#fff;display:flex;align-items:center;justify-content:center;background-color:#000000b3;border-radius:50%;position:absolute;cursor:pointer}.play-btn.play-btn-center[data-v-39e7ee83]{top:50%;left:50%}.play-btn.play-btn-bottom-right[data-v-39e7ee83]{bottom:80px;right:20px}.play-btn.play-btn-bottom-left[data-v-39e7ee83]{bottom:80px;left:20px}.play-btn[data-v-39e7ee83]:hover{background-color:#000000d9;transition:background-color .3s ease}.play-btn[data-v-39e7ee83] svg{transition:transform .3s ease}.play-btn[data-v-39e7ee83]:hover svg{transform:scale(1.05)}@keyframes playBtnPulse-39e7ee83{0%,to{box-shadow:0 0 #fff6}50%{box-shadow:0 0 0 20px #fff0}}.player-lightoff[data-v-39e7ee83]{position:fixed;left:0;top:0;width:100vw;height:100vh;background-color:#000000e6}.is-lightoff[data-v-39e7ee83]{z-index:999998}.player-wrap[data-v-39e7ee83]{--primary-color: var(--5263cb62);width:var(--8126e950);height:var(--1455e5d5);max-width:100%;border-radius:var(--16502d47);overflow:hidden}.player-status-indicator[data-v-39e7ee83]{position:absolute;z-index:10;pointer-events:none;top:10px;left:10px}.player-status-indicator.status-position-top-left[data-v-39e7ee83]{top:10px;left:10px;right:auto;bottom:auto}.player-status-indicator.status-position-top-left .status-badge[data-v-39e7ee83]{animation:slideInLeft-39e7ee83 .3s ease-out}.player-status-indicator.status-position-top-right[data-v-39e7ee83]{top:10px;right:10px;left:auto;bottom:auto}.player-status-indicator.status-position-top-right .status-badge[data-v-39e7ee83]{animation:slideInRight-39e7ee83 .3s ease-out}.player-status-indicator.status-position-bottom-left[data-v-39e7ee83]{bottom:60px;left:10px;top:auto;right:auto}.player-status-indicator.status-position-bottom-left .status-badge[data-v-39e7ee83]{animation:slideInLeft-39e7ee83 .3s ease-out}.player-status-indicator.status-position-bottom-right[data-v-39e7ee83]{bottom:60px;right:10px;top:auto;left:auto}.player-status-indicator.status-position-bottom-right .status-badge[data-v-39e7ee83]{animation:slideInRight-39e7ee83 .3s ease-out}.player-status-indicator .status-badge[data-v-39e7ee83]{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;color:#fff;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 2px 8px #0000004d;transition:all .3s ease;opacity:1}.player-status-indicator .status-badge.status-playing[data-v-39e7ee83]{background:#008000b3}.player-status-indicator .status-badge.status-paused[data-v-39e7ee83]{background:#ffa500b3}.player-status-indicator .status-badge.status-ended[data-v-39e7ee83]{background:#808080b3}@keyframes slideInLeft-39e7ee83{0%{transform:translate(-20px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInRight-39e7ee83{0%{transform:translate(20px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeIn-39e7ee83{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.icon[data-v-aca6a90d]{display:inline-block;cursor:pointer;overflow:hidden}
|
|
1
|
+
@import"//at.alicdn.com/t/c/font_4726673_pdcujlcxe7l.css";.icon[data-v-2680e372]{width:1em;height:1em;vertical-align:-.15em;fill:currentColor;overflow:hidden}.rotating[data-v-2680e372]{animation:rotating-2680e372 2s linear infinite}@keyframes rotating-2680e372{to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.cc[data-v-2680e372]{background-color:red}ul[data-v-4b3e3899],ol[data-v-4b3e3899]{list-style:none;padding-left:0;margin-left:0}li[data-v-4b3e3899]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-4b3e3899]:before,li[data-v-4b3e3899]::marker{display:none!important;content:none!important}.iconfont[data-v-4b3e3899]{display:inline-block}.d-flex-x[data-v-4b3e3899],.d-flex-y[data-v-4b3e3899],.flex-center[data-v-4b3e3899]{display:flex}.d-flex-x[data-v-4b3e3899]{align-items:center}.d-flex-y[data-v-4b3e3899]{justify-content:center}.flex-center[data-v-4b3e3899]{justify-content:center;align-items:center}.mr5[data-v-4b3e3899]{margin-right:5px}.mr10[data-v-4b3e3899]{margin-right:10px}.ml5[data-v-4b3e3899]{margin-left:5px}.ml10[data-v-4b3e3899]{margin-left:10px}.d-pointer[data-v-4b3e3899]{cursor:pointer}@keyframes rotating-4b3e3899{to{-webkit-transform:rotate(360deg)}}.rotating[data-v-4b3e3899]{animation:rotating-4b3e3899 2s linear infinite}@keyframes showAni-4b3e3899{0%{display:none}50%{display:block}to{display:none}}.showH[data-v-4b3e3899]:hover{-webkit-animation:showAni-4b3e3899 .5s;animation:showAni-4b3e3899 .5s}@keyframes biggerAni-4b3e3899{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.biggerAni[data-v-4b3e3899]:hover{-webkit-animation:biggerAni-4b3e3899 .5s;animation:biggerAni-4b3e3899 .5s}@keyframes biggerScaleAni-4b3e3899{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}}.biggerScaleAni[data-v-4b3e3899]:hover{-webkit-animation:biggerScaleAni-4b3e3899 .5s;animation:biggerScaleAni-4b3e3899 .5s}@keyframes ScaleAni-4b3e3899{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}to{-webkit-transform:rotate(90deg)}}.ScaleAni[data-v-4b3e3899]:hover{-webkit-animation:ScaleAni-4b3e3899 .5s linear infinite;animation:ScaleAni-4b3e3899 .5s linear infinite}@keyframes playBtnPulse-4b3e3899{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes svgWave-4b3e3899{0%,to{y1:7;y2:13;opacity:.6}50%{y1:3;y2:17;opacity:1}}.rotateHover[data-v-4b3e3899]{transition:.2s}.rotateHover[data-v-4b3e3899]:hover{transform:rotate(90deg)}.scaleHover[data-v-4b3e3899]{transition:.2s}.scaleHover[data-v-4b3e3899]:hover{transform:scale(1.2)}.control-icon-hover[data-v-4b3e3899]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover[data-v-4b3e3899]:hover{transform:scale(1.09)}.control-icon-hover-large[data-v-4b3e3899]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover-large[data-v-4b3e3899]:hover{transform:scale(1.25)}.fade-in-enter-active[data-v-4b3e3899],.fade-in-leave-active[data-v-4b3e3899]{transition:.5s}.fade-in-enter-from[data-v-4b3e3899],.fade-in-leave-to[data-v-4b3e3899]{opacity:0}.play-btn-center.scale-out-enter-active[data-v-4b3e3899]{animation:scaleOutEnter-4b3e3899 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-center.scale-out-leave-active[data-v-4b3e3899]{animation:scaleOutLeave-4b3e3899 .3s ease forwards}@keyframes scaleOutEnter-4b3e3899{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes scaleOutLeave-4b3e3899{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes scaleOutEnterBottom-4b3e3899{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scaleOutLeaveBottom-4b3e3899{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.play-btn-bottom-right.scale-out-enter-active[data-v-4b3e3899],.play-btn-bottom-left.scale-out-enter-active[data-v-4b3e3899]{animation:scaleOutEnterBottom-4b3e3899 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-bottom-right.scale-out-leave-active[data-v-4b3e3899],.play-btn-bottom-left.scale-out-leave-active[data-v-4b3e3899]{animation:scaleOutLeaveBottom-4b3e3899 .3s ease forwards}.play-btn-rotate-enter-active[data-v-4b3e3899],.play-btn-rotate-leave-active[data-v-4b3e3899]{transition:all .3s ease}.play-btn-rotate-enter-from[data-v-4b3e3899]{opacity:0;transform:scale(.8) rotate(-90deg)}.play-btn-rotate-enter-to[data-v-4b3e3899],.play-btn-rotate-leave-from[data-v-4b3e3899]{opacity:1;transform:scale(1) rotate(0)}.play-btn-rotate-leave-to[data-v-4b3e3899]{opacity:0;transform:scale(.8) rotate(90deg)}.play-btn-scale-enter-active[data-v-4b3e3899],.play-btn-scale-leave-active[data-v-4b3e3899]{transition:all .25s cubic-bezier(.34,1.56,.64,1)}.play-btn-scale-enter-from[data-v-4b3e3899]{opacity:0;transform:scale(0)}.play-btn-scale-enter-to[data-v-4b3e3899],.play-btn-scale-leave-from[data-v-4b3e3899]{opacity:1;transform:scale(1)}.play-btn-scale-leave-to[data-v-4b3e3899]{opacity:0;transform:scale(0)}.play-btn-flip-enter-active[data-v-4b3e3899],.play-btn-flip-leave-active[data-v-4b3e3899]{transition:all .4s ease;transform-style:preserve-3d}.play-btn-flip-enter-from[data-v-4b3e3899]{opacity:0;transform:rotateY(-180deg)}.play-btn-flip-enter-to[data-v-4b3e3899],.play-btn-flip-leave-from[data-v-4b3e3899]{opacity:1;transform:rotateY(0)}.play-btn-flip-leave-to[data-v-4b3e3899]{opacity:0;transform:rotateY(180deg)}.play-btn-slide-enter-active[data-v-4b3e3899],.play-btn-slide-leave-active[data-v-4b3e3899]{transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.play-btn-slide-enter-from[data-v-4b3e3899]{opacity:0;transform:translate(-20px)}.play-btn-slide-enter-to[data-v-4b3e3899],.play-btn-slide-leave-from[data-v-4b3e3899]{opacity:1;transform:translate(0)}.play-btn-slide-leave-to[data-v-4b3e3899]{opacity:0;transform:translate(20px)}.play-pause-btn[data-v-4b3e3899]{position:relative;display:flex;align-items:center;justify-content:center}.play-pause-btn[data-v-4b3e3899]:hover svg{animation:playBtnPulse-4b3e3899 .6s ease-out}.volume-icon-svg[data-v-4b3e3899]{display:block;overflow:visible;opacity:.8;transition:opacity .3s ease}.volume-btn-wrapper[data-v-4b3e3899]{cursor:pointer;position:relative;display:flex;align-items:center;gap:4px}.volume-btn-wrapper:hover .volume-icon-svg[data-v-4b3e3899]{animation:volumeIconAni-4b3e3899 .5s}@keyframes volumeIconAni-4b3e3899{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.speaker-icon[data-v-4b3e3899]{transform-origin:center;transition:transform .3s ease}.sound-wave-svg[data-v-4b3e3899]{display:none;margin-left:2px}.volume-btn-wrapper:hover .sound-wave-svg[data-v-4b3e3899]{display:block}.wave-line[data-v-4b3e3899]{transform-origin:center;animation:svgWave-4b3e3899 .8s ease-in-out infinite}.wave-line.wave-1[data-v-4b3e3899]{animation-delay:0s}.wave-line.wave-2[data-v-4b3e3899]{animation-delay:.26s}.wave-line.wave-3[data-v-4b3e3899]{animation-delay:.52s}.play-control-btn[data-v-4b3e3899]{display:inline-block;transition:all .3s ease}.animation-rotate[data-v-4b3e3899]{animation:playBtnRotate-4b3e3899 .25s ease-in-out}@keyframes playBtnRotate-4b3e3899{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.95)}to{transform:rotate(90deg) scale(1)}}.animation-scale[data-v-4b3e3899]{animation:playBtnScale-4b3e3899 .3s ease}@keyframes playBtnScale-4b3e3899{0%{transform:scale(1)}50%{transform:scale(.8)}to{transform:scale(1)}}.animation-flip[data-v-4b3e3899]{animation:playBtnFlip-4b3e3899 .4s ease}@keyframes playBtnFlip-4b3e3899{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.animation-slide[data-v-4b3e3899]{animation:playBtnSlide-4b3e3899 .3s ease}@keyframes playBtnSlide-4b3e3899{0%{transform:translate(-10px);opacity:.5}to{transform:translate(0);opacity:1}}.animation-none[data-v-4b3e3899]{animation:none}.f50[data-v-4b3e3899]{font-size:50px}.f24[data-v-4b3e3899]{font-size:24px}.loading[data-v-4b3e3899]{position:absolute;left:0;right:0;bottom:0;top:0;display:flex;align-items:center;justify-content:center;background:#0000004d;z-index:2;color:#efefef;text-align:center;font-size:13px}.progress[data-v-f5b77156]{position:relative}.progress .progress__runway[data-v-f5b77156]{width:100%;height:var(--v49cbfd54);background-color:#333;position:relative;cursor:pointer;vertical-align:middle}.progress .progress__runway .progress__cursor[data-v-f5b77156],.progress .progress__runway .progress__preload[data-v-f5b77156],.progress .progress__runway .progress__bar[data-v-f5b77156]{position:absolute;top:0;left:0;height:100%}.progress .progress__runway .progress__cursor[data-v-f5b77156]{display:none;z-index:1;width:1px;background-color:#fff;pointer-events:none}.progress .progress__runway .progress__cursor .progress__tips[data-v-f5b77156]{pointer-events:none;color:#fff;position:absolute;white-space:nowrap;z-index:2;bottom:14px;left:50%;padding:4px;box-sizing:border-box;display:block;font-size:12px;background:#0009;border-radius:3px;transform:translate(-50%)}.progress .progress__runway:hover .progress__cursor[data-v-f5b77156]{display:block}.progress .progress__runway .progress__preload[data-v-f5b77156]{background:#717171}.progress .progress__runway .progress__bar[data-v-f5b77156]:before{display:block;content:"";position:absolute;right:-6px;top:50%;width:12px;height:12px;transition:.2s;transform:translateY(-50%) scale(1);border-radius:50%;background:#fff;box-shadow:0 0 0 5px #ffffff80}.progress.is-vertical[data-v-f5b77156]{height:100%;display:inline-block}.progress.is-vertical .progress__runway[data-v-f5b77156]{position:relative;height:100%;width:var(--v49cbfd54);margin:0 6px}.progress.is-vertical .progress__runway .progress__preload[data-v-f5b77156],.progress.is-vertical .progress__runway .progress__bar[data-v-f5b77156],.progress.is-vertical .progress__runway .progress__cursor[data-v-f5b77156]{bottom:0;top:auto;width:100%}.progress.is-vertical .progress__runway .progress__cursor[data-v-f5b77156]{height:1px}.progress.is-vertical .progress__runway .progress__bar[data-v-f5b77156]:before{top:-6px;left:50%;width:12px;height:12px;transform:translate(-50%) scale(1)}.switch[data-v-4ddca1e1]{position:relative;height:18px;width:var(--v8eab8736);background:#757575;border-radius:10px;display:inline-flex;align-items:center;vertical-align:middle}.switch .switch_input[data-v-4ddca1e1]{position:relative;z-index:1;margin:0;width:100%;height:100%;opacity:0}.switch .switch_action[data-v-4ddca1e1]{position:absolute;transition:.2s;left:2px;top:2px;z-index:0;height:14px;width:14px;background:#fff;border-radius:50%}.switch.is-checked[data-v-4ddca1e1]{background-color:var(--v7a1ce148)}.switch.is-checked .switch_action[data-v-4ddca1e1]{background:#fff;left:24px}ul[data-v-0b21d222],ol[data-v-0b21d222]{list-style:none;padding-left:0;margin-left:0}li[data-v-0b21d222]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-0b21d222]:before,li[data-v-0b21d222]::marker{display:none!important;content:none!important}.iconfont[data-v-0b21d222]{display:inline-block}.d-flex-x[data-v-0b21d222],.d-flex-y[data-v-0b21d222],.flex-center[data-v-0b21d222]{display:flex}.d-flex-x[data-v-0b21d222]{align-items:center}.d-flex-y[data-v-0b21d222]{justify-content:center}.flex-center[data-v-0b21d222]{justify-content:center;align-items:center}.mr5[data-v-0b21d222]{margin-right:5px}.mr10[data-v-0b21d222]{margin-right:10px}.ml5[data-v-0b21d222]{margin-left:5px}.ml10[data-v-0b21d222]{margin-left:10px}.d-pointer[data-v-0b21d222]{cursor:pointer}.status[data-v-0b21d222]{text-align:center;font-size:14px;vertical-align:middle;background:#000c;padding:0 8px;height:30px;border-radius:5px;display:flex;align-items:center;color:#fffffff2}.status .status-icon[data-v-0b21d222]{width:24px!important;display:inline-block;margin-right:5px}ul[data-v-e4530a65],ol[data-v-e4530a65]{list-style:none;padding-left:0;margin-left:0}li[data-v-e4530a65]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-e4530a65]:before,li[data-v-e4530a65]::marker{display:none!important;content:none!important}.iconfont[data-v-e4530a65]{display:inline-block}.d-flex-x[data-v-e4530a65],.d-flex-y[data-v-e4530a65],.flex-center[data-v-e4530a65]{display:flex}.d-flex-x[data-v-e4530a65]{align-items:center}.d-flex-y[data-v-e4530a65]{justify-content:center}.flex-center[data-v-e4530a65]{justify-content:center;align-items:center}.mr5[data-v-e4530a65]{margin-right:5px}.mr10[data-v-e4530a65]{margin-right:10px}.ml5[data-v-e4530a65]{margin-left:5px}.ml10[data-v-e4530a65]{margin-left:10px}.d-pointer[data-v-e4530a65]{cursor:pointer}@keyframes rotating-e4530a65{to{-webkit-transform:rotate(360deg)}}.rotating[data-v-e4530a65]{animation:rotating-e4530a65 2s linear infinite}@keyframes showAni-e4530a65{0%{display:none}50%{display:block}to{display:none}}.showH[data-v-e4530a65]:hover{-webkit-animation:showAni-e4530a65 .5s;animation:showAni-e4530a65 .5s}@keyframes biggerAni-e4530a65{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.biggerAni[data-v-e4530a65]:hover{-webkit-animation:biggerAni-e4530a65 .5s;animation:biggerAni-e4530a65 .5s}@keyframes biggerScaleAni-e4530a65{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}}.biggerScaleAni[data-v-e4530a65]:hover{-webkit-animation:biggerScaleAni-e4530a65 .5s;animation:biggerScaleAni-e4530a65 .5s}@keyframes ScaleAni-e4530a65{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}to{-webkit-transform:rotate(90deg)}}.ScaleAni[data-v-e4530a65]:hover{-webkit-animation:ScaleAni-e4530a65 .5s linear infinite;animation:ScaleAni-e4530a65 .5s linear infinite}@keyframes playBtnPulse-e4530a65{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes svgWave-e4530a65{0%,to{y1:7;y2:13;opacity:.6}50%{y1:3;y2:17;opacity:1}}.rotateHover[data-v-e4530a65]{transition:.2s}.rotateHover[data-v-e4530a65]:hover{transform:rotate(90deg)}.scaleHover[data-v-e4530a65]{transition:.2s}.scaleHover[data-v-e4530a65]:hover{transform:scale(1.2)}.control-icon-hover[data-v-e4530a65]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover[data-v-e4530a65]:hover{transform:scale(1.09)}.control-icon-hover-large[data-v-e4530a65]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover-large[data-v-e4530a65]:hover{transform:scale(1.25)}.fade-in-enter-active[data-v-e4530a65],.fade-in-leave-active[data-v-e4530a65]{transition:.5s}.fade-in-enter-from[data-v-e4530a65],.fade-in-leave-to[data-v-e4530a65]{opacity:0}.play-btn-center.scale-out-enter-active[data-v-e4530a65]{animation:scaleOutEnter-e4530a65 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-center.scale-out-leave-active[data-v-e4530a65]{animation:scaleOutLeave-e4530a65 .3s ease forwards}@keyframes scaleOutEnter-e4530a65{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes scaleOutLeave-e4530a65{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes scaleOutEnterBottom-e4530a65{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scaleOutLeaveBottom-e4530a65{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.play-btn-bottom-right.scale-out-enter-active[data-v-e4530a65],.play-btn-bottom-left.scale-out-enter-active[data-v-e4530a65]{animation:scaleOutEnterBottom-e4530a65 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-bottom-right.scale-out-leave-active[data-v-e4530a65],.play-btn-bottom-left.scale-out-leave-active[data-v-e4530a65]{animation:scaleOutLeaveBottom-e4530a65 .3s ease forwards}.play-btn-rotate-enter-active[data-v-e4530a65],.play-btn-rotate-leave-active[data-v-e4530a65]{transition:all .3s ease}.play-btn-rotate-enter-from[data-v-e4530a65]{opacity:0;transform:scale(.8) rotate(-90deg)}.play-btn-rotate-enter-to[data-v-e4530a65],.play-btn-rotate-leave-from[data-v-e4530a65]{opacity:1;transform:scale(1) rotate(0)}.play-btn-rotate-leave-to[data-v-e4530a65]{opacity:0;transform:scale(.8) rotate(90deg)}.play-btn-scale-enter-active[data-v-e4530a65],.play-btn-scale-leave-active[data-v-e4530a65]{transition:all .25s cubic-bezier(.34,1.56,.64,1)}.play-btn-scale-enter-from[data-v-e4530a65]{opacity:0;transform:scale(0)}.play-btn-scale-enter-to[data-v-e4530a65],.play-btn-scale-leave-from[data-v-e4530a65]{opacity:1;transform:scale(1)}.play-btn-scale-leave-to[data-v-e4530a65]{opacity:0;transform:scale(0)}.play-btn-flip-enter-active[data-v-e4530a65],.play-btn-flip-leave-active[data-v-e4530a65]{transition:all .4s ease;transform-style:preserve-3d}.play-btn-flip-enter-from[data-v-e4530a65]{opacity:0;transform:rotateY(-180deg)}.play-btn-flip-enter-to[data-v-e4530a65],.play-btn-flip-leave-from[data-v-e4530a65]{opacity:1;transform:rotateY(0)}.play-btn-flip-leave-to[data-v-e4530a65]{opacity:0;transform:rotateY(180deg)}.play-btn-slide-enter-active[data-v-e4530a65],.play-btn-slide-leave-active[data-v-e4530a65]{transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.play-btn-slide-enter-from[data-v-e4530a65]{opacity:0;transform:translate(-20px)}.play-btn-slide-enter-to[data-v-e4530a65],.play-btn-slide-leave-from[data-v-e4530a65]{opacity:1;transform:translate(0)}.play-btn-slide-leave-to[data-v-e4530a65]{opacity:0;transform:translate(20px)}.play-pause-btn[data-v-e4530a65]{position:relative;display:flex;align-items:center;justify-content:center}.play-pause-btn[data-v-e4530a65]:hover svg{animation:playBtnPulse-e4530a65 .6s ease-out}.volume-icon-svg[data-v-e4530a65]{display:block;overflow:visible;opacity:.8;transition:opacity .3s ease}.volume-btn-wrapper[data-v-e4530a65]{cursor:pointer;position:relative;display:flex;align-items:center;gap:4px}.volume-btn-wrapper:hover .volume-icon-svg[data-v-e4530a65]{animation:volumeIconAni-e4530a65 .5s}@keyframes volumeIconAni-e4530a65{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.speaker-icon[data-v-e4530a65]{transform-origin:center;transition:transform .3s ease}.sound-wave-svg[data-v-e4530a65]{display:none;margin-left:2px}.volume-btn-wrapper:hover .sound-wave-svg[data-v-e4530a65]{display:block}.wave-line[data-v-e4530a65]{transform-origin:center;animation:svgWave-e4530a65 .8s ease-in-out infinite}.wave-line.wave-1[data-v-e4530a65]{animation-delay:0s}.wave-line.wave-2[data-v-e4530a65]{animation-delay:.26s}.wave-line.wave-3[data-v-e4530a65]{animation-delay:.52s}.play-control-btn[data-v-e4530a65]{display:inline-block;transition:all .3s ease}.animation-rotate[data-v-e4530a65]{animation:playBtnRotate-e4530a65 .25s ease-in-out}@keyframes playBtnRotate-e4530a65{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.95)}to{transform:rotate(90deg) scale(1)}}.animation-scale[data-v-e4530a65]{animation:playBtnScale-e4530a65 .3s ease}@keyframes playBtnScale-e4530a65{0%{transform:scale(1)}50%{transform:scale(.8)}to{transform:scale(1)}}.animation-flip[data-v-e4530a65]{animation:playBtnFlip-e4530a65 .4s ease}@keyframes playBtnFlip-e4530a65{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.animation-slide[data-v-e4530a65]{animation:playBtnSlide-e4530a65 .3s ease}@keyframes playBtnSlide-e4530a65{0%{transform:translate(-10px);opacity:.5}to{transform:translate(0);opacity:1}}.animation-none[data-v-e4530a65]{animation:none}.player-contextmenu[data-v-e4530a65]{position:absolute;left:0;top:0;z-index:50;-webkit-user-select:none;user-select:none}.player-contextmenu .player-contextmenu-body[data-v-e4530a65]{position:relative;border-radius:6px;font-size:13px;background:#000000d9;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 4px 16px #0000004d;color:#efefef;padding:6px 0;text-align:left;box-sizing:border-box;overflow:hidden}.player-contextmenu .player-contextmenu-body .contextmenu-divider[data-v-e4530a65]{height:1px;margin:6px 0;background-color:#ffffff1a;pointer-events:none}.player-contextmenu .player-contextmenu-body .contextmenu-item[data-v-e4530a65]{display:flex;align-items:center;padding:10px 16px;margin:0;cursor:pointer;transition:all .2s ease;position:relative}.player-contextmenu .player-contextmenu-body .contextmenu-item[data-v-e4530a65]:hover:not(.contextmenu-item-disabled):not(.contextmenu-item-info){background-color:#808080e6}.player-contextmenu .player-contextmenu-body .contextmenu-item.contextmenu-item-disabled[data-v-e4530a65]{opacity:.5;cursor:not-allowed}.player-contextmenu .player-contextmenu-body .contextmenu-item.contextmenu-item-info[data-v-e4530a65]{cursor:default;opacity:.7}.player-contextmenu .player-contextmenu-body .contextmenu-item .contextmenu-item-icon[data-v-e4530a65]{margin-right:10px;display:flex;align-items:center;opacity:.85}.player-contextmenu .player-contextmenu-body .contextmenu-item .contextmenu-item-label[data-v-e4530a65]{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-contextmenu .player-contextmenu-body .contextmenu-item .contextmenu-item-shortcut[data-v-e4530a65]{margin-left:16px;font-size:11px;opacity:.6;color:#aaa}.player-dialog[data-v-e4530a65]{position:absolute;left:0;top:0;bottom:50px;width:100%;z-index:100;display:flex;justify-content:center;align-items:center}.player-dialog .player-dialog-body[data-v-e4530a65]{background-color:#000000e6;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border-radius:8px;color:#fff;min-width:200px;padding:0 0 10px;box-shadow:0 4px 20px #00000080}.player-dialog .player-dialog-body .player-dialog-title[data-v-e4530a65]{position:relative;font-size:14px;font-weight:400;margin:0 0 10px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.15);text-align:center}.player-dialog .player-dialog-body .player-dialog-title .icon-close[data-v-e4530a65]{position:absolute;right:0;top:0;width:40px;height:40px;line-height:40px;text-align:center;cursor:pointer;transition:opacity .2s}.player-dialog .player-dialog-body .player-dialog-title .icon-close[data-v-e4530a65]:hover{opacity:.7}.player-dialog .player-dialog-body .player-hotkey-panel[data-v-e4530a65]{font-size:12px;color:#87ceeb;padding-right:40px}.player-dialog .player-dialog-body .player-hotkey-panel .player-hotkey-panel-item[data-v-e4530a65]{line-height:26px}.player-dialog .player-dialog-body .player-hotkey-panel .player-hotkey-panel-item span[data-v-e4530a65]{text-align:center;display:inline-block;width:120px}.player-dialog .player-dialog-body .player-hotkey-panel .player-hotkey-panel-item span[data-v-e4530a65]:nth-child(2){color:#fff;opacity:.9;width:160px}.player-dialog .player-dialog-body .player-info-panel[data-v-e4530a65]{font-size:12px;padding:0 20px;min-width:400px;max-width:500px;max-height:400px;overflow-y:auto}.player-dialog .player-dialog-body .player-info-panel[data-v-e4530a65]::-webkit-scrollbar{width:6px}.player-dialog .player-dialog-body .player-info-panel[data-v-e4530a65]::-webkit-scrollbar-track{background:#ffffff0d;border-radius:3px}.player-dialog .player-dialog-body .player-info-panel[data-v-e4530a65]::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}.player-dialog .player-dialog-body .player-info-panel[data-v-e4530a65]::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.player-dialog .player-dialog-body .player-info-panel .player-info-panel-item[data-v-e4530a65]{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.1);transition:all .2s ease}.player-dialog .player-dialog-body .player-info-panel .player-info-panel-item[data-v-e4530a65]:last-child{border-bottom:none}.player-dialog .player-dialog-body .player-info-panel .player-info-panel-item[data-v-e4530a65]:hover{background-color:#ffffff0d;padding-left:8px;padding-right:8px;border-radius:4px}.player-dialog .player-dialog-body .player-info-panel .player-info-panel-item .info-label[data-v-e4530a65]{color:#aaa;min-width:80px;font-weight:500;flex-shrink:0}.player-dialog .player-dialog-body .player-info-panel .player-info-panel-item .info-value[data-v-e4530a65]{color:#fff;flex:1;text-align:right;word-break:break-all;opacity:.9;transition:opacity .2s ease}.player-dialog .player-dialog-body .player-info-panel .player-info-panel-item:hover .info-value[data-v-e4530a65]{opacity:1}.player-dialog .player-dialog-body .player-filter-panel[data-v-e4530a65]{width:320px;padding:0 20px}.player-dialog .player-dialog-body .player-filter-panel .player-filter-reset[data-v-e4530a65]{cursor:pointer;margin-top:10px;padding:4px 20px;display:inline-block;border-radius:3px;font-size:12px;background:#85858580;transition:background .2s}.player-dialog .player-dialog-body .player-filter-panel .player-filter-reset[data-v-e4530a65]:hover{background:#ffffff4d}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item[data-v-e4530a65]{height:32px;display:flex;align-items:center}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item .filter-panel-progress[data-v-e4530a65]{width:100%}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item .filter-panel-progress[data-v-e4530a65] .progress__runway{background-color:#999}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item .filter-panel-progress[data-v-e4530a65] .progress__runway .progress__bar:before{width:8px;height:8px;box-shadow:0 0 0 5px #ffffff80}.player-dialog .player-dialog-body .player-filter-panel .player-filter-panel-item span[data-v-e4530a65]{font-size:12px;display:block;width:80px;text-align:center}.settings-icon-svg[data-v-1ea78c7a]{display:block;overflow:visible;cursor:pointer;opacity:.8;transition:opacity .3s ease}.settings-gear-outer[data-v-1ea78c7a]{transform-origin:center;transform:rotate(0) scale(1)}.settings-gear-inner[data-v-1ea78c7a]{transform-origin:center}.setting-btn:hover .settings-icon-svg{animation:settingsIconAni .5s}@keyframes settingsIconAni{0%{opacity:1}50%{opacity:.8}to{opacity:1}}.setting-btn:hover .settings-icon-svg .settings-gear-outer{animation:settingsMatrixAnimation .5s ease-in-out forwards}@keyframes settingsMatrixAnimation{0%{transform:scale(1)}50%{transform:matrix(0,1.3,-1.3,0,0,0)}75%{transform:matrix(-1.065,.746,-.746,-1.065,0,0)}to{transform:scale(-1)}}.volume-icon-svg[data-v-db2cc5fc]{display:block;overflow:visible;opacity:1;transition:opacity .3s ease}.speaker-icon[data-v-db2cc5fc]{transform-origin:center;opacity:1;transition:transform .3s ease}.sound-waves[data-v-db2cc5fc]{opacity:1}.sound-wave[data-v-db2cc5fc]{transform-origin:center;opacity:1}.volume-btn-wrapper:hover .volume-icon-svg{animation:volumeIconAni .5s}@keyframes volumeIconAni{0%{opacity:1}50%{opacity:.8}to{opacity:1}}.volume-btn-wrapper:hover .volume-icon-svg .sound-wave.wave-outer{animation:volumeIconWaveRipple .6s ease-out 2}.volume-btn-wrapper:hover .volume-icon-svg .sound-waves:not(:has(.wave-outer)) .sound-wave.wave-inner{animation:volumeIconWaveRipple .6s ease-out 2}.volume-btn-wrapper:hover .volume-icon-svg .speaker-icon{animation:volumeIconSpeakerScale .6s ease-out .01s}@keyframes volumeIconWaveRipple{0%{opacity:0;transform:scale(.7)}20%{opacity:1;transform:scale(.9)}45%{opacity:1;transform:scale(1.1)}70%{opacity:.6;transform:scale(1.3)}to{opacity:0;transform:scale(1.5)}}@keyframes volumeIconSpeakerScale{0%{transform:scale(1)}40%{transform:scale(1.3)}80%{transform:scale(1)}to{transform:scale(1)}}.player-quality-selector[data-v-4969cc14]{position:relative;display:inline-block}.player-quality-selector .quality-button[data-v-4969cc14]{display:flex;align-items:center;gap:4px;padding:6px 12px;background:#00000080;border:none;border-radius:4px;color:#fff;cursor:pointer;transition:all .2s;font-size:13px}.player-quality-selector .quality-button[data-v-4969cc14]:hover{background:#000000b3}.player-quality-selector .quality-button .quality-label[data-v-4969cc14]{font-weight:500;-webkit-user-select:none;user-select:none}.player-quality-selector .quality-button .quality-icon[data-v-4969cc14]{transition:transform .2s;fill:currentColor}.player-quality-selector .quality-menu[data-v-4969cc14]{position:absolute;bottom:calc(100% + 8px);right:0;background:#1c1c1ef2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-radius:8px;min-width:140px;box-shadow:0 4px 16px #0006;overflow:hidden;list-style:none;margin:0;padding:4px 0;z-index:1000}.player-quality-selector .quality-menu .quality-option[data-v-4969cc14]{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;color:#ffffffe6;font-size:14px;cursor:pointer;transition:all .2s;-webkit-user-select:none;user-select:none}.player-quality-selector .quality-menu .quality-option[data-v-4969cc14]:hover{background:#ffffff1a}.player-quality-selector .quality-menu .quality-option.active[data-v-4969cc14]{background:#52a0fd26;color:#52a0fd}.player-quality-selector .quality-menu .quality-option.active .option-label[data-v-4969cc14]{font-weight:600}.player-quality-selector .quality-menu .quality-option .option-label[data-v-4969cc14]{flex:1}.player-quality-selector .quality-menu .quality-option .option-meta[data-v-4969cc14]{display:flex;align-items:center;gap:8px;font-size:12px}.player-quality-selector .quality-menu .quality-option .auto-badge[data-v-4969cc14]{padding:2px 6px;background:#52a0fd33;color:#52a0fd;border-radius:3px;font-size:11px;font-weight:600}.player-quality-selector .quality-menu .quality-option .bitrate[data-v-4969cc14]{color:#ffffff80;font-size:11px}.player-quality-selector .quality-menu .quality-option .check-icon[data-v-4969cc14]{color:#52a0fd;font-weight:700;font-size:16px}.slide-up-enter-active[data-v-4969cc14],.slide-up-leave-active[data-v-4969cc14]{transition:all .2s ease}.slide-up-enter-from[data-v-4969cc14],.slide-up-leave-to[data-v-4969cc14]{opacity:0;transform:translateY(8px)}.slide-up-enter-to[data-v-4969cc14],.slide-up-leave-from[data-v-4969cc14]{opacity:1;transform:translateY(0)}.live-badge-container[data-v-fafdd369]{position:absolute;top:16px;left:16px;z-index:10;display:flex;flex-direction:column;gap:12px;pointer-events:none}.live-badge-container[data-v-fafdd369]>*{pointer-events:auto}.live-badge[data-v-fafdd369]{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#ef4444f2;color:#fff;font-size:13px;font-weight:600;border-radius:4px;box-shadow:0 2px 8px #ef444466;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.live-badge[data-v-fafdd369]:hover{background:#ef4444;box-shadow:0 4px 12px #ef444480}.live-badge-pulse[data-v-fafdd369]{animation:pulse-fafdd369 2s ease-in-out infinite}@keyframes pulse-fafdd369{0%,to{box-shadow:0 2px 8px #ef444466}50%{box-shadow:0 4px 16px #ef4444cc}}.live-dot[data-v-fafdd369]{width:8px;height:8px;background:#fff;border-radius:50%;animation:blink-fafdd369 1.5s ease-in-out infinite}@keyframes blink-fafdd369{0%,to{opacity:1}50%{opacity:.3}}.live-text[data-v-fafdd369]{line-height:1;text-transform:uppercase;letter-spacing:.5px}.go-to-live-btn[data-v-fafdd369]{display:inline-flex;align-items:center;gap:8px;padding:8px 16px;background:#2563ebf2;color:#fff;font-size:13px;font-weight:500;border:none;border-radius:20px;cursor:pointer;box-shadow:0 2px 8px #2563eb4d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s ease}.go-to-live-btn[data-v-fafdd369]:hover{background:#2563eb;box-shadow:0 4px 12px #2563eb80;transform:translateY(-2px)}.go-to-live-btn[data-v-fafdd369]:active{transform:translateY(0)}.live-icon[data-v-fafdd369]{width:16px;height:16px;stroke-width:2.5}.slide-fade-enter-active[data-v-fafdd369]{transition:all .3s ease-out}.slide-fade-leave-active[data-v-fafdd369]{transition:all .3s cubic-bezier(1,.5,.8,1)}.slide-fade-enter-from[data-v-fafdd369],.slide-fade-leave-to[data-v-fafdd369]{transform:translate(-20px);opacity:0}@media (max-width: 768px){.live-badge-container[data-v-fafdd369]{top:12px;left:12px;gap:10px}.live-badge[data-v-fafdd369]{padding:5px 10px;font-size:12px}.live-dot[data-v-fafdd369]{width:6px;height:6px}.go-to-live-btn[data-v-fafdd369]{padding:6px 12px;font-size:12px;border-radius:16px}.live-icon[data-v-fafdd369]{width:14px;height:14px}}@media (prefers-color-scheme: dark){.live-badge[data-v-fafdd369]{box-shadow:0 2px 12px #ef444499}.go-to-live-btn[data-v-fafdd369]{box-shadow:0 2px 12px #2563eb80}}@keyframes rotating-34fe5655{to{-webkit-transform:rotate(360deg)}}.rotating[data-v-34fe5655]{animation:rotating-34fe5655 2s linear infinite}@keyframes showAni-34fe5655{0%{display:none}50%{display:block}to{display:none}}.showH[data-v-34fe5655]:hover{-webkit-animation:showAni-34fe5655 .5s;animation:showAni-34fe5655 .5s}@keyframes biggerAni-34fe5655{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1);opacity:.8}}.biggerAni[data-v-34fe5655]:hover{-webkit-animation:biggerAni-34fe5655 .5s;animation:biggerAni-34fe5655 .5s}@keyframes biggerScaleAni-34fe5655{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}}.biggerScaleAni[data-v-34fe5655]:hover{-webkit-animation:biggerScaleAni-34fe5655 .5s;animation:biggerScaleAni-34fe5655 .5s}@keyframes ScaleAni-34fe5655{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.2);opacity:1}to{transform:scale(1) rotate(90deg);opacity:.8}to{-webkit-transform:rotate(90deg)}}.ScaleAni[data-v-34fe5655]:hover{-webkit-animation:ScaleAni-34fe5655 .5s linear infinite;animation:ScaleAni-34fe5655 .5s linear infinite}@keyframes playBtnPulse-34fe5655{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes svgWave-34fe5655{0%,to{y1:7;y2:13;opacity:.6}50%{y1:3;y2:17;opacity:1}}.rotateHover[data-v-34fe5655]{transition:.2s}.rotateHover[data-v-34fe5655]:hover{transform:rotate(90deg)}.scaleHover[data-v-34fe5655]{transition:.2s}.scaleHover[data-v-34fe5655]:hover{transform:scale(1.2)}.control-icon-hover[data-v-34fe5655]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover[data-v-34fe5655]:hover{transform:scale(1.09)}.control-icon-hover-large[data-v-34fe5655]{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}.control-icon-hover-large[data-v-34fe5655]:hover{transform:scale(1.25)}.fade-in-enter-active[data-v-34fe5655],.fade-in-leave-active[data-v-34fe5655]{transition:.5s}.fade-in-enter-from[data-v-34fe5655],.fade-in-leave-to[data-v-34fe5655]{opacity:0}.play-btn-center.scale-out-enter-active[data-v-34fe5655]{animation:scaleOutEnter-34fe5655 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-center.scale-out-leave-active[data-v-34fe5655]{animation:scaleOutLeave-34fe5655 .3s ease forwards}@keyframes scaleOutEnter-34fe5655{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}to{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes scaleOutLeave-34fe5655{0%{transform:translate(-50%,-50%) scale(1);opacity:1}to{transform:translate(-50%,-50%) scale(1.6);opacity:0}}@keyframes scaleOutEnterBottom-34fe5655{0%{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes scaleOutLeaveBottom-34fe5655{0%{transform:scale(1);opacity:1}to{transform:scale(1.6);opacity:0}}.play-btn-bottom-right.scale-out-enter-active[data-v-34fe5655],.play-btn-bottom-left.scale-out-enter-active[data-v-34fe5655]{animation:scaleOutEnterBottom-34fe5655 .4s cubic-bezier(.34,1.56,.64,1) forwards}.play-btn-bottom-right.scale-out-leave-active[data-v-34fe5655],.play-btn-bottom-left.scale-out-leave-active[data-v-34fe5655]{animation:scaleOutLeaveBottom-34fe5655 .3s ease forwards}.play-btn-rotate-enter-active[data-v-34fe5655],.play-btn-rotate-leave-active[data-v-34fe5655]{transition:all .3s ease}.play-btn-rotate-enter-from[data-v-34fe5655]{opacity:0;transform:scale(.8) rotate(-90deg)}.play-btn-rotate-enter-to[data-v-34fe5655],.play-btn-rotate-leave-from[data-v-34fe5655]{opacity:1;transform:scale(1) rotate(0)}.play-btn-rotate-leave-to[data-v-34fe5655]{opacity:0;transform:scale(.8) rotate(90deg)}.play-btn-scale-enter-active[data-v-34fe5655],.play-btn-scale-leave-active[data-v-34fe5655]{transition:all .25s cubic-bezier(.34,1.56,.64,1)}.play-btn-scale-enter-from[data-v-34fe5655]{opacity:0;transform:scale(0)}.play-btn-scale-enter-to[data-v-34fe5655],.play-btn-scale-leave-from[data-v-34fe5655]{opacity:1;transform:scale(1)}.play-btn-scale-leave-to[data-v-34fe5655]{opacity:0;transform:scale(0)}.play-btn-flip-enter-active[data-v-34fe5655],.play-btn-flip-leave-active[data-v-34fe5655]{transition:all .4s ease;transform-style:preserve-3d}.play-btn-flip-enter-from[data-v-34fe5655]{opacity:0;transform:rotateY(-180deg)}.play-btn-flip-enter-to[data-v-34fe5655],.play-btn-flip-leave-from[data-v-34fe5655]{opacity:1;transform:rotateY(0)}.play-btn-flip-leave-to[data-v-34fe5655]{opacity:0;transform:rotateY(180deg)}.play-btn-slide-enter-active[data-v-34fe5655],.play-btn-slide-leave-active[data-v-34fe5655]{transition:all .3s cubic-bezier(.68,-.55,.265,1.55)}.play-btn-slide-enter-from[data-v-34fe5655]{opacity:0;transform:translate(-20px)}.play-btn-slide-enter-to[data-v-34fe5655],.play-btn-slide-leave-from[data-v-34fe5655]{opacity:1;transform:translate(0)}.play-btn-slide-leave-to[data-v-34fe5655]{opacity:0;transform:translate(20px)}.play-pause-btn[data-v-34fe5655]{position:relative;display:flex;align-items:center;justify-content:center}.play-pause-btn[data-v-34fe5655]:hover svg{animation:playBtnPulse-34fe5655 .6s ease-out}.volume-icon-svg[data-v-34fe5655]{display:block;overflow:visible;opacity:.8;transition:opacity .3s ease}.volume-btn-wrapper[data-v-34fe5655]{cursor:pointer;position:relative;display:flex;align-items:center;gap:4px}.volume-btn-wrapper:hover .volume-icon-svg[data-v-34fe5655]{animation:volumeIconAni-34fe5655 .5s}@keyframes volumeIconAni-34fe5655{0%{opacity:.8}50%{opacity:1}to{opacity:.8}}.speaker-icon[data-v-34fe5655]{transform-origin:center;transition:transform .3s ease}.sound-wave-svg[data-v-34fe5655]{display:none;margin-left:2px}.volume-btn-wrapper:hover .sound-wave-svg[data-v-34fe5655]{display:block}.wave-line[data-v-34fe5655]{transform-origin:center;animation:svgWave-34fe5655 .8s ease-in-out infinite}.wave-line.wave-1[data-v-34fe5655]{animation-delay:0s}.wave-line.wave-2[data-v-34fe5655]{animation-delay:.26s}.wave-line.wave-3[data-v-34fe5655]{animation-delay:.52s}.play-control-btn[data-v-34fe5655]{display:inline-block;transition:all .3s ease}.animation-rotate[data-v-34fe5655]{animation:playBtnRotate-34fe5655 .25s ease-in-out}@keyframes playBtnRotate-34fe5655{0%{transform:rotate(0) scale(1)}50%{transform:rotate(45deg) scale(.95)}to{transform:rotate(90deg) scale(1)}}.animation-scale[data-v-34fe5655]{animation:playBtnScale-34fe5655 .3s ease}@keyframes playBtnScale-34fe5655{0%{transform:scale(1)}50%{transform:scale(.8)}to{transform:scale(1)}}.animation-flip[data-v-34fe5655]{animation:playBtnFlip-34fe5655 .4s ease}@keyframes playBtnFlip-34fe5655{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.animation-slide[data-v-34fe5655]{animation:playBtnSlide-34fe5655 .3s ease}@keyframes playBtnSlide-34fe5655{0%{transform:translate(-10px);opacity:.5}to{transform:translate(0);opacity:1}}.animation-none[data-v-34fe5655]{animation:none}ul[data-v-34fe5655],ol[data-v-34fe5655]{list-style:none;padding-left:0;margin-left:0}li[data-v-34fe5655]{list-style:none!important;padding-left:0;margin-left:0}li[data-v-34fe5655]:before,li[data-v-34fe5655]::marker{display:none!important;content:none!important}.iconfont[data-v-34fe5655]{display:inline-block}.d-flex-x[data-v-34fe5655],.d-flex-y[data-v-34fe5655],.flex-center[data-v-34fe5655]{display:flex}.d-flex-x[data-v-34fe5655]{align-items:center}.d-flex-y[data-v-34fe5655]{justify-content:center}.flex-center[data-v-34fe5655]{justify-content:center;align-items:center}.mr5[data-v-34fe5655]{margin-right:5px}.mr10[data-v-34fe5655]{margin-right:10px}.ml5[data-v-34fe5655]{margin-left:5px}.ml10[data-v-34fe5655]{margin-left:10px}.d-pointer[data-v-34fe5655]{cursor:pointer}.player-wrap[data-v-34fe5655]{position:relative;overflow:hidden;background-color:#000}.player-wrap.web-full-screen[data-v-34fe5655]{z-index:9999999;position:fixed;left:0;top:0;width:100vw!important;height:100vh!important}.player-wrap .Player[data-v-34fe5655]{position:relative;z-index:1;width:100%;height:100%}.player-wrap .Player .player-video-poster[data-v-34fe5655]{position:absolute;height:100%;width:100%;top:0;left:0}.player-wrap .Player .player-video-poster img[data-v-34fe5655]{display:block;width:100%;height:100%;object-fit:cover}.player-wrap .Player .Player-video[data-v-34fe5655]{width:100%;height:100%;transition:.2s}.player-wrap .Player .Player-video.video-mirror[data-v-34fe5655]{transform:rotateY(180deg)}.player-wrap .player-control[data-v-34fe5655]{transition:.1s;transform:translateY(45px);position:absolute;z-index:2;left:0;bottom:0;height:56px;width:100%;color:#fff}.player-wrap .player-control .control-progress[data-v-34fe5655]{width:100%;position:relative;height:10px;cursor:pointer}.player-wrap .player-control .control-progress .progress-bar[data-v-34fe5655]{position:absolute;left:0;right:0;bottom:0;width:100%;transition:height .1s;height:3px;z-index:1}.player-wrap .player-control .control-progress .progress-bar[data-v-34fe5655] .progress__runway{transition:height .1s;height:100%}.player-wrap .player-control .control-progress .progress-bar[data-v-34fe5655] .progress__runway .progress__bar:before{transform:translateY(-50%) scale(0)}.player-wrap .player-control .control-progress:hover .progress-bar[data-v-34fe5655]{height:100%}.player-wrap .player-control .control-progress:hover .progress-bar[data-v-34fe5655] .progress__bar:before{transform:translateY(-50%) scale(1)!important}.player-wrap .player-control .control-tool[data-v-34fe5655]{position:absolute;padding:0 10px;background:#000c;display:flex;justify-content:space-between;align-items:center;top:10px;left:0;bottom:0;width:100%;box-sizing:border-box}.player-wrap .player-control .control-tool .tool-bar[data-v-34fe5655]{display:flex;height:100%}.player-wrap .player-control .control-tool .tool-bar .speed[data-v-34fe5655]{opacity:.9}.player-wrap .player-control .control-tool .tool-bar .speed[data-v-34fe5655]:hover{opacity:1;font-weight:700}.player-wrap .player-control .control-tool .tool-bar .tool-item[data-v-34fe5655]{position:relative;height:100%;cursor:pointer;text-align:center;padding:0 8px;display:flex;align-items:center;font-size:13px}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main[data-v-34fe5655]{position:absolute;white-space:nowrap;z-index:2;bottom:90%;left:50%;padding:6px 16px;box-sizing:border-box;display:none;background:#000000f2;border-radius:5px;transform:translate(-50%)}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main[data-v-34fe5655]:after{content:"";position:absolute;top:100%;left:50%;transform:translate(-50%);border-width:6px;border-style:solid;border-color:rgba(0,0,0,.95) transparent transparent transparent}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main[data-v-34fe5655]{padding:0 10px}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main li[data-v-34fe5655]{cursor:pointer;line-height:34px;font-size:12px;color:#fff}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main li[data-v-34fe5655]:hover{opacity:.8}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.speed-box .speed-main li.speed-active[data-v-34fe5655]{color:rgba(var(--primary-color),1);font-weight:700}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.quality-box .quality-main[data-v-34fe5655]{padding:0 10px}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.quality-box .quality-main li[data-v-34fe5655]{cursor:pointer;line-height:34px;font-size:12px;color:#fff;white-space:nowrap}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.quality-box .quality-main li[data-v-34fe5655]:hover{opacity:.8}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.quality-box .quality-main li.quality-active[data-v-34fe5655]{color:rgba(var(--primary-color),1);font-weight:700}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box[data-v-34fe5655]{height:160px;width:50px;align-items:center;justify-content:center}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box .volume-main[data-v-34fe5655]{height:90%;display:flex;width:60px;flex-direction:column;align-items:center}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box .volume-main .volume-text-size[data-v-34fe5655]{margin-bottom:10px;font-size:12px;font-weight:400}.player-wrap .player-control .control-tool .tool-bar .tool-item .tool-item-main.volume-box .volume-main.is-muted[data-v-34fe5655] .progress__bar{height:0!important}.player-wrap .player-control .control-tool .tool-bar .tool-item:hover .tool-item-main[data-v-34fe5655]{display:flex}.player-wrap .player-control .control-tool .tool-time[data-v-34fe5655]{font-size:12px;color:#fff;font-weight:300}.player-wrap .player-control .control-tool .tool-time .total-time[data-v-34fe5655]{color:#fffc}.player-wrap.player-wrap-hover .player-control[data-v-34fe5655]{transform:translateY(0)}.player-state[data-v-34fe5655],.player-input[data-v-34fe5655]{position:absolute;left:0;top:0;right:0;bottom:40px;display:flex;justify-content:center;align-items:center;overflow:hidden;z-index:1}.player-input[data-v-34fe5655]{width:100%;border:none;opacity:0;cursor:default}.play-btn[data-v-34fe5655]{width:90px;height:90px;color:#fff;display:flex;align-items:center;justify-content:center;background-color:#000000b3;border-radius:50%;position:absolute;cursor:pointer}.play-btn.play-btn-center[data-v-34fe5655]{top:50%;left:50%}.play-btn.play-btn-bottom-right[data-v-34fe5655]{bottom:80px;right:20px}.play-btn.play-btn-bottom-left[data-v-34fe5655]{bottom:80px;left:20px}.play-btn[data-v-34fe5655]:hover{background-color:#000000d9;transition:background-color .3s ease}.play-btn[data-v-34fe5655] svg{transition:transform .3s ease}.play-btn[data-v-34fe5655]:hover svg{transform:scale(1.05)}@keyframes playBtnPulse-34fe5655{0%,to{box-shadow:0 0 #fff6}50%{box-shadow:0 0 0 20px #fff0}}.player-lightoff[data-v-34fe5655]{position:fixed;left:0;top:0;width:100vw;height:100vh;background-color:#000000e6}.is-lightoff[data-v-34fe5655]{z-index:999998}.player-wrap[data-v-34fe5655]{--primary-color: var(--v541d79d0);width:var(--v52a55a74);height:var(--v35a3e7b2);max-width:100%;border-radius:var(--v7c42c196);overflow:hidden}.player-status-indicator[data-v-34fe5655]{position:absolute;z-index:10;pointer-events:none;top:10px;left:10px}.player-status-indicator.status-position-top-left[data-v-34fe5655]{top:10px;left:10px;right:auto;bottom:auto}.player-status-indicator.status-position-top-left .status-badge[data-v-34fe5655]{animation:slideInLeft-34fe5655 .3s ease-out}.player-status-indicator.status-position-top-right[data-v-34fe5655]{top:10px;right:10px;left:auto;bottom:auto}.player-status-indicator.status-position-top-right .status-badge[data-v-34fe5655]{animation:slideInRight-34fe5655 .3s ease-out}.player-status-indicator.status-position-bottom-left[data-v-34fe5655]{bottom:60px;left:10px;top:auto;right:auto}.player-status-indicator.status-position-bottom-left .status-badge[data-v-34fe5655]{animation:slideInLeft-34fe5655 .3s ease-out}.player-status-indicator.status-position-bottom-right[data-v-34fe5655]{bottom:60px;right:10px;top:auto;left:auto}.player-status-indicator.status-position-bottom-right .status-badge[data-v-34fe5655]{animation:slideInRight-34fe5655 .3s ease-out}.player-status-indicator .status-badge[data-v-34fe5655]{padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;color:#fff;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 2px 8px #0000004d;transition:all .3s ease;opacity:1}.player-status-indicator .status-badge.status-playing[data-v-34fe5655]{background:#008000b3}.player-status-indicator .status-badge.status-paused[data-v-34fe5655]{background:#ffa500b3}.player-status-indicator .status-badge.status-ended[data-v-34fe5655]{background:#808080b3}@keyframes slideInLeft-34fe5655{0%{transform:translate(-20px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInRight-34fe5655{0%{transform:translate(20px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes fadeIn-34fe5655{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.icon[data-v-0d1e04ea]{display:inline-block;cursor:pointer;overflow:hidden}
|
|
@@ -1,4 +1,6 @@
|
|
|
1
1
|
import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions, CreateComponentPublicInstanceWithMixins, ExtractPropTypes, PropType, GlobalComponents, GlobalDirectives } from 'vue';
|
|
2
|
+
import { QualityOption } from './package/config';
|
|
3
|
+
import { HlsConfig } from './package/types/hls';
|
|
2
4
|
declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {
|
|
3
5
|
video: CreateComponentPublicInstanceWithMixins<Readonly< ExtractPropTypes<{
|
|
4
6
|
width: {
|
|
@@ -58,6 +60,10 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
58
60
|
type: ArrayConstructor;
|
|
59
61
|
default: () => string[];
|
|
60
62
|
};
|
|
63
|
+
qualities: {
|
|
64
|
+
type: PropType<Array< QualityOption>>;
|
|
65
|
+
default: () => never[];
|
|
66
|
+
};
|
|
61
67
|
autoPlay: {
|
|
62
68
|
type: BooleanConstructor;
|
|
63
69
|
default: boolean;
|
|
@@ -143,11 +149,34 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
143
149
|
type: StringConstructor;
|
|
144
150
|
default: string;
|
|
145
151
|
};
|
|
152
|
+
menuConfig: {
|
|
153
|
+
type: ObjectConstructor;
|
|
154
|
+
default: () => {};
|
|
155
|
+
};
|
|
156
|
+
disableContextMenu: {
|
|
157
|
+
type: BooleanConstructor;
|
|
158
|
+
default: boolean;
|
|
159
|
+
};
|
|
160
|
+
hlsConfig: {
|
|
161
|
+
type: PropType<HlsConfig>;
|
|
162
|
+
default: () => {
|
|
163
|
+
enabled: boolean;
|
|
164
|
+
autoQuality: boolean;
|
|
165
|
+
lowLatencyMode: boolean;
|
|
166
|
+
maxBufferLength: number;
|
|
167
|
+
debug: boolean;
|
|
168
|
+
startLevel: number;
|
|
169
|
+
};
|
|
170
|
+
};
|
|
146
171
|
}>> & Readonly<{}>, {
|
|
147
172
|
play: () => Promise<void>;
|
|
148
173
|
pause: () => void;
|
|
149
174
|
togglePlay: (ev: Event) => void;
|
|
150
175
|
}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, PublicProps, {
|
|
176
|
+
speed: boolean;
|
|
177
|
+
loop: boolean;
|
|
178
|
+
mirror: boolean;
|
|
179
|
+
lightOff: boolean;
|
|
151
180
|
speedRate: unknown[];
|
|
152
181
|
volume: number;
|
|
153
182
|
muted: boolean;
|
|
@@ -160,15 +189,13 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
160
189
|
preload: string;
|
|
161
190
|
colorStart: string;
|
|
162
191
|
colorEnd: string;
|
|
192
|
+
menuConfig: Record<string, any>;
|
|
163
193
|
src: string;
|
|
164
194
|
poster: string;
|
|
165
195
|
webFullScreen: boolean;
|
|
166
|
-
speed: boolean;
|
|
167
196
|
playsinline: boolean;
|
|
197
|
+
qualities: QualityOption[];
|
|
168
198
|
autoPlay: boolean;
|
|
169
|
-
loop: boolean;
|
|
170
|
-
mirror: boolean;
|
|
171
|
-
lightOff: boolean;
|
|
172
199
|
control: boolean;
|
|
173
200
|
controlBtns: string[];
|
|
174
201
|
playBtnPosition: string;
|
|
@@ -177,6 +204,8 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
177
204
|
playRetryTimeout: number;
|
|
178
205
|
statusIndicator: Record<string, any>;
|
|
179
206
|
videoId: string;
|
|
207
|
+
disableContextMenu: boolean;
|
|
208
|
+
hlsConfig: HlsConfig;
|
|
180
209
|
}, true, {}, {}, GlobalComponents, GlobalDirectives, string, {
|
|
181
210
|
playerWrap: HTMLDivElement;
|
|
182
211
|
v: HTMLVideoElement;
|
|
@@ -247,6 +276,10 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
247
276
|
type: ArrayConstructor;
|
|
248
277
|
default: () => string[];
|
|
249
278
|
};
|
|
279
|
+
qualities: {
|
|
280
|
+
type: PropType<Array< QualityOption>>;
|
|
281
|
+
default: () => never[];
|
|
282
|
+
};
|
|
250
283
|
autoPlay: {
|
|
251
284
|
type: BooleanConstructor;
|
|
252
285
|
default: boolean;
|
|
@@ -332,11 +365,34 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
332
365
|
type: StringConstructor;
|
|
333
366
|
default: string;
|
|
334
367
|
};
|
|
368
|
+
menuConfig: {
|
|
369
|
+
type: ObjectConstructor;
|
|
370
|
+
default: () => {};
|
|
371
|
+
};
|
|
372
|
+
disableContextMenu: {
|
|
373
|
+
type: BooleanConstructor;
|
|
374
|
+
default: boolean;
|
|
375
|
+
};
|
|
376
|
+
hlsConfig: {
|
|
377
|
+
type: PropType<HlsConfig>;
|
|
378
|
+
default: () => {
|
|
379
|
+
enabled: boolean;
|
|
380
|
+
autoQuality: boolean;
|
|
381
|
+
lowLatencyMode: boolean;
|
|
382
|
+
maxBufferLength: number;
|
|
383
|
+
debug: boolean;
|
|
384
|
+
startLevel: number;
|
|
385
|
+
};
|
|
386
|
+
};
|
|
335
387
|
}>> & Readonly<{}>, {
|
|
336
388
|
play: () => Promise<void>;
|
|
337
389
|
pause: () => void;
|
|
338
390
|
togglePlay: (ev: Event) => void;
|
|
339
391
|
}, {}, {}, {}, {
|
|
392
|
+
speed: boolean;
|
|
393
|
+
loop: boolean;
|
|
394
|
+
mirror: boolean;
|
|
395
|
+
lightOff: boolean;
|
|
340
396
|
speedRate: unknown[];
|
|
341
397
|
volume: number;
|
|
342
398
|
muted: boolean;
|
|
@@ -349,15 +405,13 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
349
405
|
preload: string;
|
|
350
406
|
colorStart: string;
|
|
351
407
|
colorEnd: string;
|
|
408
|
+
menuConfig: Record<string, any>;
|
|
352
409
|
src: string;
|
|
353
410
|
poster: string;
|
|
354
411
|
webFullScreen: boolean;
|
|
355
|
-
speed: boolean;
|
|
356
412
|
playsinline: boolean;
|
|
413
|
+
qualities: QualityOption[];
|
|
357
414
|
autoPlay: boolean;
|
|
358
|
-
loop: boolean;
|
|
359
|
-
mirror: boolean;
|
|
360
|
-
lightOff: boolean;
|
|
361
415
|
control: boolean;
|
|
362
416
|
controlBtns: string[];
|
|
363
417
|
playBtnPosition: string;
|
|
@@ -366,6 +420,8 @@ declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixi
|
|
|
366
420
|
playRetryTimeout: number;
|
|
367
421
|
statusIndicator: Record<string, any>;
|
|
368
422
|
videoId: string;
|
|
423
|
+
disableContextMenu: boolean;
|
|
424
|
+
hlsConfig: HlsConfig;
|
|
369
425
|
}> | null;
|
|
370
426
|
}, HTMLDivElement>;
|
|
371
427
|
export default _default;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { ContextMenuConfig, ContextMenuItem, MenuShowEvent, MenuHideEvent } from '../types/contextmenu';
|
|
2
|
+
import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
|
|
3
|
+
/**
|
|
4
|
+
* ========================================
|
|
5
|
+
* Props 定义
|
|
6
|
+
* ========================================
|
|
7
|
+
*/
|
|
8
|
+
interface Props {
|
|
9
|
+
/** 主题颜色起始 */
|
|
10
|
+
colorStart: string;
|
|
11
|
+
/** 主题颜色结束 */
|
|
12
|
+
colorEnd: string;
|
|
13
|
+
/** 菜单配置(可选,使用默认配置) */
|
|
14
|
+
menuConfig?: Partial<ContextMenuConfig>;
|
|
15
|
+
/** 快捷键列表(可选,使用默认列表) */
|
|
16
|
+
hotkeyList?: Array<{
|
|
17
|
+
key: string;
|
|
18
|
+
label: string;
|
|
19
|
+
}>;
|
|
20
|
+
}
|
|
21
|
+
declare const _default: DefineComponent<Props, {
|
|
22
|
+
/** 显示菜单 */
|
|
23
|
+
show: (e: Event) => void;
|
|
24
|
+
/** 隐藏菜单 */
|
|
25
|
+
hide: (e?: any, reason?: MenuHideEvent["reason"]) => void;
|
|
26
|
+
/** 是否可见 */
|
|
27
|
+
isVisible: () => boolean;
|
|
28
|
+
}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
|
|
29
|
+
"menu-show": (event: MenuShowEvent) => any;
|
|
30
|
+
"menu-hide": (event: MenuHideEvent) => any;
|
|
31
|
+
"menu-item-click": (item: ContextMenuItem, event: MouseEvent) => any;
|
|
32
|
+
}, string, PublicProps, Readonly<Props> & Readonly<{
|
|
33
|
+
"onMenu-show"?: ((event: MenuShowEvent) => any) | undefined;
|
|
34
|
+
"onMenu-hide"?: ((event: MenuHideEvent) => any) | undefined;
|
|
35
|
+
"onMenu-item-click"?: ((item: ContextMenuItem, event: MouseEvent) => any) | undefined;
|
|
36
|
+
}>, {
|
|
37
|
+
menuConfig: Partial<ContextMenuConfig>;
|
|
38
|
+
hotkeyList: Array<{
|
|
39
|
+
key: string;
|
|
40
|
+
label: string;
|
|
41
|
+
}>;
|
|
42
|
+
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
43
|
+
export default _default;
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
|
|
2
|
+
/**
|
|
3
|
+
* 组件属性
|
|
4
|
+
*/
|
|
5
|
+
interface Props {
|
|
6
|
+
/** 是否为直播流 */
|
|
7
|
+
isLive: boolean;
|
|
8
|
+
/** 是否在直播边缘(最新位置) */
|
|
9
|
+
isLiveEdge: boolean;
|
|
10
|
+
/** 当前播放时间(秒),可能为 undefined */
|
|
11
|
+
currentTime?: number;
|
|
12
|
+
/** 视频总时长(秒),可能为 undefined */
|
|
13
|
+
duration?: number;
|
|
14
|
+
/** 延迟阈值(秒),超过此时间显示"回到直播"按钮 */
|
|
15
|
+
delayThreshold?: number;
|
|
16
|
+
}
|
|
17
|
+
declare const _default: DefineComponent<Props, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {} & {
|
|
18
|
+
"go-to-live": () => any;
|
|
19
|
+
}, string, PublicProps, Readonly<Props> & Readonly<{
|
|
20
|
+
"onGo-to-live"?: (() => any) | undefined;
|
|
21
|
+
}>, {
|
|
22
|
+
currentTime: number;
|
|
23
|
+
duration: number;
|
|
24
|
+
delayThreshold: number;
|
|
25
|
+
}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLDivElement>;
|
|
26
|
+
export default _default;
|