/* ===================================================================
 * css/v8.css — v8 改造覆盖层（最后加载，优先级最高）
 * -------------------------------------------------------------------
 * 本轮（第 14 轮）3 项细化修复：
 *   1) TOP 主标题「黑字压深底」修复：
 *      根因 —— v7.css 为“标题区零图片”写的
 *        .topbar .brand-txt h1 { background-image: none !important; }
 *      把 .gold-text 的描金渐变（background-clip:text 的填充源）一起清掉了，
 *      而 .gold-text 的 color/-webkit-text-fill-color 是 transparent，
 *      于是标题既无渐变填充也无文字色 → 渲染为空（视觉上即“黑字压黑底”）。
 *      修法 —— 用更高权重 + !important 恢复金色渐变填充，并给出纯金兜底色
 *      （不支持 background-clip:text 的引擎回落到实心金色，永不隐形）；
 *      同时抬高副标题/工具栏文字的对比度，杜绝同区任何“暗字压深底”。
 *   2) 抽奖区标题区重构：删除左侧产品轮播图（.stage-window），
 *      标题信息块与「开始抽奖」按钮改为同一行横向排列（左信息 / 右按钮，
 *      垂直居中、不换行不重叠），整体高度压缩，标题与关键信息字号放大加粗。
 *   3) 删除「抽奖由抽奖区工作人员统一操作 · 参与者请勿接触设备」提示文案
 *      （DOM 已移除，这里再做样式级兜底，防止旧缓存/其它入口残影）。
 * =================================================================== */

/* ==================================================================
 * 1. TOP 主标题：金色渐变描金（可读性修复）
 * -------------------------------------------------------------------
 * 1.1 兜底层（不加 @supports 也生效，先给实心金色 + 深红描边投影）
 * 1.2 @supports 层（支持 background-clip:text 时升级为渐变描金）
 *     —— 两层都带 !important 且选择器权重高于 v7 的清除规则
 *        (.topbar .brand .brand-txt h1#siteTitle = 1 id + 3 class)
 * ================================================================== */
.topbar .brand .brand-txt h1#siteTitle {
  /* 兜底：任何引擎下都是醒目金色，绝不会出现“暗色字压在深色底上” */
  color: #FBE7AE !important;
  -webkit-text-fill-color: #FBE7AE !important;
  text-shadow:
    0 1px 0 rgba(96, 10, 18, .9),
    0 2px 10px rgba(0, 0, 0, .55),
    0 0 22px rgba(255, 198, 104, .42);
  font-weight: 900;
  letter-spacing: .035em;
  line-height: 1.2;
  white-space: nowrap;
  overflow: visible;
  /* 深色顶栏上再垫一层极淡的暖光晕，远距离更易读出字形轮廓 */
  filter:
    drop-shadow(0 1px 0 rgba(72, 6, 14, .85))
    drop-shadow(0 3px 0 rgba(60, 4, 10, .42))
    drop-shadow(0 14px 34px rgba(0, 0, 0, .5));
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .topbar .brand .brand-txt h1#siteTitle {
    /* 高亮金 → 中金 → 深金 → 回亮金：模拟金属压光的纵向渐变 */
    background-image: linear-gradient(
      178deg,
      #FFF8E4 0%,
      #FBE7AE 22%,
      #F2D083 46%,
      #D8A647 70%,
      #FFEFC2 100%
    ) !important;
    background-repeat: no-repeat !important;
    background-size: 100% 100% !important;
    background-position: 0 0 !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    /* 描金：深红硬投影勾边 + 暖金光晕，深底上边缘清晰 */
    text-shadow: none;
    filter:
      drop-shadow(0 1px 0 rgba(88, 8, 16, .9))
      drop-shadow(0 2px 1px rgba(56, 4, 10, .55))
      drop-shadow(0 0 16px rgba(255, 190, 96, .5))
      drop-shadow(0 14px 34px rgba(0, 0, 0, .45));
  }
}

/* 全屏态 / hover 保持同一金色：禁止任何覆盖层改动标题填充 */
:fullscreen .topbar .brand .brand-txt h1#siteTitle,
:-webkit-full-screen .topbar .brand .brand-txt h1#siteTitle,
html.is-fullscreen .topbar .brand .brand-txt h1#siteTitle,
.topbar .brand:hover .brand-txt h1#siteTitle {
  color: #FBE7AE !important;
}
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  :fullscreen .topbar .brand .brand-txt h1#siteTitle,
  :-webkit-full-screen .topbar .brand .brand-txt h1#siteTitle,
  html.is-fullscreen .topbar .brand .brand-txt h1#siteTitle,
  .topbar .brand:hover .brand-txt h1#siteTitle {
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
  }
}

/* 1.3 同区其他文字：统一抬亮，杜绝暗字压深底（副标题 / 时钟 / 抽奖区 / 奖池 / 工具按钮） */
.topbar .brand-txt p#siteSub {
  color: rgba(255, 236, 208, .72) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
}
.topbar .top-clock #clockText {
  color: rgba(255, 238, 214, .8) !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .5);
}
.topbar .zone-pick .zp-label {
  color: rgba(255, 236, 208, .68) !important;
}
.topbar .zone-pick .zp-val {
  color: #FDF3D6 !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .45);
}
.topbar .pool-chip {
  color: rgba(255, 238, 214, .82) !important;
}
.topbar .pool-chip b {
  color: #FFEFC2 !important;
  text-shadow: 0 1px 0 rgba(80, 8, 14, .8), 0 0 14px rgba(255, 200, 110, .4);
}
.topbar .icon-btn,
.topbar .fs-btn,
.topbar .fs-btn .fs-txt {
  color: rgba(255, 238, 214, .86) !important;
}

/* PC 端主标题再放大一档（3.05vh → 3.4vh），远距离投屏更易读 */
@media (min-width: 1024px) {
  .topbar .brand .brand-txt h1#siteTitle {
    font-size: 3.4vh;
    letter-spacing: .04em;
  }
}

/* ==================================================================
 * 2. 抽奖区：删图 + 压缩高度 + 标题放大 + 信息块与按钮同行
 * ================================================================== */

/* 2.0 产品轮播图整体退场（DOM 已删除，此处兜底防残影） */
#stageSec .stage-window,
#stageSec #stageWindow,
#stageSec .sw-img,
#stageSec .sw-name {
  display: none !important;
}

/* 2.1 主舞台结构：单一横排 flex —— 左信息块 / 右开始抽奖按钮 */
#stageSec .stage-main {
  display: flex !important;
  grid-template-columns: none !important;
  grid-template-rows: none !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: clamp(14px, 1.6vw, 28px);
  text-align: left;
}

#stageSec .stage-side {
  flex: 1 1 auto;
  min-width: 0;
  display: flex !important;
  flex-direction: row !important;      /* 标签 / 主标题 / 说明 真正排成一行 */
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  text-align: left !important;
  gap: 6px;
}

#stageSec .stage-zone {
  align-self: center;
  flex: 0 0 auto;
  margin: 0;
  white-space: nowrap;
  letter-spacing: .12em;
}

#stageSec .stage-title {
  margin: 0;
  flex: 0 1 auto;
  letter-spacing: .06em;
  line-height: 1.12;
  white-space: nowrap;
}

#stageSec .stage-desc {
  margin: 0;
  flex: 0 0 auto;
  white-space: nowrap;
  letter-spacing: .1em;
  color: rgba(255, 240, 220, .74);
  border-left: 1px solid rgba(255, 206, 150, .3);
  padding-left: 1.1em;
}

/* 2.2 按钮：右侧独立一列，垂直居中，不参与换行
   （index.css 基础样式给了 .btn-lucky width:100%，做 flex 项时会把信息块挤成 0 宽，
     必须显式 width:auto 让它按内容宽度占位） */
#stageSec .btn-lucky {
  flex: 0 0 auto;
  width: auto !important;
  align-self: center;
  margin: 0;
  max-width: none;
}

/* 2.3 提示文案退场（DOM 已删除） */
#stageSec .stage-note,
.stage-note {
  display: none !important;
}

/* ==================================================================
 * 3. PC 大屏（≥1024）：vh 令牌等比放大 + 高度收紧
 * ================================================================== */
@media (min-width: 1024px) {
  /* 3.1 舞台容器：上下内边距砍到最小，灯光带压低 */
  #stageSec .stage { padding: .75vh 2.6vh !important; }
  #stageSec .stage-lights { height: 8vh; opacity: .58; }

  /* 3.2 信息块：标签 / 主标题 / 说明同行，字号分级放大加粗 */
  #stageSec .stage-side { gap: 1.5vh; }

  #stageSec .stage-zone {
    font-size: 1.45vh;
    font-weight: 700;
    padding: .3em 1.15em;
    letter-spacing: .14em;
  }
  #stageSec .stage-zone .sz-dim { font-size: 1.35vh; }

  #stageSec .stage-title {
    font-size: 4.7vh;           /* v7 为 2.75vh → 放大 1.7 倍 */
    font-weight: 900;
    letter-spacing: .075em;
    line-height: 1.08;
  }
  #stageSec .stage-desc {
    font-size: 1.55vh;
    font-weight: 600;
    letter-spacing: .12em;
    color: rgba(255, 240, 220, .78);
  }

  /* 3.3 开始抽奖按钮：与信息块同排、垂直居中、等比放大 */
  #stageSec .btn-lucky {
    height: 6.6vh;
    min-width: max(18vh, 200px);
    padding: 0 3.4vh;
    font-size: 2.45vh;
    letter-spacing: .22em;
    border-radius: 1.4vh;
  }
}

/* ==================================================================
 * 4. 平板（768–1023）：同样同行排列，用 vw 令牌避免小高度视口压扁
 * ================================================================== */
@media (min-width: 768px) and (max-width: 1023px) {
  #stageSec .stage { padding: 14px 18px; }
  #stageSec .stage-main { gap: 16px; }
  #stageSec .stage-side { gap: 5px; }
  #stageSec .stage-zone { font-size: 12px; font-weight: 700; padding: .32em 1em; }
  #stageSec .stage-title { font-size: clamp(22px, 2.9vw, 34px); font-weight: 900; }
  #stageSec .stage-desc { font-size: 12.5px; font-weight: 600; }
  #stageSec .btn-lucky {
    width: auto;
    min-width: 148px;
    max-width: none;
    height: 50px;
    padding: 0 22px;
    font-size: 17px;
    letter-spacing: .14em;
  }
}

/* ≤767：主舞台按既有设计整块隐藏（抽奖入口为顶部 .m-start 按钮），
   同时确保即便被强制显示也不出现横向溢出 */
@media (max-width: 767px) {
  #stageSec .stage-main {
    flex-wrap: nowrap !important;
    gap: 10px;
  }
  #stageSec .stage-side { flex-wrap: wrap !important; }
  #stageSec .stage-title { font-size: 19px; white-space: normal; }
  #stageSec .btn-lucky {
    width: auto;
    min-width: 96px;
    max-width: none;
    height: 44px;
    padding: 0 12px;
    font-size: 14px;
    letter-spacing: .06em;
  }
}

/* ==================================================================
 * 5. 版块间距微调：舞台高度压缩后富余的纵向空间统一回收，
 *    保证 PC 端 100vh 单屏（.layout-v5 为 space-between，间隙自动吸收）
 * ================================================================== */
@media (min-width: 1024px) {
  #stageSec { flex: 0 0 auto; }
}