/* ==========================================================================
   瑞亿播放器 · 用户皮肤基础样式
   由 Skins.applyUserCSS() 动态注入具体皮肤规则；此文件提供作用域容器。
   ========================================================================== */

/* 当存在用户皮肤时，播放器根节点带上 data-user-skin="<id>"，
   动态注入的 CSS 会以该属性为作用域生效，从而与内置皮肤隔离。 */

[data-user-skin] .stage,
[data-user-skin] .side {
  transition: background 0.25s, border-color 0.25s, box-shadow 0.25s;
}

/* 用户皮肤常用可覆写锚点（示例，实际由皮肤包的 css 字段决定） */
[data-user-skin] .stage__badge,
[data-user-skin] .stage__tools .stage__tool {
  backdrop-filter: blur(14px);
}

[data-user-skin] .nav__item.is-active {
  font-weight: 700;
}

[data-user-skin] .stage__center {
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), background 0.25s;
}

/* 皮肤卡片内的预览图使用绝对定位的方块示意布局 */
.skin-card__prev i {
  position: absolute;
  border-radius: 3px;
  background: rgba(255, 255, 255, 0.45);
  display: block;
}