/* ============================================================================
 * 14280 · 黄金战术 HUD 视觉层 v2  (Gold HUD)
 * 2026-10-06 · 巴蒂
 * ----------------------------------------------------------------------------
 * 目标：从「平黑编辑风」升级为「有光的深空 + 面板化组件 + 战术 HUD」，
 *       视觉强度整体拉高一个量级，第一眼就能看出不同。
 *   ① 底色：分层光晕 / 战术网格 / 扫描线 / 启用站点自带的准星·水印·地图路径
 *   ② 组件：玻璃顶栏 + 金色胶囊 + 滚动进度条｜巨型幽灵数字章节头 + 金色画线｜
 *            面板化卡片（金边/圆角/悬浮抬升/聚光）｜榜单名次徽章｜表格高亮｜
 *            FAQ 平滑展开｜奖励图悬浮放大
 *   ③ 动效：Hero 入场、章节头画线、错落 reveal、悬浮微交互
 * 约束：零依赖；配色仍以「黑曜石 + 冠军金」为主、冷青为辅，哑光实色，
 *       无彩虹 / 金属拉丝。全部规则置于 body.cinematic-main 之下，
 *       加载于生产主题之后，必要处 !important 覆盖。
 * ========================================================================== */

:root {
  --gh-ink-0: #040609;
  --gh-ink-1: #080b10;
  --gh-ink-2: #0d1218;
  --gh-gold: #d7b56d;
  --gh-gold-lt: #f8e7b4;
  --gh-gold-dk: #8a6b2f;
  --gh-cyan: #7cf3ff;
  --gh-ivory: #f3f1ea;
  --gh-line: rgba(215, 181, 109, .17);
  --gh-line-2: rgba(215, 181, 109, .34);
  --gh-panel: linear-gradient(166deg, rgba(21, 25, 32, .84), rgba(9, 12, 17, .93));
  --gh-r: 18px;
  --gh-ease: cubic-bezier(.22, .61, .36, 1);
}

/* ─────────────────────────────────────────────────────────────
 * ① 底色 · 分层光晕 + 战术网格 + 扫描线
 * ───────────────────────────────────────────────────────────*/
html { background: var(--gh-ink-0) !important; }

body.cinematic-main {
  background: #05070a !important;
  background-image:
    radial-gradient(132% 76% at 50% -2%, rgba(215, 181, 109, .42), transparent 58%),
    radial-gradient(72% 54% at -4% 26%, rgba(124, 243, 255, .14), transparent 68%),
    radial-gradient(86% 64% at 102% 76%, rgba(215, 181, 109, .24), transparent 72%),
    radial-gradient(112% 72% at 50% 106%, rgba(124, 243, 255, .08), transparent 78%),
    linear-gradient(180deg, #070a0f 0%, #0a0e14 44%, #04060a 100%) !important;
  background-attachment: fixed, fixed, fixed, fixed, fixed !important;
  background-repeat: no-repeat !important;
  color: var(--gh-ivory);
  position: relative;
}

/* 漂移光：叠加在背景之上，增加呼吸感 */
body.cinematic-main::before {
  content: '' !important;
  position: fixed !important;
  inset: -10vmax !important;
  z-index: -3 !important;
  pointer-events: none !important;
  opacity: .8 !important;
  background:
    radial-gradient(58% 38% at 50% 0%, rgba(215, 181, 109, .34), transparent 64%),
    radial-gradient(46% 38% at 90% 24%, rgba(215, 181, 109, .18), transparent 70%);
  filter: blur(26px) saturate(120%);
  animation: gh-drift 30s var(--gh-ease) infinite alternate;
}

/* 近层：战术网格 + 逐行扫描线（HUD 底纹） */
body.cinematic-main::after {
  content: '' !important;
  position: fixed !important;
  inset: 0 !important;
  z-index: -2 !important;
  pointer-events: none !important;
  opacity: 1 !important;
  background-image:
    linear-gradient(rgba(215, 181, 109, .09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(215, 181, 109, .09) 1px, transparent 1px),
    repeating-linear-gradient(0deg, rgba(255, 255, 255, .02) 0 1px, transparent 1px 4px);
  background-size: 78px 78px, 78px 78px, 100% 4px;
  -webkit-mask-image: radial-gradient(ellipse 112% 84% at 50% 24%, #000 10%, transparent 88%);
  mask-image: radial-gradient(ellipse 112% 84% at 50% 24%, #000 10%, transparent 88%);
}

/* Hero「纯黑头图 · 全幅铺底」
 * 站点 hero 本身是 1200px 宽的不透明纯黑块（#050505），页面底色一旦提亮，
 * 黑块两侧/上下就会被"框"出来，看着像贴了一张带边框的 JPG。
 * 这里把 hero 的黑横向铺满 100vw、并在底部渐隐融入页面 → 恢复「无边框纯黑头图」。
 * 高度由 JS 量取 hero 实际高度写入 --av-hero-stage（= hero 高 + 190px 渐隐带）。 */
body.cinematic-main .wrap::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  top: 0 !important;
  left: 50% !important;
  width: 100vw !important;
  height: var(--av-hero-stage, calc(min(760px, 100svh - 80px) + 190px)) !important;
  transform: translateX(-50%) !important;
  opacity: 1 !important;            /* 站点原有 .wrap::before 带 opacity:.7，务必压回 1，否则底色会透上来 */
  /* ⛔ 站点原生 .wrap::before 带 mask-image: linear-gradient(to bottom, transparent 0, #000 18%, #000 82%, transparent 100%)
   *    不重置的话黑色铺底会在顶部 18%（≈171px）与底部 18% 淡出 → hero 上半截两侧的页底光晕透出来，
   *    看起来就是"贴了一张带黑边/被裁过的 JPG"。必须把 mask 清掉，底部渐隐改由 background 渐变自己负责。 */
  -webkit-mask-image: none !important;
  mask-image: none !important;
  background: linear-gradient(180deg,
    #050505 0,
    #050505 calc(100% - 190px),
    rgba(5, 5, 5, .5) calc(100% - 92px),
    rgba(5, 5, 5, 0) 100%) !important;
  pointer-events: none !important;
  z-index: -1 !important;
}

/* 站点自带战术装饰：原本被主题 display:none 关掉，这里重新启用 */
body.cinematic-main > .beam,
body.cinematic-main > .floor,
body.cinematic-main > .arena-haze,
body.cinematic-main > .watermark,
body.cinematic-main > .crosshair,
body.cinematic-main > .map-sil { display: block !important; }

/* 右侧巨型水印（极淡填充，作背景纹理） */
body.cinematic-main > .watermark {
  position: fixed !important;
  right: -3vw !important; top: 4vh !important;
  margin: 0 !important;
  font: 800 clamp(180px, 24vw, 380px)/1 Manrope, "Microsoft YaHei", sans-serif !important;
  color: rgba(215, 181, 109, .05) !important;
  -webkit-text-stroke: 1px rgba(215, 181, 109, .075) !important;
  letter-spacing: -.055em !important;
  z-index: -1 !important; pointer-events: none !important; user-select: none !important;
}

/* 右下旋转准星（改金 · 极淡 · 不夺内容） */
body.cinematic-main > .crosshair {
  position: fixed !important;
  right: 4vw !important; top: 62vh !important;
  width: 190px !important; height: 190px !important;
  opacity: .17 !important;
  transform-origin: 50% 50% !important;
  animation: gh-spin 58s linear infinite !important;
  z-index: -1 !important; pointer-events: none !important;
}
body.cinematic-main > .crosshair [stroke] { stroke: var(--gh-gold) !important; }
body.cinematic-main > .crosshair [fill]   { fill: var(--gh-gold) !important; }

/* 左下地图路径剪影（改青 · 极淡） */
body.cinematic-main > .map-sil {
  position: fixed !important;
  left: -5vw !important; bottom: 7vh !important;
  width: 520px !important; height: 260px !important;
  opacity: .1 !important;
  z-index: -1 !important; pointer-events: none !important;
}
body.cinematic-main > .map-sil [stroke] { stroke: var(--gh-cyan) !important; }
body.cinematic-main > .map-sil [fill]   { fill: var(--gh-gold) !important; }

/* ─────────────────────────────────────────────────────────────
 * ② 顶栏 / 导航 / 进度条
 * ───────────────────────────────────────────────────────────*/
/* 页顶：顶栏与 hero 的纯黑连成一体（无分隔线）；滚动后：玻璃质感 + 金色发丝线 */
body.cinematic-main .topbar {
  background: #050505 !important;
  border-bottom: 1px solid transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  transition: padding .3s var(--gh-ease), background .3s var(--gh-ease), border-color .3s var(--gh-ease) !important;
}
body.cinematic-main .topbar.av-scrolled {
  background: linear-gradient(180deg, rgba(9, 11, 15, .95), rgba(7, 9, 12, .82)) !important;
  border-bottom-color: var(--gh-line) !important;
  backdrop-filter: blur(22px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(140%) !important;
  box-shadow: 0 22px 60px -34px #000, 0 1px 0 rgba(215, 181, 109, .12) inset !important;
}

body.cinematic-main .navbar { gap: 4px !important; }
body.cinematic-main .navbar a {
  border-radius: 999px !important;
  padding: 8px 15px !important;
  transition: color .22s, background .26s, box-shadow .26s !important;
}
body.cinematic-main .navbar a:hover { background: rgba(215, 181, 109, .1) !important; }
body.cinematic-main .navbar a.on,
body.cinematic-main .navbar a.active {
  background: linear-gradient(135deg, var(--gh-gold-lt), var(--gh-gold) 62%, var(--gh-gold-dk)) !important;
  color: #17110a !important;
  font-weight: 700 !important;
  box-shadow: 0 10px 30px -14px rgba(215, 181, 109, .85) !important;
}

/* 滚动进度条 */
body.cinematic-main .av-progress {
  position: fixed !important;
  top: 0 !important; left: 0 !important;
  height: 3px !important; width: 0;
  z-index: 9999 !important;
  background: linear-gradient(90deg, var(--gh-gold-dk), var(--gh-gold-lt) 46%, var(--gh-cyan)) !important;
  box-shadow: 0 0 18px rgba(215, 181, 109, .75) !important;
}

/* ─────────────────────────────────────────────────────────────
 * ③ 章节头 · 巨型幽灵数字 + 金色标签 + 大标题 + 画线
 * ───────────────────────────────────────────────────────────*/
body.cinematic-main section.editorial-section { position: relative; }

body.cinematic-main .chapter-head {
  position: relative !important;
  padding-bottom: 26px !important;
  margin-bottom: 40px !important;
  border-bottom: 1px solid var(--gh-line) !important;
}
/* 巨型描边幽灵数字（按区块硬编码，垂直居中于章节头右侧） */
body.cinematic-main .chapter-head::before {
  position: absolute !important;
  right: 4px !important; top: 50% !important;
  transform: translateY(-50%) !important;
  font: 800 clamp(80px, 10vw, 158px)/1 Manrope, "Microsoft YaHei", sans-serif !important;
  color: transparent !important;
  -webkit-text-stroke: 1.3px rgba(215, 181, 109, .22) !important;
  letter-spacing: -.05em !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
body.cinematic-main #tonight   .chapter-head::before { content: '01' !important; }
body.cinematic-main #standings .chapter-head::before { content: '02' !important; }
body.cinematic-main #prizes    .chapter-head::before { content: '03' !important; }
body.cinematic-main #profile   .chapter-head::before { content: '04' !important; }
body.cinematic-main #rules     .chapter-head::before { content: '05' !important; }
/* 金色画线（滚动到才展开） */
body.cinematic-main .chapter-head::after {
  content: '' !important;
  position: absolute !important;
  left: 0 !important; bottom: -1px !important;
  height: 2px !important; width: 0 !important;
  background: linear-gradient(90deg, var(--gh-gold), rgba(215, 181, 109, 0)) !important;
  box-shadow: 0 0 14px rgba(215, 181, 109, .6) !important;
  transition: width 1.1s var(--gh-ease) !important;
  z-index: 2 !important;
}
body.cinematic-main .chapter-head.av-drawn::after { width: 200px !important; }

body.cinematic-main .chapter-label {
  display: inline-flex !important;
  align-items: center !important; gap: 10px !important;
  color: var(--gh-gold) !important;
  font: 600 11px/1 Manrope, "Microsoft YaHei", sans-serif !important;
  letter-spacing: .32em !important;
  text-transform: uppercase !important;
  padding: 8px 15px !important;
  border: 1px solid var(--gh-line-2) !important;
  border-radius: 999px !important;
  background: linear-gradient(135deg, rgba(215, 181, 109, .13), rgba(215, 181, 109, .02)) !important;
  position: relative !important; z-index: 1 !important;
}
body.cinematic-main .chapter-label span { color: var(--gh-gold-lt) !important; font-weight: 800 !important; }

body.cinematic-main .chapter-heading { position: relative !important; z-index: 1 !important; }
body.cinematic-main .chapter-heading h2 {
  font-size: clamp(38px, 5vw, 66px) !important;
  line-height: 1.03 !important;
  letter-spacing: -.035em !important;
  margin: 16px 0 10px !important;
  background: linear-gradient(178deg, #fffdf7 6%, #ecd9a6 52%, #b9944c 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  text-shadow: none !important;
}
body.cinematic-main .chapter-heading p { color: #9fa4aa !important; font-size: 14px !important; }

/* ─────────────────────────────────────────────────────────────
 * ④ 面板化组件 —— 统一的玻璃卡片语言
 * ───────────────────────────────────────────────────────────*/
body.cinematic-main .panel,
body.cinematic-main .prize-card,
body.cinematic-main .reward-tier,
body.cinematic-main .diamond-reward-card,
body.cinematic-main .floating-rail,
body.cinematic-main .archive-workspace,
body.cinematic-main .rules-editorial,
body.cinematic-main .profile-card {
  background: var(--gh-panel) !important;
  border: 1px solid var(--gh-line) !important;
  border-radius: var(--gh-r) !important;
  box-shadow: 0 44px 96px -74px #000, 0 1px 0 rgba(255, 255, 255, .045) inset !important;
  position: relative !important;
  overflow: hidden !important;
}
/* 卡片顶部金色高光条 */
body.cinematic-main .panel::before,
body.cinematic-main .prize-card::before,
body.cinematic-main .reward-tier::before,
body.cinematic-main .floating-rail::before {
  content: '' !important;
  position: absolute !important;
  left: 18px !important; right: 18px !important; top: 0 !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(215, 181, 109, .5), transparent) !important;
  z-index: 2 !important;
}
/* 光标跟随聚光 */
body.cinematic-main .panel::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  opacity: 0 !important;
  background: radial-gradient(220px circle at var(--av-mx, 50%) var(--av-my, 0%), rgba(215, 181, 109, .13), transparent 62%) !important;
  transition: opacity .35s !important;
  z-index: 1 !important;
}
body.cinematic-main .panel:hover::after { opacity: 1 !important; }

/* 悬浮抬升 */
body.cinematic-main .panel,
body.cinematic-main .prize-card,
body.cinematic-main .reward-tier {
  transition: transform .38s var(--gh-ease), border-color .38s, box-shadow .38s !important;
}
body.cinematic-main .prize-card:hover,
body.cinematic-main .reward-tier:hover {
  transform: translateY(-6px) !important;
  border-color: var(--gh-line-2) !important;
  box-shadow: 0 60px 120px -78px rgba(215, 181, 109, .75) !important;
}

/* ── 今晚 · 三张时段卡 ─────────────────────────────────── */
body.cinematic-main #tonight .slot {
  background: linear-gradient(160deg, rgba(255, 255, 255, .035), rgba(255, 255, 255, .008)) !important;
  border: 1px solid rgba(215, 181, 109, .11) !important;
  border-radius: 15px !important;
  padding: 24px !important;
  transition: transform .36s var(--gh-ease), border-color .36s, box-shadow .36s !important;
}
body.cinematic-main #tonight .slot:hover {
  transform: translateY(-6px) !important;
  border-color: var(--gh-line-2) !important;
  box-shadow: 0 40px 78px -60px rgba(215, 181, 109, .8) !important;
}
body.cinematic-main #tonight .slot.boss {
  border-color: rgba(215, 181, 109, .34) !important;
  background: linear-gradient(160deg, rgba(215, 181, 109, .13), rgba(215, 181, 109, .025)) !important;
}
body.cinematic-main #tonight .s-time { color: var(--gh-gold-lt) !important; }
body.cinematic-main #tonight .s-idx { color: var(--gh-gold) !important; letter-spacing: .22em !important; }

/* ── 榜单 rail ──────────────────────────────────────────── */
body.cinematic-main .floating-rail { padding: 22px 20px !important; }
body.cinematic-main .float-kicker {
  color: var(--gh-gold) !important;
  letter-spacing: .28em !important;
  font-size: 10px !important;
}
body.cinematic-main .floating-rail h2 { color: var(--gh-ivory) !important; }
body.cinematic-main .float-list li {
  border-bottom: 1px solid rgba(215, 181, 109, .085) !important;
  padding: 9px 8px !important;
  border-radius: 8px !important;
  transition: background .22s var(--gh-ease), padding-left .22s !important;
}
body.cinematic-main .float-list li:hover {
  background: linear-gradient(90deg, rgba(215, 181, 109, .12), transparent) !important;
  padding-left: 12px !important;
}
/* 前三名徽章 */
body.cinematic-main #teamRankList li:nth-child(-n+3) .float-rank,
body.cinematic-main #personalRankList li:nth-child(-n+3) .float-rank,
body.cinematic-main #fanRankList li:nth-child(-n+3) .float-rank {
  display: inline-flex !important;
  align-items: center !important; justify-content: center !important;
  width: 24px !important; height: 24px !important;
  border-radius: 50% !important;
  font-weight: 800 !important;
  font-size: 11px !important;
}
body.cinematic-main #teamRankList li:nth-child(1) .float-rank,
body.cinematic-main #personalRankList li:nth-child(1) .float-rank,
body.cinematic-main #fanRankList li:nth-child(1) .float-rank {
  background: linear-gradient(135deg, #f8e7b4, #c79b45) !important;
  color: #1a1408 !important;
  box-shadow: 0 8px 22px -10px rgba(248, 231, 180, .95) !important;
}
body.cinematic-main #teamRankList li:nth-child(2) .float-rank,
body.cinematic-main #personalRankList li:nth-child(2) .float-rank,
body.cinematic-main #fanRankList li:nth-child(2) .float-rank {
  background: linear-gradient(135deg, #e9edf2, #9aa6b3) !important;
  color: #14161a !important;
  box-shadow: 0 8px 20px -12px rgba(233, 237, 242, .8) !important;
}
body.cinematic-main #teamRankList li:nth-child(3) .float-rank,
body.cinematic-main #personalRankList li:nth-child(3) .float-rank,
body.cinematic-main #fanRankList li:nth-child(3) .float-rank {
  background: linear-gradient(135deg, #e7b483, #a9703c) !important;
  color: #1d130a !important;
  box-shadow: 0 8px 20px -12px rgba(231, 180, 131, .8) !important;
}
body.cinematic-main .float-value { color: var(--gh-gold-lt) !important; font-weight: 700 !important; }

/* ── 赛季战绩表 ─────────────────────────────────────────── */
body.cinematic-main .archive-workspace { padding: 26px !important; }
body.cinematic-main .archive-table th {
  color: var(--gh-gold) !important;
  font-size: 10px !important;
  letter-spacing: .2em !important;
  border-bottom: 1px solid var(--gh-line-2) !important;
}
body.cinematic-main .archive-table td { border-bottom: 1px solid rgba(215, 181, 109, .075) !important; }
body.cinematic-main .archive-table tbody tr { transition: background .2s !important; }
body.cinematic-main .archive-table tbody tr:hover { background: rgba(215, 181, 109, .07) !important; }

/* ── 奖励区 ─────────────────────────────────────────────── */
body.cinematic-main .diamond-reward-card { padding: 26px !important; }
body.cinematic-main .reward-art-frame {
  border-radius: 13px !important;
  overflow: hidden !important;
  border: 1px solid rgba(215, 181, 109, .15) !important;
  background: radial-gradient(120% 100% at 50% 0%, rgba(215, 181, 109, .07), transparent 70%) !important;
  transition: transform .42s var(--gh-ease), border-color .42s, box-shadow .42s !important;
}
body.cinematic-main .reward-product-grid figure:hover .reward-art-frame {
  transform: translateY(-7px) scale(1.035) !important;
  border-color: var(--gh-line-2) !important;
  box-shadow: 0 34px 60px -44px rgba(215, 181, 109, .9) !important;
}
body.cinematic-main .reward-tier-heading strong { color: var(--gh-ivory) !important; }
body.cinematic-main .reward-tier-count { color: var(--gh-gold) !important; }
body.cinematic-main .prize-title { color: var(--gh-ivory) !important; }
body.cinematic-main .prize-gallery-main { border-radius: 13px !important; overflow: hidden !important; border: 1px solid rgba(215, 181, 109, .16) !important; }
body.cinematic-main .prize-gallery-thumb { border-radius: 9px !important; transition: transform .3s, border-color .3s !important; }
body.cinematic-main .prize-gallery-thumb:hover { transform: translateY(-3px) !important; border-color: var(--gh-line-2) !important; }

/* ── 身份区 ─────────────────────────────────────────────── */
body.cinematic-main .profile-card { padding: 26px !important; }
body.cinematic-main .panel-head h3 { color: var(--gh-ivory) !important; }
body.cinematic-main .fk { color: var(--gh-gold) !important; letter-spacing: .1em !important; }
body.cinematic-main .profile-title { color: var(--gh-gold-lt) !important; }
body.cinematic-main .tag.gold {
  background: linear-gradient(135deg, var(--gh-gold-lt), var(--gh-gold)) !important;
  color: #17110a !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}

/* ── 按钮 ───────────────────────────────────────────────── */
body.cinematic-main .primary-btn,
body.cinematic-main .cinematic-live-link {
  background: linear-gradient(135deg, var(--gh-gold-lt), var(--gh-gold) 58%, var(--gh-gold-dk)) !important;
  color: #17110a !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  box-shadow: 0 16px 42px -20px rgba(248, 231, 180, .8) !important;
  transition: transform .3s var(--gh-ease), box-shadow .3s !important;
  position: relative !important;
  overflow: hidden !important;
}
body.cinematic-main .primary-btn:hover,
body.cinematic-main .cinematic-live-link:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 24px 54px -20px rgba(248, 231, 180, 1) !important;
}
body.cinematic-main .ghost-btn,
body.cinematic-main .cinematic-data-link {
  border: 1px solid var(--gh-line-2) !important;
  border-radius: 999px !important;
  color: var(--gh-gold-lt) !important;
  background: rgba(215, 181, 109, .06) !important;
  transition: background .3s, transform .3s, border-color .3s !important;
}
body.cinematic-main .ghost-btn:hover,
body.cinematic-main .cinematic-data-link:hover {
  background: rgba(215, 181, 109, .14) !important;
  transform: translateY(-3px) !important;
}

/* ─────────────────────────────────────────────────────────────
 * ⑤ 规则 FAQ · 平滑展开 + 编号高亮
 * ───────────────────────────────────────────────────────────*/
body.cinematic-main .rules-editorial { padding: 12px 26px !important; }
body.cinematic-main .rrow {
  border-bottom: 1px solid rgba(215, 181, 109, .1) !important;
  transition: background .25s !important;
}
body.cinematic-main .rrow:last-child { border-bottom: 0 !important; }
body.cinematic-main .rrow summary { transition: color .22s !important; }
body.cinematic-main .rrow summary:hover { color: var(--gh-gold-lt) !important; }
body.cinematic-main .rrow .rn { color: var(--gh-gold) !important; font-weight: 800 !important; }
body.cinematic-main .rrow[open] .rn,
body.cinematic-main .rrow[open] summary { color: var(--gh-gold-lt) !important; }
body.cinematic-main .rrow[open] { background: linear-gradient(90deg, rgba(215, 181, 109, .06), transparent) !important; }
body.cinematic-main .details-plus { color: var(--gh-gold) !important; transition: transform .4s var(--gh-ease) !important; }
body.cinematic-main .rrow[open] .details-plus { transform: rotate(135deg) !important; }

/* ─────────────────────────────────────────────────────────────
 * ⑥ Hero · 标题 / 按钮 / 底栏数据
 * ───────────────────────────────────────────────────────────*/
body.cinematic-main .cinematic-hero { position: relative; }
body.cinematic-main .cinematic-hero h1 { filter: drop-shadow(0 22px 60px rgba(215, 181, 109, .22)) !important; }
body.cinematic-main .hero-sub .k { color: var(--gh-gold) !important; letter-spacing: .2em !important; }
body.cinematic-main .hero-sub .v { color: var(--gh-ivory) !important; }
body.cinematic-main .cinematic-cs2-mark span { color: var(--gh-gold) !important; letter-spacing: .2em !important; }

/* Hero 入场序列 */
body.cinematic-main .av-hero-in {
  opacity: 0;
  transform: translateY(28px);
  animation: gh-rise .9s var(--gh-ease) forwards;
  animation-delay: calc(var(--av-hd, 0) * .12s);
}
body.cinematic-main .av-hero-in[data-d="0"] { --av-hd: 0; }
body.cinematic-main .av-hero-in[data-d="1"] { --av-hd: 1; }
body.cinematic-main .av-hero-in[data-d="2"] { --av-hd: 2; }
body.cinematic-main .av-hero-in[data-d="3"] { --av-hd: 3; }
body.cinematic-main .av-hero-in[data-d="4"] { --av-hd: 4; }

/* ─────────────────────────────────────────────────────────────
 * ⑦ 页脚 / 滚动条
 * ───────────────────────────────────────────────────────────*/
body.cinematic-main .ticker {
  border-top: 1px solid var(--gh-line) !important;
  border-bottom: 1px solid var(--gh-line) !important;
  background: linear-gradient(90deg, rgba(215, 181, 109, .05), transparent 40%, rgba(215, 181, 109, .05)) !important;
}
body.cinematic-main .ticker b { color: var(--gh-gold-lt) !important; }
body.cinematic-main .foot { border-top: 1px solid var(--gh-line) !important; color: #8b8f95 !important; }
body.cinematic-main .foot a { color: var(--gh-gold) !important; }

/* ─────────────────────────────────────────────────────────────
 * ⑧ reveal 错落 + 关键帧
 * ───────────────────────────────────────────────────────────*/
@keyframes gh-drift {
  0%   { transform: translate3d(-1.5%, -1%, 0) scale(1.02); }
  100% { transform: translate3d(1.5%, 1.5%, 0) scale(1.06); }
}
@keyframes gh-spin { to { transform: rotate(360deg); } }
@keyframes gh-rise { to { opacity: 1; transform: none; } }

/* ─────────────────────────────────────────────────────────────
 * ⑩ 内容层口径（2026-10-07 华哥定）
 *   · Hero 次级按钮「进入内战」整体移除 —— 与根站 hero 的按钮方式对齐
 *   · 「赛季数据看板」整体移除 —— 它是钻粉擂台赛的赛季统计：走势图横轴写的是
 *     「挑战者赛 / 半决赛 / 决赛 / 擂主挑战」，还挂着「钻粉粉丝」KPI。擂台赛
 *     已停办，这份数据暂不需要；粉丝内战的数据在下方完整榜单里
 *     （个人积分榜 / 钻粉榜）。
 *   两项都是视觉层覆盖，回滚 = 删掉本段。
 * ───────────────────────────────────────────────────────────*/
body.cinematic-main .cinematic-actions .cinematic-data-link { display: none !important; }
body.cinematic-main .zdb-board { display: none !important; }

/* ─────────────────────────────────────────────────────────────
 * ⑨ 响应式 · 窄屏收敛（避免过重 / 溢出）
 * ───────────────────────────────────────────────────────────*/
@media (max-width: 760px) {
  body.cinematic-main .chapter-head::before { font-size: 62px !important; right: 0 !important; -webkit-text-stroke-width: 1px !important; }
  body.cinematic-main .chapter-heading h2 { font-size: clamp(30px, 8.6vw, 42px) !important; }
  body.cinematic-main > .watermark { display: none !important; }
  body.cinematic-main > .crosshair { width: 130px !important; height: 130px !important; opacity: .2 !important; }
  body.cinematic-main > .map-sil { width: 340px !important; height: 170px !important; opacity: .1 !important; }
  body.cinematic-main .panel,
  body.cinematic-main .prize-card,
  body.cinematic-main .reward-tier,
  body.cinematic-main .floating-rail,
  body.cinematic-main .archive-workspace,
  body.cinematic-main .rules-editorial { border-radius: 15px !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.cinematic-main::before { animation: none !important; }
  body.cinematic-main > .crosshair { animation: none !important; }
  body.cinematic-main .av-hero-in { animation: none !important; opacity: 1 !important; transform: none !important; }
  body.cinematic-main .chapter-head::after { transition: none !important; width: 200px !important; }
}