/* ========== 抖音视频播放器样式（emlog 版，与原版 Typecho 插件一致） ========== */

/* 外层容器：定义容器类型，供容器查询使用 */
.em-douyin-video {
  container-type: inline-size;
  container-name: em-douyin-video;
  width: 100%;
}

/* 播放器包裹层 */
.em-douyin-video-wrapper {
  container-type: inline-size;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  padding: 0;
  background: #000;
  color: #fff;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  border: none;
  min-height: 0;
}

/* 容器查询 - 容器宽度 >= 730px：桌面模式（横屏播放器） */
@container em-douyin-video (min-width: 730px) {
  .em-douyin-video-wrapper {
    width: min(730px, 100%);
    aspect-ratio: 146 / 89;
  }
}

/* 容器查询 - 容器宽度 < 730px：移动模式（竖屏播放器） */
@container em-douyin-video (max-width: 729px) {
  .em-douyin-video-wrapper {
    width: min(324px, 100%);
    aspect-ratio: 27 / 56;
  }
}

/* iframe 样式 */
.em-douyin-video-wrapper iframe {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border: none;
  border-radius: 8px;
  margin: 0;
  padding: 0;
  background: transparent;
  align-self: flex-start;
  z-index: 2;
  transition: height 0.3s ease;
  -ms-overflow-style: none;
  scrollbar-width: none;
}
