/* ============================ 在线编辑器开屏广告浮层样式 ============================
 * 仅复用 splash.html 的广告浮层视觉（.splash-* 系列），
 * 刻意不包含 splash.css 的 `html,body{overflow:hidden}` 等全局规则，
 * 以免破坏编辑器自身的布局与滚动。浮层用极高的 z-index 覆盖编辑器全部 UI。
 *
 * 视觉调整为「半透明遮罩 + 居中悬浮卡片」：overlay 仅作半透明遮罩，
 * 真正的卡片由 .splash-panel 居中承载，不再全屏实色覆盖。 */
.splash-overlay {
  position: fixed;
  inset: 0;
  z-index: 2000; /* 高于编辑器所有弹窗（确认框/广告弹窗 940、toast 1000） */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px; /* 小屏留白，避免卡片贴边 */
  background: rgba(0, 0, 0, 0.5); /* 半透明遮罩，而非全屏实色 */
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Microsoft YaHei", sans-serif;
  color: #f2f4f8;
}

/* 居中悬浮卡片容器：约束广告/加载/空态的尺寸与居中 */
.splash-panel {
  position: relative;
  width: min(92vw, 560px);
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

/* 关闭 / 跳过按钮（置于卡片右上角最顶层，防止 SDK 遮罩或媒体层拦截点击） */
.splash-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.18);
  color: #fff;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  z-index: 2001;
  pointer-events: auto;
  transition: background 0.15s ease, transform 0.12s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}
.splash-close:hover { background: rgba(255, 255, 255, 0.32); transform: scale(1.05); }
.splash-close:active { transform: scale(0.96); }

/* 广告卡片 */
.splash-ad {
  position: relative;
  width: min(92vw, 560px);
  max-height: 88vh;
  display: flex;
  flex-direction: column;
  background: #15181f;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.splash-media {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #0b0d12;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.splash-media img,
.splash-media video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.splash-info {
  padding: 16px 18px 18px;
}
.splash-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 6px;
  color: #fff;
}
.splash-desc {
  font-size: 14px;
  line-height: 1.5;
  color: #b9c0cc;
  margin-bottom: 14px;
}
.splash-cta {
  display: inline-block;
  padding: 10px 22px;
  border: none;
  border-radius: 999px;
  background: #2f6bff;
  color: #fff;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 10;
  transition: background 0.15s ease, transform 0.12s ease;
}
.splash-cta:hover { background: #1f5af0; transform: translateY(-1px); }
.splash-cta:active { transform: translateY(0); }

.splash-tag {
  position: absolute;
  right: 12px;
  bottom: 12px;
  padding: 2px 8px;
  font-size: 11px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.45);
  color: #cdd3df;
}

/* 无填充 / 出错 */
.splash-empty {
  text-align: center;
  color: #b9c0cc;
}
.splash-empty p { margin: 0 0 14px; font-size: 15px; }
.splash-empty-btn {
  padding: 8px 20px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 999px;
  background: transparent;
  color: #f2f4f8;
  font-size: 14px;
  cursor: pointer;
}

.splash-loading {
  color: #8b93a3;
  font-size: 15px;
}