/* ============================================================
   跨越课堂 v3 · 视觉系统
   系统外壳（菜单/待机/结算/控制台）= 国风三套皮肤
   游戏内（嘴瓢等）= 各自原 PPT 氛围（.theme-orange 暖橙卡通），不做国风
   动效红线：只动 transform / opacity；时长四档；曲线 ease-out-quart
   ============================================================ */

/* 静态验收：?static=1 时所有动画/过渡直接落到最终态（仅用于截图验收，不影响真实产品） */
html.static *, html.static *::before, html.static *::after {
  animation-duration: 0.001s !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001s !important;
  transition-delay: 0s !important;
}

/* ---------- 三套国风皮肤 ---------- */
:root {
  --bg-img: image-set(url("../assets/bg/dunhuang-bg.webp") type("image/webp"), url("../assets/bg/dunhuang-bg.jpg") type("image/jpeg"));
  --ink: #f5e7c4;
  --ink-dim: #cdb986;
  --gold: #d8b15a;
  --gold-hi: #f7e3a6;
  --gold-deep: #a87f33;
  --accent: #d06a4a;
  --jade: #5fb3a2;
  --panel: rgba(15, 26, 47, .74);
  --panel-2: rgba(24, 38, 66, .82);
  --card: rgba(255, 246, 224, .06);
  --line: rgba(216, 177, 90, .38);
  --on-gold-ink: #2a1c05;
  --glow: 0 0 36px rgba(216, 177, 90, .35);
}

/* ===== 动效规范 v1（2026-10-30）：全站唯一一套时长与缓动 =====
   时长三档：fast（悬停/颜色这类即时反馈）、base（卡片位移、弹层进出）、slow（页面切换、大块内容入场）
   缓动三种：--mo-out 出场（快起慢收，最常用）、--mo-in-out 循环呼吸、--mo-pop 带回弹的强调
   三条纪律：①只动 transform / opacity，不碰宽高与布局 ②单次 ≤ .5s ③同一屏同时跑的不超过 3 组
   之前三页各写各的（大屏 7 种缓动、学员端只有 2 处 transition），从这里开始统一。 */
:root {
  --mo-fast: .16s;
  --mo-base: .28s;
  --mo-slow: .46s;
  --mo-press: .09s;
  --mo-out: cubic-bezier(.22, .8, .28, 1);
  --mo-in-out: cubic-bezier(.4, 0, .2, 1);
  --mo-pop: cubic-bezier(.34, 1.4, .64, 1);
}

/* 通用交互反馈：任何可点元素加 class 就有手感 */
.mo-press { transition: transform var(--mo-press) var(--mo-out), box-shadow var(--mo-fast) var(--mo-out), filter var(--mo-fast) var(--mo-out); }
.mo-press:active { transform: translateY(1px) scale(.985); }
.mo-lift { transition: transform var(--mo-fast) var(--mo-out), box-shadow var(--mo-base) var(--mo-out); }
.mo-lift:hover { transform: translateY(-3px); }

/* 弹层进出 */
@keyframes moIn { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes moOut { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(6px) scale(.99); } }
.mo-in { animation: moIn var(--mo-base) var(--mo-out) both; }

/* 列表错峰入场：容器加 .mo-rise，子元素按 --i 依次升起来 */
@keyframes moRise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
.mo-rise > * { animation: moRise var(--mo-slow) var(--mo-out) both; animation-delay: calc(var(--i, 0) * 40ms); }

/* 系统开了「减少动画」时不灭火，只把时长压到极短并保留终态（2026-10-25 定下的口径） */


[data-skin="dunhuang"] {
  --bg-img: image-set(url("../assets/bg/dunhuang-bg.webp") type("image/webp"), url("../assets/bg/dunhuang-bg.jpg") type("image/jpeg"));
  --ink: #f5e7c4;
  --ink-dim: #cdb986;
  --gold: #d8b15a;
  --gold-hi: #f7e3a6;
  --gold-deep: #a87f33;
  --accent: #d06a4a;
  --jade: #5fb3a2;
  --panel: rgba(15, 26, 47, .74);
  --panel-2: rgba(24, 38, 66, .82);
  --card: rgba(255, 246, 224, .06);
  --line: rgba(216, 177, 90, .38);
  --on-gold-ink: #2a1c05;
  --glow: 0 0 36px rgba(216, 177, 90, .35);
}
[data-skin="ink"] {
  --bg-img: url("../assets/bg/ink-bg.jpg");
  --ink: #3a2e58;
  --ink-dim: #6f6290;
  --gold: #7c68b0;
  --gold-hi: #9d86cf;
  --gold-deep: #5b4890;
  --accent: #a84a3a;
  --jade: #4f8b7e;
  --panel: rgba(255, 255, 255, .80);
  --panel-2: rgba(255, 255, 255, .92);
  --card: rgba(124, 104, 176, .07);
  --line: rgba(110, 92, 158, .28);
  --on-gold-ink: #fff;
  --glow: 0 0 30px rgba(124, 104, 176, .22);
}
[data-skin="feitian"] {
  --bg-img: url("../assets/bg/feitian-bg.jpg");
  --ink: #fbeec8;
  --ink-dim: #d9bd80;
  --gold: #f2cb6b;
  --gold-hi: #ffe7a3;
  --gold-deep: #c79a33;
  --accent: #d05b3c;
  --jade: #6fb3a4;
  --panel: rgba(32, 21, 8, .76);
  --panel-2: rgba(46, 30, 12, .86);
  --card: rgba(255, 235, 180, .07);
  --line: rgba(242, 203, 107, .42);
  --on-gold-ink: #2c1a04;
  --glow: 0 0 38px rgba(242, 203, 107, .38);
}
[data-skin="whale"] {
  --bg-img: url("../assets/whale/palace-light.webp");
  --ink: #1b2a4a;
  --ink-dim: #5b6f8f;
  --gold: #b38b45;
  --gold-hi: #8a6528;
  --gold-deep: #7c5a24;
  --accent: #b75c7a;
  --jade: #2f8f8a;
  --panel: rgba(255, 255, 255, .76);
  --panel-2: rgba(255, 255, 255, .90);
  --card: rgba(255, 255, 255, .38);
  --line: rgba(120, 145, 175, .34);
  --on-gold-ink: #ffffff;
  --glow: 0 8px 30px rgba(63, 89, 125, .16);
}

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; }
body {
  font-family: "Microsoft YaHei", "PingFang SC", "Hiragino Sans GB", sans-serif;
  color: var(--ink);
  background: #0b1020;
  overflow: hidden;
  user-select: none;
}
.shell-bg {
  position: fixed; inset: 0; z-index: -2;
  background: #0b1020 var(--bg-img) center/cover no-repeat;
}
.shell-bg::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(120% 90% at 50% 42%, transparent 55%, rgba(0,0,0,.28) 100%);
}
/* 背景层常驻氛围：两团偏心鎏金光斑绕中心极慢公转。
   用不对称光斑而不是对称光轮 —— 对称图形转起来肉眼看不出在动。 */
.shell-bg::before {
  content: ""; position: absolute; left: 50%; top: 46%;
  width: 180vmin; height: 180vmin; margin: -90vmin 0 0 -90vmin; pointer-events: none;
  background:
    radial-gradient(circle at 70% 28%, rgba(216,177,90,.20), transparent 40%),
    radial-gradient(circle at 26% 72%, rgba(216,177,90,.13), transparent 34%);
  filter: blur(22px);
  animation: shellTurn 130s linear infinite, shellBreathe 19s ease-in-out infinite;
}
@keyframes shellTurn { to { transform: rotate(360deg); } }
/* 极慢明暗呼吸。模糊光斑单纯自转时，同一像素的亮度变化很小，
   盯十几秒仍会觉得"是张静图"；叠一层 19 秒的亮度呼吸，整块屏才是活的。 */
@keyframes shellBreathe { 0%, 100% { opacity: .82; } 50% { opacity: 1; } }
/* L2 纯 transform 微动：两朵祥云缓慢漂移 */
.cloud { position: fixed; z-index: -1; opacity: .16; pointer-events: none;
  width: 42vmin; aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 40% 40%, var(--gold-hi), transparent 62%);
  filter: blur(6px); animation: drift 38s linear infinite; }
.cloud.c1 { top: -8vmin; left: -10vmin; }
.cloud.c2 { bottom: -12vmin; right: -12vmin; animation-duration: 52s; animation-direction: reverse; }
@keyframes drift { from { transform: translate3d(0,0,0); } to { transform: translate3d(26vmin, 14vmin, 0); } }

/* ---------- 通用鎏金 ---------- */
.gold-text {
  background: linear-gradient(180deg, var(--gold-hi) 0%, var(--gold) 48%, var(--gold-deep) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.title-brush { font-weight: 900; letter-spacing: .12em; }
.seal {
  display: inline-flex; align-items: center; justify-content: center;
  width: 3.4em; height: 3.4em; border-radius: 8px;
  background: linear-gradient(160deg, #c6483a, #9c2f24);
  color: #fff6e6; font-weight: 900; line-height: 1.05; font-size: 13px; letter-spacing: .05em;
  box-shadow: 0 6px 18px rgba(156,47,36,.4), inset 0 0 0 2px rgba(255,240,220,.5);
  transform: rotate(-6deg);
}
.gold-frame { border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--glow); }

/* ---------- 按钮 ---------- */
.btn {
  appearance: none; border: none; cursor: pointer; font-family: inherit;
  font-size: 16px; font-weight: 700; color: var(--on-gold-ink);
  padding: 12px 22px; border-radius: 14px; letter-spacing: .04em;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold) 55%, var(--gold-deep));
  box-shadow: 0 8px 20px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.5);
  transition: transform .12s cubic-bezier(.34,1.56,.64,1), box-shadow .12s, filter .12s;
}
.btn:active { transform: scale(.94); }
.btn:hover { filter: brightness(1.06); }
.btn.ghost { background: var(--card); color: var(--ink); border: 1px solid var(--line); box-shadow: none; }
.btn.ghost:active { transform: scale(.95); }
.btn.danger { background: linear-gradient(180deg, #e88272, #cf4e3e); color: #fff; }
.btn.good { background: linear-gradient(180deg, #57d69a, #21a868); color: #fff; }
.btn.big { font-size: 20px; padding: 16px 34px; border-radius: 18px; }
.btn[disabled] { opacity: .42; pointer-events: none; }

/* ---------- 面板 ---------- */
.panel {
  background: var(--panel); border: 1px solid var(--line);
  border-radius: 20px; backdrop-filter: blur(8px);
  box-shadow: 0 18px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.06);
}
.hairline { height: 1px; background: linear-gradient(90deg, transparent, var(--line), transparent); }

/* ---------- 动效四档 ---------- */
.anim-pop { animation: pop .34s cubic-bezier(.34,1.56,.64,1) both; }
.anim-rise { animation: rise .5s cubic-bezier(.16,1,.3,1) both; }
.anim-fade { animation: fade .36s ease-out both; }
@keyframes pop { 0% { transform: scale(.8); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }
@keyframes rise { 0% { transform: translateY(26px); opacity: 0; } 100% { transform: translateY(0); opacity: 1; } }
@keyframes fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.floaty { animation: floaty 4s ease-in-out infinite; }
@keyframes spinIn { to { transform: rotate(360deg); } }

/* ============================================================
   游戏内 · 暖橙卡通保真主题（嘴瓢等，沿用原 PPT / demo 奶油橙）
   ============================================================ */
.theme-orange {
  --o-bg1: #fff6e6; --o-bg2: #ffe1ac; --o-bg3: #ffc871;
  --o1: #ff9f1c; --o2: #ffbf69; --o-deep: #e97b0c;
  --o-ink: #7a4a1e; --o-ink2: #a06a30;
  --o-card: #fffdf6; --o-card-line: #f0c98a;
  --o-green: #22b979; --o-green-d: #159a63;
  --o-red: #f2604f; --o-red-d: #d64433;
  --o-blue: #3f9dff;
  color: var(--o-ink);
}
.orange-stage {
  position: fixed; inset: 0; z-index: 0;
  background:
    radial-gradient(120% 80% at 50% -10%, #fffaf0 0%, var(--o-bg2) 42%, var(--o-bg3) 100%);
}
.orange-stage::before {
  content: ""; position: absolute; inset: 0;
  background: repeating-conic-gradient(from 0deg at 50% -20%, rgba(255,255,255,.22) 0deg 12deg, transparent 12deg 24deg);
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.5), transparent 60%);
          mask-image: linear-gradient(180deg, rgba(0,0,0,.5), transparent 60%);
}
.ocard {
  background: var(--o-card); border: 3px solid var(--o-card-line);
  border-radius: 26px; box-shadow: 0 12px 0 rgba(216,140,40,.18), 0 24px 50px rgba(180,110,20,.28);
}
.obtn {
  border: none; cursor: pointer; font-family: inherit; font-weight: 900;
  color: #fff; border-radius: 999px; padding: 16px 30px; font-size: 20px; letter-spacing: .05em;
  background: linear-gradient(180deg, var(--o1), var(--o-deep));
  box-shadow: 0 7px 0 var(--o-deep), 0 14px 24px rgba(216,110,10,.35);
  transition: transform .1s, box-shadow .1s;
}
.obtn:active { transform: translateY(5px); box-shadow: 0 2px 0 var(--o-deep), 0 6px 12px rgba(216,110,10,.3); }
.obtn.green { background: linear-gradient(180deg, #46d68f, var(--o-green-d)); box-shadow: 0 7px 0 var(--o-green-d), 0 14px 24px rgba(20,140,90,.3); }
.obtn.red { background: linear-gradient(180deg, #ff7d6e, var(--o-red-d)); box-shadow: 0 7px 0 var(--o-red-d), 0 14px 24px rgba(200,70,55,.3); }
.obtn.blue { background: linear-gradient(180deg, #63b4ff, #2f86e6); box-shadow: 0 7px 0 #2f86e6, 0 14px 24px rgba(40,120,210,.3); }
.obtn[disabled] { opacity: .45; pointer-events: none; }

/* 号码球 */
.ball {
  width: 84px; height: 84px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 30px; font-weight: 900; color: var(--o-deep);
  background: radial-gradient(circle at 32% 28%, #fff, #ffe2a6 55%, #ffb545);
  box-shadow: 0 6px 0 #e09a2e, 0 12px 22px rgba(200,120,20,.35), inset 0 -6px 10px rgba(220,140,40,.25);
  cursor: pointer; transition: transform .12s cubic-bezier(.34,1.56,.64,1);
}
.ball:active { transform: scale(.9); }
.ball.done {
  background: radial-gradient(circle at 32% 28%, #e7dfcf, #c9bfa8);
  color: #fff; box-shadow: 0 4px 0 #9b9178; cursor: default;
}
.ball.done::after { content: "✓"; font-size: 34px; }
.ball.done span { display: none; }
.ball.current { box-shadow: 0 0 0 5px #fff, 0 0 0 10px var(--o1), 0 10px 24px rgba(220,120,20,.5); }

/* 倒计时环 */
.ring { transform: rotate(-90deg); }
.ring .track { stroke: rgba(0,0,0,.12); }
.ring .bar { stroke: var(--o1); stroke-linecap: round; transition: stroke-dashoffset .2s linear; }

/* 撒花 */
.confetti { position: fixed; inset: 0; pointer-events: none; z-index: 60; overflow: hidden; }
.confetti i { position: absolute; top: -6vh; width: 12px; height: 18px; border-radius: 2px; animation: fall linear forwards; }
@keyframes fall { to { transform: translateY(112vh) rotate(720deg); } }

/* 滚动条 */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: rgba(140,120,80,.4); border-radius: 8px; }
::-webkit-scrollbar-track { background: transparent; }

.flex { display: flex; } .col { flex-direction: column; }
.center { align-items: center; justify-content: center; }
.between { justify-content: space-between; }
.gap8 { gap: 8px; } .gap12 { gap: 12px; } .gap16 { gap: 16px; } .gap24 { gap: 24px; }
.muted { color: var(--ink-dim); }
.tc { text-align: center; }

/* ============================================================
   游戏内主题 2/3/4 · 各游戏原 PPT 氛围（不做国风）
   ============================================================ */

/* ---------- 你比划我猜 · 绿蓝粉扁平孟菲斯（mint） ---------- */
.theme-mint {
  --gx-bg1: #eafdf7; --gx-bg2: #c6f0ea; --gx-bg3: #ffe9f2;
  --gx-green: #2ec4b6; --gx-blue: #4d9de0; --gx-pink: #ff5d8f; --gx-yellow: #ffd166; --gx-purple: #9b7ff0;
  --gx-ink: #124240; --gx-ink2: #477a77; --gx-card: #ffffff; --gx-line: #124240;
  --gx-accent: #2ec4b6; --gx-accent2: #ff5d8f;
  color: var(--gx-ink);
}
.mint-stage { position: fixed; inset: 0; z-index: 0; background: linear-gradient(160deg, #eafdf7, #c6f0ea 52%, #ffe9f2); }
.mint-stage::before { content: ""; position: absolute; inset: 0; opacity: .55;
  background-image:
    radial-gradient(circle at 8% 18%, var(--gx-pink) 0 26px, transparent 27px),
    radial-gradient(circle at 92% 12%, var(--gx-yellow) 0 34px, transparent 35px),
    radial-gradient(circle at 12% 88%, var(--gx-blue) 0 30px, transparent 31px),
    radial-gradient(circle at 88% 84%, var(--gx-green) 0 24px, transparent 25px),
    radial-gradient(circle at 70% 70%, transparent 16px, var(--gx-purple) 17px 19px, transparent 20px);
}
.mint-stage::after { content: ""; position: absolute; inset: 0; opacity: .25;
  background-image: repeating-linear-gradient(45deg, transparent 0 26px, var(--gx-blue) 26px 28px);
  -webkit-mask-image: linear-gradient(180deg, transparent, #000 30%, transparent 70%);
          mask-image: linear-gradient(180deg, transparent, #000 30%, transparent 70%); }

/* ---------- 台词猜猜看 · 影院（cinema） ---------- */
.theme-cinema {
  --gx-bg1: #140d14; --gx-bg2: #24101a; --gx-bg3: #3a121f;
  --gx-red: #d62839; --gx-gold: #e8c372; --gx-yellow: #f3dd9e;
  --gx-ink: #f6ead6; --gx-ink2: #b7a389; --gx-card: #21151d; --gx-line: #c9a25b;
  --gx-accent: #d62839; --gx-accent2: #e8c372;
  color: var(--gx-ink);
}
.cinema-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 90% at 50% -10%, #3a121f 0%, #1c0f16 55%, #0c070c 100%); }
.cinema-stage::before { content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(40% 30% at 50% 0%, rgba(232,195,114,.22), transparent 70%),
    repeating-linear-gradient(90deg, rgba(0,0,0,.28) 0 3px, transparent 3px 60px); }
.cinema-stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 26vh;
  background-image: radial-gradient(circle at 10% 0%, #e8c372 0 4px, transparent 5px),
    radial-gradient(circle at 30% 0%, #d62839 0 4px, transparent 5px),
    radial-gradient(circle at 50% 0%, #e8c372 0 4px, transparent 5px),
    radial-gradient(circle at 70% 0%, #d62839 0 4px, transparent 5px),
    radial-gradient(circle at 90% 0%, #e8c372 0 4px, transparent 5px);
  background-size: 120px 120px; opacity: .35; }

/* ---------- 眼疾手快 · 高饱和反应（react） ---------- */
.theme-react {
  --gx-bg1: #0d1030; --gx-bg2: #181556; --gx-bg3: #241b70;
  --gx-red: #e23b3b; --gx-green: #16a34a; --gx-yellow: #f5b700;
  --gx-ink: #ffffff; --gx-ink2: #aeb6e8; --gx-card: #1a1e52; --gx-line: #5a62ff;
  --gx-accent: #f5b700; --gx-accent2: #36e0c8;
  color: var(--gx-ink);
}
.react-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 100% at 50% 0%, #241b70 0%, #14134a 48%, #0a0d28 100%); }
.react-stage::before { content: ""; position: absolute; inset: 0; opacity: .35;
  background-image:
    radial-gradient(circle at 12% 20%, rgba(54,224,200,.5) 0 2px, transparent 3px),
    radial-gradient(circle at 84% 30%, rgba(245,183,0,.5) 0 2px, transparent 3px),
    radial-gradient(circle at 30% 80%, rgba(226,59,59,.4) 0 2px, transparent 3px),
    radial-gradient(circle at 72% 74%, rgba(90,98,255,.45) 0 2px, transparent 3px);
  background-size: 300px 300px; }

/* ---------- 看图猜成语 · 宣纸暖底书卷（chengyu） ---------- */
.theme-chengyu {
  --gx-bg1: #fbf3df; --gx-bg2: #f6e6c2; --gx-bg3: #f0d19a;
  --gx-red: #d9534f; --gx-gold: #e0a83a; --gx-yellow: #f6d878;
  --gx-ink: #38280f; --gx-ink2: #8a6c40; --gx-card: #fffdf6; --gx-line: #d8a13c;
  --gx-accent: #d9534f; --gx-accent2: #2e8b57;
  color: var(--gx-ink);
}
.chengyu-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 95% at 50% -10%, #fdf7e6 0%, #f6e6c2 55%, #eed6a6 100%); }
.chengyu-stage::before { content: ""; position: absolute; inset: 0; opacity: .5;
  background-image:
    radial-gradient(circle at 10% 18%, rgba(217,83,79,.10) 0 60px, transparent 61px),
    radial-gradient(circle at 88% 14%, rgba(46,139,87,.10) 0 70px, transparent 71px),
    radial-gradient(circle at 8% 82%, rgba(224,168,58,.12) 0 90px, transparent 91px),
    radial-gradient(circle at 92% 84%, rgba(217,83,79,.08) 0 80px, transparent 81px); }

/* ---------- 火眼金睛找异字 · 侦探警戒黄黑（zhaoyizi） ---------- */
.theme-zhaoyizi {
  --gx-bg1: #fff7d6; --gx-bg2: #ffe27a; --gx-bg3: #ffc73a;
  --gx-red: #ff5a36; --gx-gold: #f5a623; --gx-yellow: #ffd33d; --gx-green: #1faf63;
  --gx-ink: #1f1a10; --gx-ink2: #7a6a3a; --gx-card: #fffef6; --gx-line: #d9a416;
  --gx-accent: #ff5a36; --gx-accent2: #2563eb;
  color: var(--gx-ink);
}
.zhaoyizi-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 95% at 50% -12%, #fff8da 0%, #ffe27a 52%, #f7bd2e 100%); }
.zhaoyizi-stage::before { content: ""; position: absolute; inset: 0; opacity: .16;
  background-image:
    radial-gradient(circle at 16% 24%, transparent 0 64px, rgba(31,26,16,.28) 65px, rgba(31,26,16,.28) 74px, transparent 75px),
    radial-gradient(circle at 84% 78%, transparent 0 78px, rgba(31,26,16,.24) 79px, rgba(31,26,16,.24) 88px, transparent 89px); }
.zhaoyizi-stage::after { content: ""; position: absolute; inset: 0; opacity: .08;
  background-image: repeating-linear-gradient(0deg, var(--gx-ink) 0 2px, transparent 2px 26px); }

/* 什么不见了 · 动物图鉴记忆卡（清新薄荷奶油，不做国风） */
.theme-shenme {
  --gx-bg1: #ecfdf8; --gx-bg2: #c6f3e7; --gx-bg3: #8ee0ce;
  --gx-red: #f45b4e; --gx-gold: #f5b13d; --gx-yellow: #ffd76a; --gx-green: #16a874;
  --gx-ink: #0f3d34; --gx-ink2: #4a7a6e; --gx-card: #ffffff; --gx-line: #9fd9c9;
  --gx-accent: #0d9488; --gx-accent2: #f59e0b;
  color: var(--gx-ink);
}
.shenme-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 95% at 50% -12%, #f2fdfb 0%, #c9f3e9 50%, #8fe0ce 100%); }
.shenme-stage::before { content: ""; position: absolute; inset: 0; opacity: .14;
  background-image:
    radial-gradient(circle at 12% 20%, transparent 0 30px, rgba(15,61,52,.22) 31px, rgba(15,61,52,.22) 34px, transparent 35px),
    radial-gradient(circle at 88% 16%, transparent 0 24px, rgba(15,61,52,.18) 25px, rgba(15,61,52,.18) 28px, transparent 29px),
    radial-gradient(circle at 80% 88%, transparent 0 34px, rgba(15,61,52,.16) 35px, rgba(15,61,52,.16) 38px, transparent 39px); }

/* ============================================================
   新一批手机游戏主题 5-10 · 各游戏原 PPT 氛围（不做国风）
   ============================================================ */

/* ---------- 脑筋急转弯 · 机智灯泡综艺（brain） ---------- */
.theme-brain {
  --gx-bg1: #fdf3d6; --gx-bg2: #fbe08a; --gx-bg3: #f7c948;
  --gx-red: #ef4444; --gx-gold: #f59e0b; --gx-yellow: #fbbf24; --gx-green: #22c55e;
  --gx-blue: #2f6fed; --gx-pink: #ff7a45; --gx-purple: #7c5cf0;
  --gx-ink: #2a2470; --gx-ink2: #6d67a0; --gx-card: #fffdf6; --gx-line: #e8a33d;
  --gx-accent: #ff7a45; --gx-accent2: #2f6fed;
  color: var(--gx-ink);
}
.brain-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 95% at 50% -12%, #fef6d8 0%, #fbe08a 52%, #f3c54a 100%); }
.brain-stage::before { content: ""; position: absolute; inset: 0; opacity: .22;
  background-image:
    radial-gradient(circle at 12% 22%, var(--gx-blue) 0 20px, transparent 21px),
    radial-gradient(circle at 88% 18%, var(--gx-pink) 0 28px, transparent 29px),
    radial-gradient(circle at 16% 84%, var(--gx-green) 0 22px, transparent 23px),
    radial-gradient(circle at 86% 80%, var(--gx-purple) 0 18px, transparent 19px); }
.brain-stage::after { content: ""; position: absolute; inset: 0; opacity: .12;
  background-image: radial-gradient(circle, var(--gx-ink) 0 3px, transparent 4px);
  background-size: 150px 150px; }

/* ---------- 看图猜国家 · 环球旅行护照（travel） ---------- */
.theme-travel {
  --gx-bg1: #e8f6ff; --gx-bg2: #bfe3ff; --gx-bg3: #86c5f7;
  --gx-red: #ef4444; --gx-gold: #f59e0b; --gx-yellow: #facc15; --gx-green: #10b981;
  --gx-blue: #0ea5e9; --gx-pink: #fb7185; --gx-purple: #8b5cf6;
  --gx-ink: #0c3d5e; --gx-ink2: #47718f; --gx-card: #ffffff; --gx-line: #0ea5e9;
  --gx-accent: #f59e0b; --gx-accent2: #0284c7;
  color: var(--gx-ink);
}
.travel-stage { position: fixed; inset: 0; z-index: 0;
  background: linear-gradient(165deg, #eaf7ff 0%, #bfe3ff 50%, #8ec9f6 100%); }
.travel-stage::before { content: ""; position: absolute; inset: 0; opacity: .20;
  background-image:
    repeating-linear-gradient(0deg, transparent 0 86px, rgba(2,132,199,.25) 87px 88px),
    repeating-linear-gradient(90deg, transparent 0 120px, rgba(2,132,199,.22) 121px 122px); }
.travel-stage::after { content: ""; position: absolute; inset: 0; opacity: .18;
  background-image:
    radial-gradient(circle at 14% 20%, rgba(245,158,11,.55) 0 16px, transparent 17px),
    radial-gradient(circle at 82% 30%, rgba(239,68,68,.45) 0 12px, transparent 13px),
    radial-gradient(circle at 70% 82%, rgba(16,185,129,.5) 0 14px, transparent 15px); }

/* ---------- 猜泰国广告 · 泰式街头暖橙薄荷（thai） ---------- */
.theme-thai {
  --gx-bg1: #fff4e3; --gx-bg2: #ffd9a6; --gx-bg3: #ffb978;
  --gx-red: #e63946; --gx-gold: #ff9f1c; --gx-yellow: #ffd23f; --gx-green: #10b3a0;
  --gx-blue: #3aa0ff; --gx-pink: #ff7ab6; --gx-purple: #9b5de5;
  --gx-ink: #662d0f; --gx-ink2: #a3673a; --gx-card: #fffdf8; --gx-line: #ff8c42;
  --gx-accent: #ff6b35; --gx-accent2: #10b3a0;
  color: var(--gx-ink);
}
.thai-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(130% 100% at 50% -12%, #ffefd9 0%, #ffd29b 50%, #ffb066 100%); }
.thai-stage::before { content: ""; position: absolute; inset: 0; opacity: .16;
  background-image: repeating-conic-gradient(from 0deg at 50% -18%, rgba(255,107,53,.45) 0deg 12deg, transparent 12deg 24deg); }
.thai-stage::after { content: ""; position: absolute; inset: 0; opacity: .20;
  background-image:
    radial-gradient(circle at 12% 80%, rgba(16,179,160,.5) 0 30px, transparent 31px),
    radial-gradient(circle at 88% 78%, rgba(230,57,70,.4) 0 24px, transparent 25px),
    radial-gradient(circle at 24% 26%, rgba(255,210,63,.5) 0 18px, transparent 19px); }

/* ---------- 听前奏猜歌 · 霓虹演唱会（music） ---------- */
.theme-music {
  --gx-bg1: #1a0b2e; --gx-bg2: #2a1450; --gx-bg3: #3d1a6b;
  --gx-red: #ff4d6d; --gx-gold: #ffd166; --gx-yellow: #ffd166; --gx-green: #34d399;
  --gx-blue: #22d3ee; --gx-pink: #e84393; --gx-purple: #a855f7;
  --gx-ink: #f6ecff; --gx-ink2: #b79fd9; --gx-card: #261640; --gx-line: #a855f7;
  --gx-accent: #e84393; --gx-accent2: #22d3ee;
  color: var(--gx-ink);
}
.music-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 100% at 50% 0%, #43207a 0%, #2a1450 48%, #140a26 100%); }
.music-stage::before { content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(38% 34% at 18% 22%, rgba(232,67,147,.32), transparent 70%),
    radial-gradient(42% 38% at 82% 18%, rgba(34,211,238,.26), transparent 70%),
    radial-gradient(46% 40% at 50% 92%, rgba(168,85,247,.30), transparent 70%); }
.music-stage::after { content: ""; position: absolute; inset: 0; opacity: .30;
  background-image:
    radial-gradient(circle at 10% 30%, #fff 0 1.5px, transparent 2px),
    radial-gradient(circle at 30% 12%, #fff 0 1.5px, transparent 2px),
    radial-gradient(circle at 66% 24%, #fff 0 1.5px, transparent 2px),
    radial-gradient(circle at 88% 40%, #fff 0 1.5px, transparent 2px),
    radial-gradient(circle at 76% 72%, #fff 0 1.5px, transparent 2px),
    radial-gradient(circle at 22% 76%, #fff 0 1.5px, transparent 2px);
  background-size: 400px 400px; }
.theme-music .gx-card { box-shadow: 0 0 0 1px rgba(232,67,147,.18), 0 20px 60px rgba(0,0,0,.55); }

/* ---------- 听音乐猜动画 · 糖果童趣（toon） ---------- */
.theme-toon {
  --gx-bg1: #eaf6ff; --gx-bg2: #dcf3e6; --gx-bg3: #ffeef8;
  --gx-red: #ff6b6b; --gx-gold: #ffc93c; --gx-yellow: #ffd93d; --gx-green: #6bcb77;
  --gx-blue: #4d96ff; --gx-pink: #ff7ab6; --gx-purple: #9b7ff0;
  --gx-ink: #1f4d33; --gx-ink2: #5a8a6c; --gx-card: #ffffff; --gx-line: #5fc47f;
  --gx-accent: #ff7ab6; --gx-accent2: #3bb273;
  color: var(--gx-ink);
}
.toon-stage { position: fixed; inset: 0; z-index: 0;
  background: linear-gradient(150deg, #eaf6ff 0%, #dcf3e6 48%, #ffeef8 100%); }
.toon-stage::before { content: ""; position: absolute; inset: 0; opacity: .25;
  background-image:
    radial-gradient(circle at 12% 18%, var(--gx-pink) 0 34px, transparent 35px),
    radial-gradient(circle at 88% 14%, var(--gx-yellow) 0 44px, transparent 45px),
    radial-gradient(circle at 14% 86%, var(--gx-blue) 0 38px, transparent 39px),
    radial-gradient(circle at 86% 82%, var(--gx-green) 0 30px, transparent 31px),
    radial-gradient(circle at 70% 52%, var(--gx-purple) 0 22px, transparent 23px); }
.toon-stage::after { content: ""; position: absolute; inset: 0; opacity: .10;
  background-image: repeating-linear-gradient(45deg, transparent 0 30px, var(--gx-blue) 30px 32px); }

/* ---------- 谐音梗挑战 · 网络梗活力橙紫（homophone） ---------- */
.theme-homophone {
  --gx-bg1: #fff5ec; --gx-bg2: #ffe3d0; --gx-bg3: #ffcba3;
  --gx-red: #f43f5e; --gx-gold: #ffa726; --gx-yellow: #fbbf24; --gx-green: #22c55e;
  --gx-blue: #38bdf8; --gx-pink: #fb7185; --gx-purple: #7c3aed;
  --gx-ink: #4a1d6e; --gx-ink2: #8a5aa8; --gx-card: #fffdf8; --gx-line: #ff7043;
  --gx-accent: #ff5722; --gx-accent2: #7c3aed;
  color: var(--gx-ink);
}
.homophone-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(125% 95% at 50% -10%, #fff7ef 0%, #ffe1cc 52%, #ffc494 100%); }
.homophone-stage::before { content: ""; position: absolute; inset: 0; opacity: .18;
  background-image:
    radial-gradient(circle at 12% 24%, var(--gx-purple) 0 26px, transparent 27px),
    radial-gradient(circle at 88% 20%, var(--gx-pink) 0 32px, transparent 33px),
    radial-gradient(circle at 18% 82%, var(--gx-blue) 0 22px, transparent 23px),
    radial-gradient(circle at 84% 80%, var(--gx-gold) 0 28px, transparent 29px); }
.homophone-stage::after { content: ""; position: absolute; inset: 0; opacity: .10;
  background-image: radial-gradient(circle, var(--gx-ink) 0 4px, transparent 5px);
  background-size: 130px 130px; }

/* ---------- emoji猜历史人物 · 朱红书卷综艺（history；暖朱红+杏黄，非敦煌国风） ---------- */
.theme-history {
  --gx-bg1: #fbf0d9; --gx-bg2: #f6d9a8; --gx-bg3: #eeb873;
  --gx-red: #c0392b; --gx-gold: #e0a33a; --gx-yellow: #f4d35e; --gx-green: #5d8a4e;
  --gx-blue: #3b6ea5; --gx-pink: #cf6f8f; --gx-purple: #8a6d3b;
  --gx-ink: #4a2f1a; --gx-ink2: #93734a; --gx-card: #fffaf0; --gx-line: #c0392b;
  --gx-accent: #c0392b; --gx-accent2: #b8860b;
  color: var(--gx-ink);
}
.history-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 95% at 50% -12%, #fdf3dc 0%, #f7d79e 52%, #eeb469 100%); }
.history-stage::before { content: ""; position: absolute; inset: 0; opacity: .16;
  background-image:
    radial-gradient(circle at 10% 18%, var(--gx-red) 0 30px, transparent 31px),
    radial-gradient(circle at 90% 16%, var(--gx-gold) 0 34px, transparent 35px),
    radial-gradient(circle at 14% 86%, var(--gx-accent2) 0 24px, transparent 25px),
    radial-gradient(circle at 86% 82%, var(--gx-red) 0 26px, transparent 27px); }
.history-stage::after { content: ""; position: absolute; inset: 0; opacity: .10;
  background-image: radial-gradient(circle, var(--gx-ink) 0 4px, transparent 5px);
  background-size: 140px 140px; }

/* ---------- 通用游戏卡片 / 按钮（随主题变量） ---------- */
.gx-view { position: relative; z-index: 1; }
.gx-card { background: var(--gx-card); border: 3px solid var(--gx-line); border-radius: 24px; color: var(--gx-ink);
  box-shadow: 8px 8px 0 rgba(0,0,0,.18); }
.theme-cinema .gx-card, .theme-react .gx-card { box-shadow: 0 0 0 1px rgba(232,195,114,.15), 0 20px 60px rgba(0,0,0,.5); }
.gx-btn { border: 3px solid var(--gx-line); cursor: pointer; font-family: inherit; font-weight: 900;
  color: var(--gx-card); border-radius: 999px; padding: 16px 34px; font-size: 22px; letter-spacing: .05em;
  background: var(--gx-accent); box-shadow: 6px 6px 0 var(--gx-line); transition: transform .1s, box-shadow .1s; }
.gx-btn:active { transform: translate(4px, 4px); box-shadow: 2px 2px 0 var(--gx-line); }
.gx-btn.ghost { background: var(--gx-card); color: var(--gx-ink); }
.gx-btn[disabled] { opacity: .45; pointer-events: none; }

/* 大屏 HUD */
.gx-hud { position: fixed; top: 0; left: 0; right: 0; z-index: 20; display: flex; align-items: center; gap: 18px;
  padding: 20px 40px; font-weight: 900; }
.gx-hud .gx-title { font-size: 34px; letter-spacing: .06em; color: var(--gx-ink); }
.gx-hud .gx-spacer { flex: 1; }
.gx-pill { border: 2px solid var(--gx-line); border-radius: 999px; padding: 8px 22px; font-size: 22px;
  background: var(--gx-card); color: var(--gx-ink); }
.gx-pill b { color: var(--gx-accent2); }

/* 规则 / 居中页 */
.gx-center { position: relative; z-index: 2; min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column;
  align-items: center; justify-content: center; text-align: center; padding: 120px 60px 60px; }
.gx-big { font-size: 84px; font-weight: 900; line-height: 1.1; }
.gx-sub { font-size: 30px; color: var(--gx-ink2); margin-top: 20px; line-height: 1.6; }
.gx-rules { display: flex; gap: 18px; margin: 36px 0; flex-wrap: wrap; justify-content: center; }
.gx-rule { background: var(--gx-card); border: 3px solid var(--gx-line); border-radius: 18px; padding: 18px 28px;
  font-size: 26px; font-weight: 800; box-shadow: 5px 5px 0 rgba(0,0,0,.15); }

/* 大屏题干 / 倒计时 */
.gx-q { font-size: 62px; font-weight: 900; line-height: 1.35; max-width: 1400px; margin: 0 auto; }
.gx-src { font-size: 26px; color: var(--gx-accent2); margin-top: 18px; font-weight: 800; }
.gx-timer { height: 26px; border-radius: 999px; background: rgba(128,128,128,.25); overflow: hidden;
  border: 2px solid var(--gx-line); width: 70vw; margin: 40px auto 0; }
.gx-timer i { display: block; height: 100%; border-radius: 999px; background: var(--gx-accent); }
.gx-armed-num { font-size: 200px; font-weight: 900; color: var(--gx-accent); line-height: 1; animation: gxpulse 1s ease-in-out infinite; }
@keyframes gxpulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.gx-go { font-size: 200px; font-weight: 900; color: var(--gx-accent2); text-shadow: 0 0 80px currentColor; }

/* 媒体题面（看图 / 听音 / 看视频） */
.gx-media-stage { gap: 0; min-height: 0; justify-content: flex-start; padding-top: 6px; }
.gx-media { margin: 14px auto 0; display: flex; align-items: center; justify-content: center; }
.gx-media-img { width: min(64vh, 72vw); height: min(64vh, 72vw); display: flex; align-items: center; justify-content: center; }
.gx-media-img img { width: 100%; height: 100%; object-fit: contain; border-radius: 24px;
  background: #fff; padding: 24px; border: 6px solid var(--gx-line);
  box-shadow: 0 24px 60px rgba(0,0,0,.32); animation: gxPop .45s cubic-bezier(.2,.9,.3,1.3); }
/* 视频自适应：按 16:9 铺满，但给标题/计时/底栏留 240px，矮屏（720P 投影）也不裁切 */
.gx-media-video video { width: min(84vw, calc((100vh - 380px) * 16 / 9));
  max-height: min(70vh, calc(100vh - 380px)); aspect-ratio: 16 / 9;
  object-fit: contain; border-radius: 20px;
  border: 6px solid var(--gx-line); background: #000; box-shadow: 0 24px 60px rgba(0,0,0,.4); }
.gx-media-audio { flex-direction: column; gap: 22px; }
.gx-media-emoji { font-size: 170px; line-height: 1; animation: gxpulse 1.2s ease-in-out infinite;
  filter: drop-shadow(0 12px 30px rgba(0,0,0,.25)); }
.gx-media-audio .gx-media-tag { font-size: 42px; font-weight: 900; color: var(--gx-accent2); }
/* 纯文字谜面卡（脑筋急转弯/字谜等） */
.gx-media-riddle { width: min(1180px, 82vw); display: block; margin: 24px auto 0; }
.gx-riddle-quote { font-size: 120px; line-height: .4; color: var(--gx-accent2); opacity: .5;
  font-family: Georgia, serif; text-align: left; height: 52px; }
.gx-riddle-text { font-size: clamp(38px, 4.6vw, 64px); font-weight: 900; line-height: 1.55;
  color: #fff; text-align: center; padding: 30px 56px 46px; letter-spacing: .02em;
  background: linear-gradient(160deg, rgba(28,34,66,.90), rgba(16,20,44,.82));
  border: 2px solid rgba(245,205,130,.55); border-radius: 28px;
  box-shadow: 0 24px 60px rgba(0,0,0,.40), inset 0 1px 0 rgba(255,255,255,.18);
  text-shadow: 0 4px 18px rgba(0,0,0,.45); animation: gxPop .5s cubic-bezier(.2,.9,.3,1.3); }
.gx-riddle-quote { color: var(--gx-gold, #f5cd82); }
.gx-media-stage .gx-q { font-size: 46px; }
/* 纯文字谜面揭晓态：谜面在上答案在下，竖排居中 */
.gx-riddle-reveal { justify-content: flex-start; padding-top: 84px; }
.gx-riddle-reveal .gx-media-riddle { margin-top: 6px; width: min(1040px, 78vw); }
.gx-riddle-reveal .gx-riddle-text { font-size: clamp(34px, 3.6vw, 52px); padding: 24px 48px 34px; }
.gx-riddle-reveal .gx-ans-big { font-size: clamp(64px, 7vw, 96px); margin: 4px 0 10px; }
.gx-riddle-reveal .gx-rank { margin-top: 18px; }
.gx-media-stage .gx-timer { margin-top: 24px; }
.gx-reveal-row { display: flex; align-items: center; gap: 48px; max-width: 1500px; margin: 8px auto 0; }
.gx-reveal-row .gx-media-img { width: 40vh; height: 40vh; flex: none; }
.gx-answer-card { flex: 1; text-align: left; min-width: 360px; }
.gx-answer-label { font-size: 34px; font-weight: 800; color: var(--gx-ink2); letter-spacing: .2em; }
.gx-answer-word { font-size: 104px; font-weight: 900; color: var(--gx-accent2); line-height: 1.12;
  margin: 8px 0; text-shadow: 0 8px 0 rgba(0,0,0,.10); animation: gxPop .5s cubic-bezier(.2,.9,.3,1.3); }
.gx-answer-card .gx-src { font-size: 26px; }
@keyframes gxPop { 0% { transform: scale(.7); opacity: 0; } 100% { transform: scale(1); opacity: 1; } }

/* 媒体题逐字答案（大屏） */
.gx-ans-big { display: flex; flex-wrap: wrap; gap: 16px; }
.gx-ans-big .aw { min-width: 96px; padding: 4px 16px; border-radius: 22px; text-align: center;
  color: var(--gx-card); background: linear-gradient(160deg, var(--gx-gold), var(--gx-accent));
  border: 4px solid var(--gx-line); box-shadow: 0 10px 0 rgba(0,0,0,.12);
  animation: gxPop .5s cubic-bezier(.2,.9,.3,1.3) both; }
.gx-ans-big .aw:nth-child(1){animation-delay:.03s}.gx-ans-big .aw:nth-child(2){animation-delay:.13s}
.gx-ans-big .aw:nth-child(3){animation-delay:.23s}.gx-ans-big .aw:nth-child(4){animation-delay:.33s}
.gx-ans-big .aw:nth-child(5){animation-delay:.43s}.gx-ans-big .aw:nth-child(6){animation-delay:.53s}
.gx-ans-big .aw:nth-child(n+7){animation-delay:.62s}

/* 大屏抢答光圈 */
.gx-buzz-stage { }
.gx-buzz-big { position: relative; width: 320px; height: 320px; margin: 20px auto; display: flex;
  align-items: center; justify-content: center; border-radius: 50%;
  background: radial-gradient(circle at 50% 35%, #ff7a5c 0%, var(--gx-accent) 55%, #b3322c 100%);
  box-shadow: 0 18px 0 #8f2620, 0 30px 60px rgba(0,0,0,.3); }
.gx-buzz-big-txt { position: relative; z-index: 2; color: #fff; font-size: 86px; font-weight: 900;
  letter-spacing: .14em; text-shadow: 0 5px 10px rgba(0,0,0,.35); }
.gx-buzz-big-ring { position: absolute; inset: 0; border-radius: 50%; border: 8px solid rgba(255,255,255,.75);
  animation: gxBigRing 1.2s ease-out infinite; }
@keyframes gxBigRing { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.5); opacity: 0; } }
/* 大屏抢到者名牌 */
.gx-grabbed { margin-top: 26px; padding: 40px 80px; border-radius: 36px; text-align: center;
  background: rgba(47,191,113,.12); border: 6px solid #2fbf71; box-shadow: 0 16px 0 rgba(0,0,0,.1);
  animation: gxPop .4s cubic-bezier(.2,.9,.3,1.3); }
.gx-grabbed-name { font-size: 96px; font-weight: 900; color: #2fbf71; line-height: 1.1; }
.gx-grabbed-tag { font-size: 42px; font-weight: 800; color: var(--gx-ink); margin-top: 12px; }
.gx-grabbed-unit { font-size: 30px; color: var(--gx-ink2); margin-top: 6px; }

/* 四选项（choice） */
.gx-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; max-width: 1200px; margin: 50px auto 0; }
.gx-opt { position: relative; display: flex; align-items: center; gap: 22px; text-align: left;
  background: var(--gx-card); border: 4px solid var(--gx-line); border-radius: 26px; padding: 34px 36px;
  font-size: 40px; font-weight: 800; color: var(--gx-ink); font-family: inherit; }
.gx-opt .gx-letter { width: 70px; height: 70px; flex: none; border-radius: 50%; border: 4px solid var(--gx-accent);
  color: var(--gx-accent); display: flex; align-items: center; justify-content: center; font-size: 36px; font-weight: 900; }
.gx-opt.correct { border-color: #2fbf71; background: rgba(47,191,113,.18); }
.gx-opt.correct .gx-letter { background: #2fbf71; border-color: #2fbf71; color: #fff; }
.gx-opt.wrong { border-color: #e2483d; background: rgba(226,72,61,.16); }

/* 三色按钮（react） */
.gx-colors { display: flex; gap: 40px; justify-content: center; margin: 60px 0 0; }
.gx-cbtn { width: 220px; height: 220px; border-radius: 50%; border: 8px solid rgba(255,255,255,.35);
  font-size: 56px; font-weight: 900; color: #fff; font-family: inherit; cursor: pointer;
  box-shadow: 0 16px 40px rgba(0,0,0,.45), inset 0 -14px 0 rgba(0,0,0,.18); transition: transform .08s; }
.gx-cbtn:active { transform: scale(.92); }
.gx-cbtn[disabled] { opacity: .4; filter: grayscale(.4); }

/* 揭晓 / 排行榜 */
.gx-answer { font-size: 72px; font-weight: 900; color: #2fbf71; margin-top: 26px; }
.gx-answer.wrong { color: #e2483d; }
.gx-rank { width: 100%; max-width: 1100px; display: flex; flex-direction: column; gap: 16px; margin-top: 40px; }
.gx-rankrow { display: flex; align-items: center; gap: 22px; background: var(--gx-card); border: 3px solid var(--gx-line);
  border-radius: 20px; padding: 18px 30px; font-size: 32px; font-weight: 800; }
.gx-rankrow .gx-rk { font-size: 40px; width: 70px; text-align: center; }
.gx-rankrow .gx-nm { flex: 1; text-align: left; }
.gx-rankrow .gx-pt { font-size: 38px; font-weight: 900; color: var(--gx-accent2); }
.gx-rankrow.r1 { background: linear-gradient(180deg, var(--gx-yellow), #f0b82c); border-color: var(--gx-ink); transform: scale(1.04); }

/* ---------- 手机端 · 手机参与游戏 ---------- */
.gx-m { position: relative; z-index: 2; padding: 0 4px; }
.gx-m-state { position: relative; z-index: 2; }
.gx-m-q { font-size: 24px; font-weight: 900; line-height: 1.5; margin: 6px 0 14px; }
.gx-m-media { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0 0 14px; }
.gx-m-media img { width: 240px; max-width: 62vw; height: 240px; max-height: 34vh; object-fit: contain;
  background: #fff; border: 3px solid var(--gx-line); border-radius: 16px; padding: 12px;
  box-shadow: 0 10px 24px rgba(0,0,0,.18); animation: gxPop .4s cubic-bezier(.2,.9,.3,1.3); }
.gx-m-media video { width: 100%; border-radius: 14px; border: 3px solid var(--gx-line); background: #000; }
.gx-m-emoji { font-size: 80px; line-height: 1; animation: gxpulse 1.2s ease-in-out infinite; }
.gx-m-audio-tag { font-size: 18px; font-weight: 900; color: var(--gx-accent2); margin-top: 6px; }
/* 手机端 · 纯文字谜面卡 */
.gx-m-riddle { width: 100%; display: block; margin: 4px 0 18px; box-sizing: border-box;
  background: linear-gradient(160deg, rgba(28,34,66,.92), rgba(16,20,44,.84));
  border: 1.5px solid rgba(245,205,130,.55); border-radius: 20px; padding: 20px 22px 26px;
  box-shadow: 0 12px 30px rgba(20,16,40,.28), inset 0 1px 0 rgba(255,255,255,.12);
  animation: gxPop .45s cubic-bezier(.2,.9,.3,1.3); }
.gx-m-riddle-quote { font-size: 54px; line-height: .5; color: var(--gx-gold, #f5cd82); opacity: .85;
  font-family: Georgia, serif; height: 26px; }
.gx-m-riddle-text { font-size: clamp(23px, 6.4vw, 31px); font-weight: 900; line-height: 1.62;
  color: #fff; text-align: center; letter-spacing: .01em; text-shadow: 0 2px 8px rgba(0,0,0,.35); }
.gx-m-opts { display: flex; flex-direction: column; gap: 14px; }
.gx-m-opt { display: flex; align-items: center; gap: 14px; text-align: left; width: 100%;
  background: var(--gx-card); border: 2.5px solid var(--gx-line); border-radius: 18px; padding: 18px;
  font-size: 19px; font-weight: 800; color: var(--gx-ink); font-family: inherit; }
.gx-m-opt .gx-letter { width: 40px; height: 40px; flex: none; border-radius: 50%; border: 2.5px solid var(--gx-accent);
  color: var(--gx-accent); display: flex; align-items: center; justify-content: center; font-weight: 900; }
.gx-m-opt.correct { border-color: #2fbf71; background: rgba(47,191,113,.18); }
.gx-m-opt.wrong { border-color: #e2483d; background: rgba(226,72,61,.16); }
.gx-m-opt:disabled { opacity: .85; }
.gx-m-colors { display: flex; gap: 16px; justify-content: center; margin: 26px 0; }
.gx-m-cbtn { width: 96px; height: 96px; border-radius: 50%; border: 5px solid rgba(255,255,255,.3);
  font-size: 30px; font-weight: 900; color: #fff; font-family: inherit; }
.gx-m-cbtn:disabled { opacity: .4; }
.gx-m-timer { height: 16px; border-radius: 999px; background: rgba(128,128,128,.25); overflow: hidden; margin: 16px 0; }
.gx-m-timer i { display: block; height: 100%; background: var(--gx-accent); }
.gx-m-state { text-align: center; padding: 30px 10px; }
.gx-m-state .big { font-size: 30px; font-weight: 900; text-wrap: balance; }
.gx-m-count { font-size: 120px; font-weight: 900; color: var(--gx-accent); line-height: 1; }

/* ---------- 你比划我猜 · 双视角 ---------- */
.ch-audience { position: relative; z-index: 2; min-height: 100vh; box-sizing: border-box; display: flex; flex-direction: column;
  align-items: center; justify-content: center; padding: 120px 40px 60px; text-align: center; }
.ch-performer { font-size: 40px; font-weight: 900; color: var(--gx-pink); margin-bottom: 12px; }
.ch-time { font-size: 150px; font-weight: 900; line-height: 1; color: var(--gx-accent); }
.ch-got { font-size: 120px; font-weight: 900; color: var(--gx-green); line-height: 1; }
.ch-pass { font-size: 120px; font-weight: 900; color: var(--gx-blue); line-height: 1; }
.ch-audtip { font-size: 44px; font-weight: 800; color: var(--gx-ink); margin-top: 20px; }
.ch-word { font-size: 120px; font-weight: 900; line-height: 1.1; color: var(--gx-ink);
  background: var(--gx-card); border: 6px solid var(--gx-line); border-radius: 30px; padding: 30px 60px;
  box-shadow: 10px 10px 0 var(--gx-line); }
.ch-hint { font-size: 34px; color: var(--gx-ink2); margin-top: 30px; font-weight: 700; max-width: 900px; }
.ch-actions { display: flex; gap: 26px; margin-top: 50px; }
.ch-m-word { font-size: 60px; font-weight: 900; text-align: center; background: var(--gx-card);
  border: 5px solid var(--gx-line); border-radius: 24px; padding: 26px 18px; box-shadow: 6px 6px 0 var(--gx-line); }
.ch-m-hint { font-size: 19px; color: var(--gx-ink2); text-align: center; margin: 18px 0 24px; line-height: 1.5; }
.ch-m-actions { display: flex; gap: 12px; }
.ch-m-actions .gx-btn { flex: 1; padding: 18px 10px; font-size: 22px; }
.ch-m-stat { display: flex; gap: 12px; justify-content: center; margin: 18px 0; }
.ch-m-stat .gx-pill { font-size: 18px; padding: 8px 16px; }

/* ============ 媒体题：拼字 / 打字 / 抢答（assemble / type / buzz） ============ */
.gx-m-modebadge { display: inline-block; margin-top: 18px; padding: 8px 22px; border-radius: 999px;
  font-size: 18px; font-weight: 800; color: var(--gx-card); background: var(--gx-accent);
  box-shadow: 0 4px 0 var(--gx-line); }
.gx-m-mediaarm { text-align: center; }
.gx-m-mediaarm .gx-m-media img { width: 250px; height: 250px; }

/* 拼字答案槽 */
.gx-slots { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin: 6px 0 16px; }
.gx-slot { width: 58px; height: 66px; border-radius: 14px; border: 3px dashed var(--gx-line);
  background: rgba(255,255,255,.55); color: var(--gx-ink); font-size: 34px; font-weight: 900;
  font-family: inherit; display: flex; align-items: center; justify-content: center; padding: 0;
  transition: transform .08s ease, background .12s ease; }
.gx-slot.filled { border-style: solid; background: var(--gx-card); box-shadow: 0 3px 0 var(--gx-line);
  animation: gxTilePop .18s ease; }
.gx-slot.filled:active { transform: scale(.92); }
/* 字库 */
.gx-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 0 auto 16px; max-width: 360px; }
.gx-tile { border-radius: 14px; border: 3px solid var(--gx-line); background: var(--gx-card);
  color: var(--gx-ink); font-size: 30px; font-weight: 900; font-family: inherit; height: 60px;
  padding: 0; box-shadow: 0 4px 0 var(--gx-line); transition: transform .08s ease, opacity .12s ease;
  animation: gxTileIn .22s ease both; }
.gx-tile:active { transform: translateY(3px); box-shadow: 0 1px 0 var(--gx-line); }
.gx-tile.used { opacity: .28; pointer-events: none; transform: scale(.92); }
@keyframes gxTileIn { from { opacity: 0; transform: translateY(10px) scale(.85); } to { opacity: 1; transform: none; } }
@keyframes gxTilePop { 0% { transform: scale(.7); } 60% { transform: scale(1.12); } 100% { transform: scale(1); } }
.gx-slots.shake { animation: gxShake .4s ease; }
@keyframes gxShake { 0%,100% { transform: translateX(0); } 20% { transform: translateX(-8px); }
  40% { transform: translateX(8px); } 60% { transform: translateX(-6px); } 80% { transform: translateX(6px); } }

/* 提交按钮通用 */
.gx-m-submit { display: block; width: 100%; max-width: 360px; margin: 0 auto; padding: 16px; border-radius: 16px;
  border: 3px solid var(--gx-line); font-family: inherit; font-size: 24px; font-weight: 900;
  background: rgba(128,128,128,.22); color: var(--gx-ink2); box-shadow: 0 5px 0 rgba(0,0,0,.12);
  transition: transform .1s ease, box-shadow .1s ease; }
.gx-m-submit.ready { background: var(--gx-accent); color: var(--gx-card); box-shadow: 0 5px 0 var(--gx-line);
  animation: gxGlow 1.1s ease-in-out infinite; }
.gx-m-submit.ready:active { transform: translateY(4px); box-shadow: 0 1px 0 var(--gx-line); }
.gx-m-submit[disabled] { pointer-events: none; }
@keyframes gxGlow { 0%,100% { filter: brightness(1); } 50% { filter: brightness(1.12); } }

/* 已答对锁定态 */
.gx-m-done { text-align: center; }
.gx-done-ic { width: 104px; height: 104px; margin: 6px auto 18px; border-radius: 50%;
  background: radial-gradient(circle at 50% 40%, #46d98a, #1fa864);
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 58px; font-weight: 900;
  box-shadow: 0 10px 24px rgba(31,168,100,.38), inset 0 2px 6px rgba(255,255,255,.4);
  animation: gxDonePop .45s cubic-bezier(.2,1.4,.4,1); }
@keyframes gxDonePop { 0% { transform: scale(.3); opacity: 0; } 60% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }

/* 打字输入 */
.gx-m-typebox { display: flex; gap: 10px; margin: 6px 0 4px; }
.gx-m-input { flex: 1; min-width: 0; height: 60px; border-radius: 14px; border: 3px solid var(--gx-line);
  background: var(--gx-card); color: var(--gx-ink); font-size: 26px; font-weight: 800; font-family: inherit;
  padding: 0 18px; box-shadow: inset 0 2px 6px rgba(0,0,0,.08); }
.gx-m-input:focus { outline: none; border-color: var(--gx-accent); }
.gx-m-typebox .gx-m-submit { width: auto; max-width: none; margin: 0; padding: 0 26px; height: 60px; font-size: 22px; }
.gx-m-type .gx-m-media img { width: 200px; height: 200px; }

/* 图上点选（找异字 / 找不同）网格 */
.gx-m-spot { text-align: center; display: flex; flex-direction: column; justify-content: center; min-height: 72vh; }
.gx-spot-grid { display: grid; gap: 7px; margin: 14px auto; width: 100%; max-width: 384px; }
.gx-spot-cell { aspect-ratio: 1 / 1; border-radius: 12px; border: 2px solid var(--gx-line);
  background: var(--gx-card); color: var(--gx-ink); font-weight: 900; font-family: inherit;
  display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; line-height: 1;
  box-shadow: 0 3px 0 rgba(0,0,0,.12), 0 2px 6px rgba(0,0,0,.08);
  transition: transform .08s ease, box-shadow .08s ease, background .15s, border-color .15s; }
.gx-spot-cell:active { transform: translateY(2px); box-shadow: 0 1px 0 rgba(0,0,0,.12); }
.gx-spot-cell.wrong { border-color: #e2483d; background: rgba(226,72,61,.16); color: #e2483d; animation: spotShake .3s ease; }
.gx-spot-cell.answer { border-color: #2fbf71; background: linear-gradient(145deg,#46d188,#22a861); color: #fff;
  box-shadow: 0 0 0 3px rgba(47,191,113,.25), 0 6px 16px rgba(34,168,97,.4); animation: spotPop .42s cubic-bezier(.2,1.4,.4,1); }
.gx-spot-cell.mine { border-color: var(--gx-accent); }
@keyframes spotShake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-4px)} 75%{transform:translateX(4px)} }
@keyframes spotPop { 0%{transform:scale(.6)} 70%{transform:scale(1.12)} 100%{transform:scale(1)} }


/* 大屏·图上点选字阵 */
.gx-spot-stage { gap: 0; }
.gx-spot-board { display: grid; gap: 12px; margin: 30px auto 6px; }
.gx-sb-cell { aspect-ratio: 1 / 1; border-radius: 18px; border: 3px solid var(--gx-line);
  background: var(--gx-card); color: var(--gx-ink); font-weight: 900; line-height: 1;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 0 rgba(0,0,0,.12), 0 10px 24px rgba(0,0,0,.12); }
.gx-sb-cell.answer { border-color: #2fbf71; background: linear-gradient(145deg,#46d188,#1fa35c); color: #fff;
  box-shadow: 0 0 0 6px rgba(47,191,113,.28), 0 14px 40px rgba(34,168,97,.5); animation: spotPopBig .5s cubic-bezier(.2,1.4,.4,1); }
@keyframes spotPopBig { 0%{transform:scale(.5)} 70%{transform:scale(1.1)} 100%{transform:scale(1)} }


/* 记忆观察（什么不见了）手机端 */
.gx-m-mem { text-align: center; display: flex; flex-direction: column; justify-content: center; min-height: 70vh; }
.gx-mem-tip { font-size: 21px; font-weight: 900; color: var(--gx-ink); margin-bottom: 12px;
  display: flex; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
.gx-mem-tip .gx-mem-eye { font-size: 24px; }
.gx-mem-tagsub { font-size: 14px; font-weight: 700; color: var(--gx-ink2); background: rgba(13,148,136,.12);
  padding: 3px 10px; border-radius: 999px; }
.gx-mem-grid { display: grid; gap: 8px; margin: 4px auto 14px; width: 100%; max-width: 380px; }
.gx-mem-cell { aspect-ratio: 1 / 1; border-radius: 14px; background: #fff;
  border: 2px solid var(--gx-line); display: flex; align-items: center; justify-content: center;
  box-shadow: 0 3px 0 rgba(13,108,95,.14), 0 2px 6px rgba(13,108,95,.08); line-height: 1; }
.gx-mem-cell { font-size: 40px; }
.gx-mem-cell.gone { border: 2px dashed #f59e0b; background: repeating-linear-gradient(45deg,#fff8ec,#fff8ec 8px,#fdeecb 8px,#fdeecb 16px); }
.gx-mem-q { font-size: 34px; font-weight: 900; color: #f59e0b; animation: memQ 1.1s ease-in-out infinite; }
.gx-mem-cell.answer { border-color: #16a874; background: linear-gradient(145deg,#46d99a,#15a06f);
  box-shadow: 0 0 0 3px rgba(22,168,116,.28), 0 6px 16px rgba(21,160,111,.42); animation: memPop .5s cubic-bezier(.2,1.4,.4,1); }
.gx-mem-gone { font-size: 40px; animation: memPop .5s cubic-bezier(.2,1.4,.4,1); }
.gx-mem-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 2px auto 4px; width: 100%; max-width: 380px; }
.gx-mem-opt { aspect-ratio: 16 / 10; border-radius: 16px; border: 2px solid var(--gx-line); background: #fff;
  font-size: 46px; line-height: 1; display: flex; align-items: center; justify-content: center; cursor: pointer;
  font-family: inherit; padding: 0; box-shadow: 0 3px 0 rgba(13,108,95,.16), 0 2px 8px rgba(13,108,95,.1);
  transition: transform .08s ease, box-shadow .08s ease, background .15s; }
.gx-mem-opt:active { transform: translateY(2px) scale(.98); box-shadow: 0 1px 0 rgba(13,108,95,.16); }
.gx-mem-opt.correct { border-color: #16a874; background: linear-gradient(145deg,#46d99a,#15a06f); color: #fff;
  box-shadow: 0 0 0 3px rgba(22,168,116,.28), 0 6px 18px rgba(21,160,111,.45); animation: memPop .5s cubic-bezier(.2,1.4,.4,1); }
.gx-mem-opt.wrong { border-color: #e2483d; background: rgba(226,72,61,.16); opacity: .7; }
@keyframes memQ { 0%,100%{transform:scale(1);opacity:.7} 50%{transform:scale(1.18);opacity:1} }
@keyframes memPop { 0%{transform:scale(.5)} 70%{transform:scale(1.14)} 100%{transform:scale(1)} }


/* 记忆观察（什么不见了）大屏端 */
.gx-mem-stage { gap: 0; }
.gx-mem-tiptitle { font-size: 42px; font-weight: 900; color: var(--gx-ink); margin-bottom: 22px; }
.gx-mem-board { display: grid; gap: 14px; margin: 10px auto 18px; max-width: 720px; }
.gx-mb-cell { aspect-ratio: 1 / 1; border-radius: 22px; background: #fff; border: 3px solid var(--gx-line);
  display: flex; align-items: center; justify-content: center; line-height: 1;
  box-shadow: 0 6px 0 rgba(13,108,95,.12), 0 12px 26px rgba(13,108,95,.14); }
.gx-mb-cell.gone { border: 3px dashed #f59e0b; background: repeating-linear-gradient(45deg,#fff8ec,#fff8ec 14px,#fdeecb 14px,#fdeecb 28px); }
.gx-mb-q { font-size: 72px; font-weight: 900; color: #f59e0b; animation: memQ 1.2s ease-in-out infinite; }
.gx-mb-cell.answer { border-color: #16a874; background: linear-gradient(145deg,#46d99a,#13966a);
  box-shadow: 0 0 0 7px rgba(22,168,116,.26), 0 16px 44px rgba(21,160,111,.5); animation: memPopBig .55s cubic-bezier(.2,1.4,.4,1); }
.gx-mb-gone { animation: memPopBig .55s cubic-bezier(.2,1.4,.4,1); }
.gx-mem-answerline { font-size: 38px; font-weight: 900; color: var(--gx-ink); margin-top: 6px; }
.gx-mem-big { font-size: 66px; vertical-align: middle; color: #16a874; margin-left: 8px; }
@keyframes memPopBig { 0%{transform:scale(.5)} 70%{transform:scale(1.12)} 100%{transform:scale(1)} }


/* ============================================================
   过目不忘 · 排排坐顺序记忆（暖橙糖果卡，不做国风，一款一视觉）
   ============================================================ */
.theme-guomu {
  --gx-bg1: #fff7ee; --gx-bg2: #ffe2c2; --gx-bg3: #ffc98f;
  --gx-red: #f45b4e; --gx-gold: #f5a83d; --gx-yellow: #ffd76a; --gx-green: #16a874;
  --gx-ink: #4a2a0e; --gx-ink2: #8a6240; --gx-card: #ffffff; --gx-line: #f2c49a;
  --gx-accent: #ea7a1f; --gx-accent2: #ef4444;
  color: var(--gx-ink);
}
.guomu-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(120% 95% at 50% -12%, #fff9f1 0%, #ffe3c3 52%, #ffc98f 100%); }
.guomu-stage::before { content: ""; position: absolute; inset: 0; opacity: .12;
  background-image:
    radial-gradient(circle at 10% 18%, transparent 0 26px, rgba(234,122,31,.28) 27px, rgba(234,122,31,.28) 30px, transparent 31px),
    radial-gradient(circle at 90% 14%, transparent 0 20px, rgba(234,122,31,.24) 21px, rgba(234,122,31,.24) 24px, transparent 25px),
    radial-gradient(circle at 82% 86%, transparent 0 30px, rgba(234,122,31,.2) 31px, rgba(234,122,31,.2) 34px, transparent 35px); }

/* 手机：一排顺序卡 */
.gx-mem-order { max-width: 400px; gap: 7px; }
.gx-mem-order .gx-mem-cell { position: relative; font-size: 29px; border-radius: 13px;
  border-color: #f2c49a; box-shadow: 0 4px 10px rgba(180,110,40,.14); }
.gx-mem-idx { position: absolute; top: 2px; left: 5px; font-size: 10px; font-weight: 900;
  color: #c9741a; background: rgba(234,122,31,.14); border-radius: 7px; padding: 0 4px; line-height: 14px; }
.gx-mem-order .gx-mem-cell.covered { border: 2px solid #f0cd9f;
  background: repeating-linear-gradient(45deg,#fff6ec,#fff6ec 7px,#fde6cd 7px,#fde6cd 14px); }
.gx-mem-order .gx-mem-cell.ask { border: 2px dashed #ef4444;
  background: repeating-linear-gradient(45deg,#fff0ec,#fff0ec 7px,#ffd9d0 7px,#ffd9d0 14px);
  box-shadow: 0 0 0 3px rgba(239,68,68,.2), 0 4px 12px rgba(239,68,68,.25); }
.gx-mem-ask { font-size: 30px; font-weight: 900; color: #ef4444; animation: guomuAsk 1s ease-in-out infinite; }
.gx-mem-order .gx-mem-cell.answer { border-color: #16a874; background: linear-gradient(145deg,#46d99a,#15a06f);
  box-shadow: 0 0 0 3px rgba(22,168,116,.28), 0 6px 16px rgba(21,160,111,.42); animation: memPop .5s cubic-bezier(.2,1.4,.4,1); }
.gx-mem-order .gx-mem-cell.answer .gx-mem-idx { background: rgba(255,255,255,.28); color: #fff; }
@keyframes guomuAsk { 0%,100%{transform:scale(1);opacity:.75} 50%{transform:scale(1.22);opacity:1} }
.gx-m-guomu .gx-mem-tip { color: #9a4a0c; }
.gx-m-guomu .gx-mem-tagsub { background: rgba(234,122,31,.14); color: #c9741a; }

/* 大屏：横排顺序卡 */
.gx-mem-order-bd { max-width: 980px; gap: 18px; }
.gx-mem-order-bd .gx-mb-cell { position: relative; border-color: #f2c49a;
  box-shadow: 0 12px 30px rgba(180,110,40,.18); }
.gx-mb-idx { position: absolute; top: 10px; left: 14px; font-size: 24px; font-weight: 900;
  color: #c9741a; background: rgba(234,122,31,.14); border-radius: 10px; padding: 0 10px; line-height: 32px; }
.gx-mem-order-bd .gx-mb-cell.covered { border: 3px solid #f0cd9f;
  background: repeating-linear-gradient(45deg,#fff6ec,#fff6ec 13px,#fde6cd 13px,#fde6cd 26px); }
.gx-mem-order-bd .gx-mb-cell.ask { border: 4px dashed #ef4444;
  background: repeating-linear-gradient(45deg,#fff0ec,#fff0ec 13px,#ffd9d0 13px,#ffd9d0 26px);
  box-shadow: 0 0 0 8px rgba(239,68,68,.16), 0 16px 40px rgba(239,68,68,.28); }
.gx-mb-ask { font-size: 76px; font-weight: 900; color: #ef4444; animation: guomuAsk 1.1s ease-in-out infinite; }
.gx-mem-order-bd .gx-mb-cell.answer .gx-mb-idx { background: rgba(255,255,255,.28); color: #fff; }


/* 抢答大按钮 */
.gx-m-buzz { text-align: center; }
.gx-buzz-btn { position: relative; width: 210px; height: 210px; border-radius: 50%; border: none; margin: 24px auto 10px;
  display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
  background: radial-gradient(circle at 50% 35%, #ff7a5c 0%, var(--gx-accent) 55%, #b3322c 100%);
  box-shadow: 0 12px 0 #8f2620, 0 18px 30px rgba(0,0,0,.3); font-family: inherit; }
.gx-buzz-btn:active { transform: translateY(8px); box-shadow: 0 4px 0 #8f2620, 0 8px 16px rgba(0,0,0,.3); }
.gx-buzz-txt { position: relative; z-index: 2; color: #fff; font-size: 52px; font-weight: 900; letter-spacing: .12em;
  text-shadow: 0 3px 6px rgba(0,0,0,.35); }
.gx-buzz-ring { position: absolute; inset: 0; border-radius: 50%; border: 6px solid rgba(255,255,255,.7);
  animation: gxRing 1.3s ease-out infinite; }
@keyframes gxRing { 0% { transform: scale(1); opacity: .8; } 100% { transform: scale(1.45); opacity: 0; } }
.gx-buzz-win { margin-top: 18px; padding: 30px 20px; border-radius: 24px; background: rgba(47,191,113,.14);
  border: 3px solid #2fbf71; }
.gx-buzz-win-ttl { font-size: 46px; font-weight: 900; color: #2fbf71; animation: gxTilePop .3s ease; }
.gx-buzz-win-sub { font-size: 24px; font-weight: 700; margin-top: 10px; color: var(--gx-ink); }
.gx-buzz-wait { margin-top: 18px; font-size: 18px; color: var(--gx-ink2); display: flex; align-items: center; justify-content: center; gap: 8px; }
.gx-buzz-wait .dot { width: 10px; height: 10px; border-radius: 50%; background: #2fbf71; animation: gxBlink 1s infinite; }
@keyframes gxBlink { 0%,100% { opacity: .25; } 50% { opacity: 1; } }
.gx-buzz-lost { margin-top: 24px; padding: 34px 20px; border-radius: 24px; background: rgba(128,128,128,.12);
  border: 3px solid rgba(128,128,128,.3); }
.gx-buzz-lost-name { font-size: 34px; font-weight: 900; color: var(--gx-ink); }
.gx-buzz-lost-sub { font-size: 19px; color: var(--gx-ink2); margin-top: 10px; }

/* 揭晓答案大字 */
.gx-m-reveal { text-align: center; }
.gx-m-answord { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin: 14px 0 6px;
  width: 100%; max-width: 100%; box-sizing: border-box; }
.gx-m-answord .aw { flex: 0 0 auto; min-width: 0; height: clamp(56px, 15vw, 72px); padding: 0 clamp(6px, 2vw, 10px);
  border-radius: clamp(12px, 3.5vw, 16px); display: flex;
  align-items: center; justify-content: center; font-size: clamp(30px, 10.2vw, 44px); font-weight: 900; color: var(--gx-card);
  background: linear-gradient(160deg, var(--gx-gold), var(--gx-accent)); border: 3px solid var(--gx-line);
  box-shadow: 0 5px 0 var(--gx-line); animation: gxAnsIn .45s cubic-bezier(.2,.9,.3,1.2) both; }
.gx-m-answord .aw:nth-child(1) { animation-delay: .02s; } .gx-m-answord .aw:nth-child(2) { animation-delay: .12s; }
.gx-m-answord .aw:nth-child(3) { animation-delay: .22s; } .gx-m-answord .aw:nth-child(4) { animation-delay: .32s; }
.gx-m-answord .aw:nth-child(5) { animation-delay: .42s; } .gx-m-answord .aw:nth-child(6) { animation-delay: .52s; }
.gx-m-answord .aw:nth-child(n+7) { animation-delay: .6s; }
/* 按答案字数自适应：长答案逐级缩字，窄屏绝不横向溢出 */
.gx-m-answord.gx-aw5 .aw { font-size: clamp(28px, 9vw, 40px); height: clamp(52px, 14vw, 68px); }
.gx-m-answord.gx-aw6 .aw { font-size: clamp(26px, 8.2vw, 36px); height: clamp(50px, 13vw, 64px); padding: 0 clamp(5px, 1.6vw, 9px); }
.gx-m-answord.gx-aw7 .aw { font-size: clamp(24px, 7.4vw, 32px); height: clamp(46px, 12vw, 58px); padding: 0 clamp(4px, 1.4vw, 8px); }
.gx-m-answord.gx-aw8 .aw, .gx-m-answord.gx-aw9 .aw { font-size: clamp(21px, 6.4vw, 29px); height: clamp(42px, 11vw, 52px); padding: 0 clamp(4px, 1.2vw, 7px); }
@keyframes gxAnsIn { 0% { opacity: 0; transform: translateY(24px) rotate(-8deg) scale(.6); }
  100% { opacity: 1; transform: none; } }
@media (max-width: 380px) {
  .gx-tile { height: 54px; font-size: 27px; }
  .gx-slot { width: 52px; height: 60px; font-size: 30px; }
  .gx-buzz-btn { width: 188px; height: 188px; }
}

/* ============ 开局玩法选择弹层（讲师台） ============ */
.mp-mask { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center;
  background: rgba(24,12,16,.55); backdrop-filter: blur(5px); animation: gxFade .18s ease; }
@keyframes gxFade { from { opacity: 0; } to { opacity: 1; } }
.mp-box { width: min(920px, 92vw); background: linear-gradient(165deg, #fffaf0, #f6e7cf); border: 1px solid #e6c98f;
  border-radius: 24px; padding: 30px 32px 26px; box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.mp-hd { font-size: 30px; font-weight: 900; color: #5a2a34; text-align: center; margin-bottom: 22px; letter-spacing: .02em; }
.mp-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.mp-card { position: relative; border: 2px solid #e0c48b; border-radius: 18px; background: #fffdf7; cursor: pointer;
  padding: 26px 18px 20px; font-family: inherit; text-align: center; color: #4a3220;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease; }
.mp-card:hover { transform: translateY(-5px); border-color: #a8763a; box-shadow: 0 14px 28px rgba(150,90,30,.22); }
.mp-card:active { transform: translateY(-1px); }
.mp-ic { width: 64px; height: 64px; margin: 0 auto 12px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-size: 34px; font-weight: 900; color: #fff; background: linear-gradient(150deg, #b8453f, #7a1f2b); box-shadow: 0 6px 0 rgba(122,31,43,.35); }
.mp-tt { font-size: 24px; font-weight: 900; }
.mp-ds { font-size: 14px; color: #7a6246; line-height: 1.55; margin: 9px 0 12px; }
.mp-tag { display: inline-block; font-size: 12.5px; font-weight: 700; color: #8a5a20; background: #f3e0b8;
  border-radius: 999px; padding: 3px 12px; }
.mp-tip { text-align: center; color: #8a6d4b; font-size: 14px; margin: 20px 0 4px; }
.mp-ft { display: flex; justify-content: center; }
.mp-cancel { margin-top: 10px; border: 2px solid #c9b185; background: transparent; color: #6f5a3c; font-family: inherit;
  font-size: 16px; font-weight: 700; border-radius: 999px; padding: 10px 34px; cursor: pointer; }
.mp-cancel:hover { background: rgba(0,0,0,.05); }
@media (max-width: 720px) { .mp-cards { grid-template-columns: 1fr; } }

/* ============================================================
   性能档位（html[data-perf]：standard 标准 / smooth 流畅 / minimal 极简）
   KSDK.Perf FPS 哨兵自动降级，也可在「设置」手动切换；兼容普通办公本
   ============================================================ */

/* 即时按压反馈：所有可点元素按下即有手感（<100ms），纯 transform 走合成层 */
button, .kbtn, .nav-item, .mp-card, .gcard, .gx-card, .bs-item, .gx-tile, .gx-btn, .kchip, [data-act], [data-bsact], [data-gid] {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
button:not(:disabled):active, .kbtn:active, .nav-item:active, .mp-card:active, .gcard:active,
  .gx-card:active, .bs-item:active, .gx-tile:active, .gx-btn:active, .kchip:active {
  transform: scale(.965);
}
/* 持续动画元素独立合成层，避免触发整页重绘 */
.cloud, .confetti i, .floaty, .gx-armed-num, .gx-big-ring { will-change: transform; }
/* 长列表与游戏区隔离重绘 */
.bs-list, .rt-list, #ghList, #bsList { contain: content; }

/* —— 流畅档：去掉最重的背景模糊/玻璃模糊/无限脉动（保留入场与按压反馈） —— */
html[data-perf="smooth"] .cloud { filter: none; opacity: .10; }
html[data-perf="smooth"] *,
html[data-perf="smooth"] *::before,
html[data-perf="smooth"] *::after {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html[data-perf="smooth"] .panel { background: var(--panel, rgba(28,20,40,.94)); }
html[data-perf="smooth"] .floaty,
html[data-perf="smooth"] .gx-armed-num,
html[data-perf="smooth"] .gx-media-emoji,
html[data-perf="smooth"] .gx-m-emoji,
html[data-perf="smooth"] .gx-big-ring { animation: none !important; }
html[data-perf="smooth"] .cloud { animation-duration: 90s !important; }

/* —— 极简档：关闭一切非必要动画/过渡/模糊，即时显隐、绝不白屏 —— */
html[data-perf="minimal"] .cloud { animation: none !important; filter: none !important; opacity: .07; }
html[data-perf="minimal"] .confetti { display: none !important; }
html[data-perf="minimal"] .bz-ripple,
html[data-perf="minimal"] .bz-halo,
html[data-perf="minimal"] .bz-disk.live,
html[data-perf="minimal"] .rl-halo,
html[data-perf="minimal"] .rl-disk.spin,
html[data-perf="minimal"] .rl-disk.win { animation: none !important; }
html[data-perf="smooth"] .bz-ripple.d3 { display: none; }
html[data-perf="minimal"] *,
html[data-perf="minimal"] *::before,
html[data-perf="minimal"] *::after {
  animation-duration: .001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .001ms !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  scroll-behavior: auto !important;
}
/* 极简档仍保留按压的即时反馈 */
html[data-perf="minimal"] button:not(:disabled):active,
html[data-perf="minimal"] .kbtn:active,
html[data-perf="minimal"] .bs-item:active,
html[data-perf="minimal"] .gx-tile:active { transform: scale(.97); }
/* 极简档保留弹幕飞行（仅 transform 平移、GPU 合成，开销极小；是看局部猜整体/课堂弹幕核心氛围，不能瞬间跳终态） */
html[data-perf="minimal"] .gx-dm,
html[data-perf="minimal"] .danmu-fly {
  animation-duration: 8s !important;
  animation-iteration-count: 1 !important;
  opacity: 1 !important;
}

/* 跟随系统「减少动态效果」偏好。
   本项目的终点是投屏大屏：画面完全静止，台下看着就是"屏坏了"。
   所以氛围层（云雾 / 光轮 / 浮空元素 / 主标题）一律保留、只降速；
   一次性反馈与过渡仍压到最短，避免卡顿感。 */


/* ---------- 下钻返回面包屑 ---------- */
.crumb-bar { margin: 2px 0 14px; }
.crumb {
  display: inline-flex; align-items: center; gap: 7px;
  border: 1px solid var(--line); background: var(--panel);
  color: var(--gold-hi); font-family: inherit; font-size: 14px; font-weight: 700;
  border-radius: 999px; padding: 8px 18px; cursor: pointer;
  transition: transform .12s, box-shadow .12s, border-color .12s;
}
.crumb:hover { border-color: var(--gold); box-shadow: 0 6px 18px rgba(0,0,0,.22); }
.crumb .ci { font-size: 16px; line-height: 1; }
.hub-grid { margin-top: 16px; }

/* ---------- 课堂计时器（大屏全屏） ---------- */
.timer-stage { position: fixed; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 3vh; z-index: 5; }
.timer-stage .t-label { font-size: 3.4vh; font-weight: 800; letter-spacing: .12em; color: var(--gold-hi); }
.timer-big { font-variant-numeric: tabular-nums; font-weight: 900; font-size: 34vh; line-height: 1;
  background: linear-gradient(180deg, var(--gold-hi), var(--gold) 52%, var(--gold-deep));
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 14px 50px rgba(0,0,0,.35); }
.timer-big.warn { background: none; -webkit-background-clip: initial; color: #ff5a4d;
  animation: gxpulse 1s ease-in-out infinite; }
.timer-big.done { background: none; -webkit-background-clip: initial; color: #2fd07a; }
/* 大屏横向倒计时进度条 */
.timer-barwrap { width: 60vw; height: 16px; border-radius: 999px; background: rgba(255,255,255,.12);
  overflow: hidden; box-shadow: inset 0 1px 4px rgba(0,0,0,.3); }
.timer-bar { height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--gold), var(--gold-hi));
  box-shadow: 0 0 22px rgba(242,172,61,.55); transition: width .9s linear; }
.timer-bar.warn { background: linear-gradient(90deg, #d3322a, #ff7a6b); box-shadow: 0 0 26px rgba(255,90,77,.7); }
@media (max-width: 720px) {
  .timer-big { font-size: 26vw; }
  .timer-ring { width: 78vw; height: 78vw; }
  .m-timer { margin-top: 20px; padding: 44px 18px; text-align: center; }
  .mt-label { font-size: 18px; font-weight: 800; letter-spacing: .15em; color: var(--gold-hi); }
  .mt-big { font-variant-numeric: tabular-nums; font-weight: 900; font-size: 96px; line-height: 1.1; margin: 26px 0 14px;
    background: linear-gradient(180deg, var(--gold-hi), var(--gold) 52%, var(--gold-deep));
    -webkit-background-clip: text; background-clip: text; color: transparent; }
  .mt-big.warn { background: none; -webkit-background-clip: initial; color: #ff5a4d; animation: gxpulse 1s ease-in-out infinite; }
  .mt-big.done { background: none; -webkit-background-clip: initial; color: #2fd07a; }
  .mt-state { font-size: 18px; font-weight: 800; color: var(--ink2, #e8dcc8); }
}

/* ==================== 妙语连珠 · 校园黑板粉笔（miaoyu） ==================== */
.theme-miaoyu {
  --gx-bg1: #f4f7ee; --gx-bg2: #dce9d2; --gx-bg3: #b6d2a6;
  --gx-red: #e2533f; --gx-gold: #f4b740; --gx-yellow: #f8d366; --gx-green: #2f9e63;
  --gx-blue: #3a7bd5; --gx-pink: #ef7ea2; --gx-purple: #7a5ce0;
  --gx-ink: #20382a; --gx-ink2: #5b7262; --gx-card: #fffef8; --gx-line: #9fc08e;
  --gx-accent: #2f7d4f; --gx-accent2: #f4b740;
  color: var(--gx-ink);
}
.miaoyu-stage { position: fixed; inset: 0; z-index: 0;
  background: linear-gradient(160deg, #eef5e6 0%, #d2e4c4 55%, #b2d0a0 100%); }
.miaoyu-stage::before { content: ""; position: absolute; inset: 0; opacity: .22;
  background-image:
    repeating-linear-gradient(0deg, transparent 0 64px, rgba(47,125,79,.28) 65px 67px),
    repeating-linear-gradient(90deg, transparent 0 120px, rgba(47,125,79,.14) 121px 122px); }
.miaoyu-stage::after { content: ""; position: absolute; inset: 0; opacity: .16;
  background-image:
    radial-gradient(circle at 12% 18%, rgba(244,183,64,.6) 0 14px, transparent 15px),
    radial-gradient(circle at 88% 22%, rgba(226,83,63,.5) 0 10px, transparent 11px),
    radial-gradient(circle at 18% 84%, rgba(58,123,213,.45) 0 12px, transparent 13px),
    radial-gradient(circle at 84% 80%, rgba(122,92,224,.45) 0 10px, transparent 11px); }
.theme-miaoyu .gx-m-opt { border-color: #b9d3a8; background: var(--gx-card); }
.theme-miaoyu .gx-m-opt.correct { background: linear-gradient(180deg,#e9f7df,#c6e8b6); border-color: var(--gx-green); }

/* ==================== 断句大挑战 · 墨绿黑板点阵（duanju） ==================== */
.theme-duanju {
  --gx-bg1: #eef4f1; --gx-bg2: #cbdcd2; --gx-bg3: #a3c2b3;
  --gx-red: #d9534f; --gx-gold: #e0b43c; --gx-yellow: #f2cf5b; --gx-green: #2e8b6f;
  --gx-blue: #2f6f9f; --gx-pink: #d7708f; --gx-purple: #6a5acd;
  --gx-ink: #15352a; --gx-ink2: #4e6b5c; --gx-card: #fcfffb; --gx-line: #8cb3a3;
  --gx-accent: #1f5f4a; --gx-accent2: #e0b43c;
  color: var(--gx-ink);
}
.duanju-stage { position: fixed; inset: 0; z-index: 0;
  background: linear-gradient(160deg, #e8f1ec 0%, #c8dcd0 55%, #a0c0b0 100%); }
.duanju-stage::before { content: ""; position: absolute; inset: 0; opacity: .20;
  background-image: radial-gradient(circle, rgba(31,95,74,.55) 0 2.5px, transparent 3.5px);
  background-size: 34px 34px; }
.duanju-stage::after { content: ""; position: absolute; inset: 0; opacity: .10;
  background-image:
    repeating-linear-gradient(0deg, transparent 0 78px, rgba(31,95,74,.3) 79px 80px); }
.theme-duanju .gx-riddle { font-family: "KaiTi","STKaiti","FangSong",serif; letter-spacing: .06em; }


/* ---------- 长答案（断句/多句参考）正常段落，不逐字拆方块 ---------- */
.gx-m-answord-long {
  margin: 14px 4px; padding: 16px 18px;
  background: var(--gx-card, #fff); border: 2px solid var(--gx-line, #c3cdd8);
  border-radius: 18px; box-shadow: 0 10px 26px rgba(0,0,0,.10);
  font-size: 22px; line-height: 1.7; font-weight: 700; letter-spacing: .02em;
  color: var(--gx-ink, #1c2b3a); text-align: center; white-space: normal;
  word-break: break-word;
}
.gx-m-answord-long { border-left: 6px solid var(--gx-accent, #2f6fed); }
.gx-answer-word.gx-ans-long {
  max-width: 1180px; margin: 18px auto 8px; padding: 26px 40px;
  background: rgba(255,255,255,.94); border: 3px solid var(--gx-line, #c3cdd8);
  border-radius: 26px; box-shadow: 0 18px 50px rgba(0,0,0,.18);
  font-size: 42px; line-height: 1.55; font-weight: 800; letter-spacing: .03em;
  color: #16283a; text-align: center; white-space: normal; word-break: break-word;
}
@media (max-width: 900px){ .gx-answer-word.gx-ans-long{ font-size:30px; padding:20px 22px; } }

/* 长答案卡：去掉大字投影（白底上投影会像半截字），riddle 场景自适应换行 */
.gx-answer-word.gx-ans-long {
  text-shadow: none; flex: none; min-height: 0; height: auto; overflow: visible;
  box-sizing: border-box; max-width: min(1180px, 90vw);
}
.gx-riddle-reveal .gx-ans-long {
  font-size: clamp(30px, 3.1vw, 44px); line-height: 1.6;
  margin: 14px auto 10px; padding: 22px 34px;
}
.gx-m-answord-long { text-shadow: none; }

/* ==================== 猜字谜 · 宣纸朱砂（zimi） ==================== */
.theme-zimi {
  --gx-bg1: #f7f0e1; --gx-bg2: #ecdfc4; --gx-bg3: #ddc79f;
  --gx-red: #c0392b; --gx-gold: #b8860b; --gx-yellow: #d9a93f; --gx-green: #5e7d4f;
  --gx-blue: #3f6b96; --gx-pink: #c25b73; --gx-purple: #7a5c9e;
  --gx-ink: #2e261c; --gx-ink2: #6b5c42; --gx-card: #fffdf5; --gx-line: #d8c8a4;
  --gx-accent: #b8392b; --gx-accent2: #b8860b;
  color: var(--gx-ink);
}
.zimi-stage { position: fixed; inset: 0; z-index: 0;
  background: radial-gradient(circle at 15% 18%, rgba(255,253,245,.95), transparent 62%),
    linear-gradient(160deg, #f8f1e2 0%, #eedec0 55%, #ddc49b 100%); }
.zimi-stage::before { content: ""; position: absolute; inset: 0; opacity: .18;
  background-image:
    repeating-linear-gradient(0deg, transparent 0 70px, rgba(184,134,11,.30) 71px 72px),
    repeating-linear-gradient(90deg, transparent 0 70px, rgba(184,134,11,.30) 71px 72px); }
.zimi-stage::after { content: ""; position: absolute; inset: 0; opacity: .14;
  background-image:
    radial-gradient(circle at 88% 16%, rgba(192,57,43,.55) 0 26px, transparent 28px),
    radial-gradient(circle at 10% 86%, rgba(192,57,43,.4) 0 16px, transparent 18px); }
.theme-zimi .gx-riddle-text, .theme-zimi .gx-m-riddle-text { font-family: "KaiTi","STKaiti","FangSong",serif; letter-spacing: .08em; }
.theme-zimi .gx-buzz-btn { background: radial-gradient(circle at 50% 38%, #d8553f, #a82a1d); }

/* ==================== 猜灯谜 · 元宵灯会（dengmi，深色暖红） ==================== */
.theme-dengmi {
  --gx-bg1: #7a1f1f; --gx-bg2: #5c1615; --gx-bg3: #3e0f0e;
  --gx-red: #e0574a; --gx-gold: #f2b705; --gx-yellow: #f7cf57; --gx-green: #7fb069;
  --gx-blue: #7fa8cf; --gx-pink: #e889a8; --gx-purple: #b797d6;
  --gx-ink: #fdf3dc; --gx-ink2: #e6cfa8; --gx-card: #fdf3dc; --gx-line: #c77d3f;
  --gx-accent: #f2b705; --gx-accent2: #f08a24;
  color: var(--gx-ink);
}
.dengmi-stage { position: fixed; inset: 0; z-index: 0;
  background:
    radial-gradient(circle at 82% 14%, rgba(255,236,170,.5) 0 90px, transparent 180px),
    radial-gradient(circle at 14% 88%, rgba(240,138,36,.28), transparent 46%),
    linear-gradient(165deg, #82241f 0%, #641a18 50%, #42100f 100%); }
.dengmi-stage::before { content: ""; position: absolute; inset: 0; opacity: .16;
  background-image:
    radial-gradient(circle at 12% 20%, rgba(242,183,5,.8) 0 3px, transparent 4px),
    radial-gradient(circle at 70% 60%, rgba(247,207,87,.7) 0 2.5px, transparent 3.5px),
    radial-gradient(circle at 30% 78%, rgba(242,183,5,.6) 0 3px, transparent 4px),
    radial-gradient(circle at 88% 72%, rgba(247,207,87,.6) 0 2.5px, transparent 3.5px);
  background-size: 320px 320px; }
.dengmi-stage::after { content: ""; position: absolute; inset: 0; opacity: .12;
  background-image: repeating-linear-gradient(115deg, transparent 0 26px, rgba(242,183,5,.18) 27px 28px); }
.theme-dengmi .gx-riddle, .theme-dengmi .gx-m-riddle {
  background: linear-gradient(180deg, #fdf3dc, #f4e3bd);
  border: 3px solid #c77d3f; box-shadow: 0 16px 44px rgba(0,0,0,.35); }
.theme-dengmi .gx-riddle-text, .theme-dengmi .gx-m-riddle-text {
  color: #5c1615; font-family: "KaiTi","STKaiti","FangSong",serif; letter-spacing: .08em; }
.theme-dengmi .gx-m-riddle-quote { color: #c0392b; }
.theme-dengmi .gx-buzz-btn { background: radial-gradient(circle at 50% 38%, #f6c93a, #e08a12); }
.theme-dengmi .gx-m-answord-long { color: #3a1410; }


/* ---- zimi/dengmi 谜面卡主题化 + 深色 hud pill 可读性修复 ---- */
.theme-dengmi .gx-media-riddle, .theme-dengmi .gx-m-riddle {
  background: linear-gradient(180deg, #fdf3dc, #f4e3bd);
  border: 3px solid #c77d3f; box-shadow: 0 18px 50px rgba(0,0,0,.42); }
.theme-dengmi .gx-media-riddle .gx-riddle-text,
.theme-dengmi .gx-m-riddle .gx-m-riddle-text { color: #5c1615; }
.theme-dengmi .gx-riddle-quote, .theme-dengmi .gx-m-riddle-quote { color: #c0392b; }
.theme-dengmi .gx-pill { background: rgba(74,18,16,.52); color: #fdf3dc; border: 1.5px solid rgba(242,183,5,.55); }
.theme-dengmi .gx-pill b { color: var(--gx-gold); }
.theme-dengmi .gx-m-modebadge { background: rgba(74,18,16,.52); color: #fdf3dc; border: 1.5px solid rgba(242,183,5,.55); }
.theme-zimi .gx-media-riddle, .theme-zimi .gx-m-riddle {
  background: linear-gradient(180deg, #fffdf5, #f4ead2);
  border: 3px solid #c8a55e; box-shadow: 0 16px 44px rgba(120,90,40,.20); }
.theme-zimi .gx-media-riddle .gx-riddle-text,
.theme-zimi .gx-m-riddle .gx-m-riddle-text { color: #3a2c16; }
.theme-zimi .gx-riddle-quote, .theme-zimi .gx-m-riddle-quote { color: #b8392b; }

/* ---- 大屏逐字答案：入场只用 scale，不依赖 opacity（动画被节流时文字仍可见） ---- */
.gx-ans-big .aw { opacity: 1; animation-name: gxAwPop; }
@keyframes gxAwPop { 0% { transform: scale(.62); } 60% { transform: scale(1.08); } 100% { transform: scale(1); } }
/* ---- 大屏谜面卡：去掉内层 .gx-riddle-text 自带深蓝底，露出主题外卡（去双层） ---- */
.theme-dengmi .gx-media-riddle .gx-riddle-text,
.theme-zimi .gx-media-riddle .gx-riddle-text {
  background: transparent; border: none; box-shadow: none; text-shadow: none;
  padding: 10px 28px 24px;
}
.theme-dengmi .gx-media-riddle .gx-riddle-text { color: #5c1615; }
.theme-zimi .gx-media-riddle .gx-riddle-text { color: #3a2c16; }

/* ---- 大屏逐字答案：入场只用 scale，不依赖 opacity（动画被节流时文字仍可见） ---- */
.gx-ans-big .aw { opacity: 1; animation-name: gxAwPop; }
@keyframes gxAwPop { 0% { transform: scale(.62); } 60% { transform: scale(1.08); } 100% { transform: scale(1); } }
/* ---- 大屏谜面卡：去掉内层 .gx-riddle-text 自带深蓝底，露出主题外卡（去双层） ---- */
.theme-dengmi .gx-media-riddle .gx-riddle-text,
.theme-zimi .gx-media-riddle .gx-riddle-text {
  background: transparent; border: none; box-shadow: none; text-shadow: none;
  padding: 10px 28px 24px;
}
.theme-dengmi .gx-media-riddle .gx-riddle-text { color: #5c1615; }
.theme-zimi .gx-media-riddle .gx-riddle-text { color: #3a2c16; }

/* ===== 看局部猜整体 jubu：明亮侦探放大镜风（暖橙米色调，童趣不套国风） ===== */
.theme-jubu{
  --gx-bg1:#fdf7ec; --gx-bg2:#f6e8cf; --gx-bg3:#eeddb8;
  --gx-card:#fffdf7; --gx-ink:#473322; --gx-ink2:#8a6a45;
  --gx-accent:#ff8a3d; --gx-accent2:#f2a33d; --gx-gold:#f5b041; --gx-line:#ecd9b0;
}
.jubu-stage{position:fixed;inset:0;z-index:0;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.7), transparent 42%),
    radial-gradient(circle at 88% 12%, rgba(255,180,90,.35), transparent 40%),
    radial-gradient(circle at 80% 90%, rgba(255,214,150,.4), transparent 45%),
    linear-gradient(160deg, #fdf7ec 0%, #f6e8cf 55%, #efdcb8 100%);
}
.jubu-stage::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:radial-gradient(rgba(180,130,60,.14) 1.5px, transparent 1.6px);background-size:30px 30px;}
.theme-jubu .gx-media-img{background:#fff;border:4px solid #ff8a3d;border-radius:26px;
  box-shadow:0 20px 48px rgba(214,130,40,.28), inset 0 0 0 6px rgba(255,255,255,.6);}
.theme-jubu .gx-media-img img{border-radius:20px;}
.theme-jubu .gx-m-media img{border-radius:20px;}
.theme-jubu .gx-m-media{background:#fff;border:3px solid #ffb066;border-radius:24px;box-shadow:0 12px 30px rgba(214,130,40,.22);}
.theme-jubu .gx-q{color:#5a3d22;}
/* 揭晓整体图放大强调 */
.theme-jubu .gx-media-reveal{border-color:#2fbf71;box-shadow:0 24px 60px rgba(47,191,113,.30);}

/* ===== jubu 明亮底对比度修复 ===== */
.theme-jubu{color:#473322;--gx-yellow:#ffd86b;}
.theme-jubu .gx-m-q{color:#4a3322;}
.theme-jubu .gx-m-state .big{color:#5a3d22;}
.theme-jubu .gx-m-state .gx-sub{color:#8a6a45;}
.theme-jubu .gx-m-state{color:#8a6a45;}
.theme-jubu .gx-rankrow,.theme-jubu .gx-rankrow .gx-nm{color:#473322;}
.theme-jubu .gx-rankrow.r1{background:linear-gradient(180deg,#ffe08a,#f7c24a);}
.theme-jubu .gx-rankrow.r1 .gx-nm{color:#4a3322;}
.theme-jubu .gx-q{color:#5a3d22;}
.theme-jubu .gx-m-submit{color:#5a3d22;}

/* ===================== wheel 转盘（幸运大转盘 / 趣味惩罚转盘）大屏 ===================== */
#whlDisk{transform-origin:200px 200px;transform-box:view-box;will-change:transform;}
.whl-stage{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;padding:2.4vh 3vw;overflow:hidden;}
.whl-stage.whl-wheelgold{background:radial-gradient(1200px 720px at 50% -12%,#c2342a 0%,#97190f 46%,#5e0a05 100%);}
.whl-stage.whl-wheelfun{background:radial-gradient(1200px 720px at 50% -12%,#7a52e0 0%,#5130a8 46%,#27135e 100%);}
.whl-stage::before{content:"";position:absolute;width:60vw;height:60vw;left:50%;top:-34vw;transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(255,224,138,.28),rgba(255,224,138,0) 62%);pointer-events:none;}
.whl-wheelfun::before{background:radial-gradient(circle,rgba(255,168,90,.26),rgba(255,168,90,0) 62%);}
.whl-top{display:flex;justify-content:space-between;align-items:center;position:relative;z-index:2;}
.whl-title{font-size:clamp(28px,3.3vw,46px);font-weight:900;letter-spacing:2px;display:flex;align-items:center;gap:14px;}
.whl-wheelgold .whl-title{color:#ffe9a8;text-shadow:0 2px 0 #7a0f08,0 5px 16px rgba(0,0,0,.4);}
.whl-wheelfun .whl-title{color:#fff;text-shadow:0 3px 12px rgba(0,0,0,.35);}
.whl-title-ico{font-size:1.1em;}
.whl-count{font-size:clamp(15px,1.3vw,20px);font-weight:700;padding:8px 18px;border-radius:999px;color:#fff;
  background:rgba(0,0,0,.22);backdrop-filter:blur(6px);}
.whl-count b{font-size:1.25em;color:#ffd98a;margin:0 2px;}
.whl-main{flex:1;display:flex;align-items:center;justify-content:center;gap:3.4vw;position:relative;z-index:2;}
.whl-machine{position:relative;display:flex;flex-direction:column;align-items:center;}
.whl-outer{position:relative;width:min(60vh,50vw);aspect-ratio:1/1;
  filter:drop-shadow(0 26px 50px rgba(0,0,0,.42));}
.whl-svg{width:100%;height:100%;display:block;}
.whl-pointer{position:absolute;top:-12px;left:50%;transform:translateX(-50%);z-index:6;width:0;height:0;
  border-left:23px solid transparent;border-right:23px solid transparent;border-top:40px solid #fff;
  filter:drop-shadow(0 4px 5px rgba(0,0,0,.45));}
.whl-pointer::after{content:"";position:absolute;top:-46px;left:-9px;width:18px;height:18px;border-radius:50%;background:#ffd86b;border:2px solid #fff;}
.whl-hint{margin-top:2.2vh;font-size:clamp(18px,1.7vw,26px);font-weight:800;letter-spacing:1px;}
.whl-wheelgold .whl-hint{color:#ffd98a;}
.whl-wheelfun .whl-hint{color:#fff;}
.whl-lamp{animation:whlLamp 1s ease-in-out infinite;}
@keyframes whlLamp{0%,100%{opacity:1;fill:#fff2c0}50%{opacity:.3;fill:#ffd86b}}
.whl-side{width:min(33vw,470px);display:flex;flex-direction:column;gap:18px;}
.whl-card{border-radius:26px;padding:28px 30px;box-shadow:0 24px 60px rgba(0,0,0,.28);opacity:1;}
.whl-card-idle{background:rgba(255,255,255,.96);}
.whl-card-emoji{font-size:58px;line-height:1;}
.whl-card-title{font-size:30px;font-weight:900;margin:10px 0 6px;color:#3a2716;}
.whl-card-sub{font-size:15.5px;line-height:1.6;color:#8a7155;}
.whl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:18px;}
.whl-chip{display:flex;align-items:center;gap:8px;font-size:14.5px;font-weight:700;background:#f6f1e7;border-radius:12px;padding:9px 11px;color:#40301f;}
.whl-chip span{width:13px;height:13px;border-radius:50%;flex:none;box-shadow:0 0 0 2px rgba(255,255,255,.6) inset;}
.whl-card-result{animation:whlPop .55s cubic-bezier(.18,1.3,.4,1) both;}
.whl-res-gold{background:linear-gradient(160deg,#fff8e3,#ffe2a0);border:2px solid #f0b83c;}
.whl-res-fun{background:linear-gradient(160deg,#ffffff,#f0e9ff);border:2px solid #9b7bff;}
.whl-res-ribbon{display:inline-block;font-weight:800;font-size:17px;padding:8px 18px;border-radius:999px;color:#fff;}
.whl-res-gold .whl-res-ribbon{background:#d4322c;}
.whl-res-fun .whl-res-ribbon{background:#7e5bef;}
.whl-res-no{font-size:22px;font-weight:900;color:#7e5bef;margin:12px 0 0;}
.whl-res-prize{font-size:clamp(40px,4.6vw,62px);font-weight:900;margin:14px 0;color:#c6342a;
  text-shadow:0 3px 0 #fff,0 7px 16px rgba(212,50,44,.25);word-break:break-all;}
.whl-res-prize.is-mute{color:#8a6a45;text-shadow:0 2px 0 #fff;}
.whl-res-task{font-size:clamp(20px,2vw,28px);font-weight:800;line-height:1.55;color:#3a2a55;margin:12px 0;}
.whl-res-go{font-size:16px;font-weight:800;margin-top:6px;}
.whl-res-gold .whl-res-go{color:#b9741a;}
.whl-res-fun .whl-res-go{color:#6a4fd0;}
@keyframes whlPop{0%{opacity:0;transform:scale(.7) translateY(24px)}60%{opacity:1;transform:scale(1.04)}100%{opacity:1;transform:scale(1) translateY(0)}}
.whl-history{background:rgba(0,0,0,.2);border-radius:20px;padding:16px 20px;color:#fff;backdrop-filter:blur(6px);}
.whl-history-h{font-size:15px;font-weight:800;opacity:.85;margin-bottom:6px;letter-spacing:1px;}
.whl-hi{display:flex;align-items:center;gap:9px;font-size:15px;font-weight:600;padding:6px 0;border-bottom:1px dashed rgba(255,255,255,.16);}
.whl-hi:last-child{border-bottom:none;}
.whl-hi-dot{width:11px;height:11px;border-radius:50%;flex:none;}
.whl-hi-empty{opacity:.6;font-size:14px;padding:4px 0;}
@media (max-width:1100px){.whl-main{flex-direction:column;gap:14px;}.whl-outer{width:min(46vh,70vw);}.whl-side{width:min(92vw,560px);flex-direction:row;}.whl-card{flex:1;}.whl-history{width:220px;flex:none;}}

/* ===== wheel 讲师控制台 ===== */
.whl-ctrl-stage{margin-top:18px;border:1.5px dashed rgba(0,0,0,.12);border-radius:16px;padding:18px;}
.whl-state{text-align:center;font-size:18px;font-weight:900;padding:10px 16px;border-radius:12px;background:#f2ede3;color:#6b5638;}
.whl-state.spinning{background:linear-gradient(90deg,#fff3d6,#ffe1a8);color:#c6342a;animation:whlPulse 1s ease-in-out infinite;}
.whl-state.result{background:#e9f9ee;color:#1f9d57;}
@keyframes whlPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.02)}}
.whl-big{font-size:19px;padding:14px 30px;background:linear-gradient(135deg,#f2a33c,#d9631f);}
.whl-big:disabled{opacity:.55;}
.whl-dedup{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;color:#6b5638;margin-top:14px;cursor:pointer;}
.whl-dedup input{width:18px;height:18px;accent-color:#d9631f;}
.whl-ctrl-result{margin-top:16px;border-radius:18px;padding:20px 22px;animation:whlPop .5s cubic-bezier(.18,1.3,.4,1) both;}
.whl-ctrl-result.gold{background:linear-gradient(160deg,#fff8e3,#ffe6ac);border:2px solid #f0b83c;}
.whl-ctrl-result.fun{background:linear-gradient(160deg,#fff,#f0e9ff);border:2px solid #9b7bff;}
.whl-ctrl-result .ribbon{display:inline-block;font-weight:800;color:#fff;padding:7px 16px;border-radius:999px;font-size:15px;background:#d4322c;}
.whl-ctrl-result.fun .ribbon{background:#7e5bef;}
.whl-ctrl-prize{font-size:40px;font-weight:900;color:#c6342a;margin:12px 0 6px;}
.whl-ctrl-prize.mute{color:#8a6a45;}
.whl-ctrl-no{font-size:18px;font-weight:900;color:#7e5bef;margin:12px 0 4px;}
.whl-ctrl-task{font-size:21px;font-weight:800;line-height:1.55;color:#3a2a55;margin:6px 0 10px;}
.whl-ctrl-chips{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:12px;}
.whl-ctrl-chip{display:flex;align-items:center;gap:9px;background:#f6f1e7;border-radius:12px;padding:10px 12px;font-size:14px;font-weight:700;color:#40301f;}
.whl-ctrl-chip .dot{width:14px;height:14px;border-radius:50%;flex:none;box-shadow:0 0 0 2px rgba(255,255,255,.7) inset;}
.whl-ctrl-chip .lab{flex:1;}
.whl-ctrl-chip .tk{font-size:12px;font-weight:800;color:#fff;background:#1f9d57;border-radius:999px;padding:2px 9px;}
.whl-ctrl-chip.done{opacity:.55;}
.whl-ctrl-hist{margin-top:10px;max-height:300px;overflow:auto;}
.whl-hi2{padding:9px 4px;border-bottom:1px dashed rgba(0,0,0,.1);}
.whl-hi2 .no{display:inline-block;min-width:24px;font-weight:900;color:#c6342a;font-size:13px;}
.whl-hi2 .lab{font-weight:800;font-size:14.5px;}
.whl-hi2 .dt{font-size:13px;color:#8a7a63;margin:3px 0 0 24px;line-height:1.5;}

/* ===== wheel 学员手机围观页 ===== */
.sw-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:18px 16px 24px;box-sizing:border-box;}
.sw-wrap.sw-wheelgold{background:radial-gradient(700px 500px at 50% -10%,#c2342a,#97190f 55%,#5e0a05);}
.sw-wrap.sw-wheelfun{background:radial-gradient(700px 500px at 50% -10%,#7a52e0,#5130a8 55%,#27135e);}
.sw-head{font-size:22px;font-weight:900;color:#ffe9a8;letter-spacing:1px;text-shadow:0 2px 8px rgba(0,0,0,.4);margin-bottom:8px;}
.sw-wheelfun .sw-head{color:#fff;}
.sw-machine{position:relative;width:236px;height:236px;margin:14px 0 6px;filter:drop-shadow(0 16px 30px rgba(0,0,0,.4));}
.sw-svg{width:100%;height:100%;display:block;}
.sw-pointer{position:absolute;top:-8px;left:50%;transform:translateX(-50%);z-index:5;width:0;height:0;border-left:15px solid transparent;border-right:15px solid transparent;border-top:26px solid #fff;filter:drop-shadow(0 3px 4px rgba(0,0,0,.4));}
.sw-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;}
.sw-state-emoji{font-size:64px;}
.sw-spin-emoji{font-size:60px;animation:swSpin 1s linear infinite;}
@keyframes swSpin{to{transform:rotate(360deg)}}
.sw-state-t{font-size:24px;font-weight:900;margin:12px 0 8px;}
.sw-state-s{font-size:15px;line-height:1.6;opacity:.85;}
.sw-result{width:100%;max-width:360px;border-radius:22px;padding:22px 20px;text-align:center;animation:swPop .55s cubic-bezier(.18,1.3,.4,1) both;box-shadow:0 18px 40px rgba(0,0,0,.3);}
.sw-result.sw-gold{background:linear-gradient(160deg,#fff8e3,#ffe2a0);border:2px solid #f0b83c;}
.sw-result.sw-fun{background:linear-gradient(160deg,#fff,#f0e9ff);border:2px solid #9b7bff;}
.sw-ribbon{display:inline-block;font-weight:800;color:#fff;padding:7px 16px;border-radius:999px;font-size:15px;background:#d4322c;}
.sw-fun .sw-ribbon{background:#7e5bef;}
.sw-prize{font-size:40px;font-weight:900;color:#c6342a;margin:14px 0 8px;word-break:break-all;}
.sw-prize.mute{color:#8a6a45;}
.sw-no{font-size:16px;font-weight:900;color:#7e5bef;margin:12px 0 4px;}
.sw-task{font-size:19px;font-weight:800;line-height:1.6;color:#3a2a55;margin:8px 0 10px;}
.sw-go{font-size:14px;font-weight:800;}
.sw-gold .sw-go{color:#b9741a;}
.sw-fun .sw-go{color:#6a4fd0;}
@keyframes swPop{0%{opacity:0;transform:scale(.7) translateY(18px)}60%{opacity:1;transform:scale(1.04)}100%{opacity:1;transform:scale(1)}}
.sw-foot{margin-top:14px;font-size:13px;font-weight:700;color:rgba(255,255,255,.72);text-align:center;}

/* 极简档保留转盘旋转（单元素 transform，GPU 合成，开销极小；是幸运/惩罚转盘的核心体验，不能瞬间跳结果）。
   灯泡闪烁/结果卡弹入等装饰动画在极简档仍压缩（静态灯+直接显现），只保留一次性的转盘旋转过渡。 */
html[data-perf="minimal"] #whlDisk,
html[data-perf="minimal"] #swDisk {
  transition-duration: 5200ms !important;
  transition-timing-function: cubic-bezier(.12,.6,.1,1) !important;
}

/* ===================== 谁是卧底（role）侦探悬疑主题 · 三端 ===================== */
/* 手机端 */
body.theme-detective {
  background: radial-gradient(120% 80% at 50% -10%, #232c63 0%, #141a3d 45%, #0b0f26 100%);
}
.rl-wrap {
  min-height: 100vh; color: #eef1ff;
  background:
    radial-gradient(60% 40% at 85% 0%, rgba(124,108,255,.28), transparent 60%),
    radial-gradient(50% 35% at 0% 100%, rgba(77,208,225,.16), transparent 60%);
  padding: 0 0 26px;
}
.rl-head {
  display:flex; align-items:center; justify-content:space-between;
  padding: 18px 18px 8px;
}
.rl-badge {
  font-size:19px; font-weight:900; letter-spacing:.5px;
  background: linear-gradient(135deg,#8b7bff,#5b6cf5);
  padding:7px 14px; border-radius:999px; color:#fff;
  box-shadow:0 6px 18px rgba(91,108,245,.45);
}
.rl-round { font-size:13px; color:#aab3e8; font-weight:700; }
.rl-body { padding: 6px 18px; animation: rlFade .4s ease; }
@keyframes rlFade { from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }
.rl-magnify { font-size:64px; line-height:1; margin:18px 0 6px; filter: drop-shadow(0 8px 18px rgba(139,123,255,.5)); animation: rlFloat 3s ease-in-out infinite; }
@keyframes rlFloat { 0%,100%{transform:translateY(0);} 50%{transform:translateY(-8px);} }
.rl-title { font-size:24px; font-weight:900; margin:8px 0; color:#fff; }
.rl-sub { font-size:14.5px; color:#b6bdee; line-height:1.7; margin-bottom:14px; }
.rl-sub b { color:#ffd27a; }
.rl-seats { font-size:15px; font-weight:800; color:#cdd4ff; margin:10px 0 20px; }
.rl-seats b { color:#ffd27a; font-size:20px; }
.rl-btn-primary {
  width:100%; border:none; cursor:pointer;
  padding:16px 18px; border-radius:16px; font-size:18px; font-weight:900; color:#fff;
  background: linear-gradient(135deg,#8b7bff 0%,#5b6cf5 100%);
  box-shadow:0 12px 26px rgba(91,108,245,.5), inset 0 1px 0 rgba(255,255,255,.3);
  transition: transform .15s ease, box-shadow .15s ease;
}
.rl-btn-primary:active { transform: scale(.97); }
.rl-btn-primary:disabled { opacity:.5; filter:grayscale(.4); }
.rl-tip { font-size:12.5px; color:#8d96c9; margin-top:14px; line-height:1.6; text-align:center; }
.rl-join { text-align:center; padding:26px 6px; }
.rl-join .rl-btn-primary { margin-top:8px; }

.rl-secret { text-align:center; padding:40px 10px; }
.rl-lock { font-size:60px; margin:10px 0 4px; animation: rlFloat 3s ease-in-out infinite; }
.rl-idcard {
  border-radius:22px; padding:26px 20px; text-align:center; margin-top:8px;
  border:1.5px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.07);
  backdrop-filter: blur(8px);
  box-shadow: 0 20px 50px rgba(0,0,0,.4);
}
.rl-idcard.uc { border-color:rgba(255,93,115,.6); box-shadow:0 20px 60px rgba(255,93,115,.28); }
.rl-idcard.civ { border-color:rgba(77,208,225,.55); box-shadow:0 20px 60px rgba(77,208,225,.22); }
.rl-id-tag { font-size:17px; font-weight:900; color:#ffd27a; }
.rl-idcard.uc .rl-id-tag { color:#ff8ba0; }
.rl-idcard.civ .rl-id-tag { color:#7ee8f5; }
.rl-wrap.theme-rl { min-height: calc(100vh - 64px); border-radius: 20px; overflow: hidden;
  background: linear-gradient(180deg, rgba(5,7,19,.5), rgba(5,7,19,.88)), url('../games/shui/assets/bg-table.jpg?v=7') center/cover no-repeat; }
.rl-wrap.theme-rl .rl-body { width: 100%; max-width: 540px; padding: 18px 14px; border-radius: 20px;
  background: rgba(9,13,28,.62); border: 1px solid rgba(216,177,90,.18); box-shadow: 0 22px 60px rgba(0,0,0,.45); }
.rl-idcard { position: relative; overflow: hidden; padding-right: 104px; }
.rl-idcard .rl-figure { position:absolute; right:6px; bottom:6px; width:118px; height:180px; object-fit:cover; object-position:center top; mix-blend-mode:screen;
  border-radius:14px; opacity:.95; pointer-events:none; z-index:1;
  -webkit-mask-image: linear-gradient(to left, #000 55%, transparent 100%); mask-image: linear-gradient(to left, #000 55%, transparent 100%); }
.rl-idcard .rl-id-tag, .rl-idcard .rl-id-word, .rl-idcard .rl-id-rule, .rl-idcard .rl-id-warn, .rl-idcard .rl-wait { position: relative; z-index: 2; }
.rl-idcard.blank { border-color: rgba(201,183,255,.55); box-shadow: 0 20px 60px rgba(120,90,220,.25); }
.rl-idcard.blank .rl-id-tag { color: #d6c8ff; }
.rl-id-word {
  font-size:54px; font-weight:900; letter-spacing:4px; margin:18px 0 6px; color:#fff;
  text-shadow:0 4px 24px rgba(139,123,255,.6);
}
.rl-id-rule { font-size:14px; color:#cdd4ff; line-height:1.7; }
.rl-id-warn { margin-top:14px; font-size:13px; color:#ffb3be; background:rgba(255,93,115,.12); border:1px solid rgba(255,93,115,.3); padding:9px 12px; border-radius:12px; }
.rl-wait { margin-top:16px; font-size:13px; color:#9aa3d6; }

.rl-desc-pill { display:inline-block; font-size:13px; font-weight:800; color:#cdd4ff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14); padding:6px 14px; border-radius:999px; }
.rl-desc-pill.danger { color:#ff9aa9; background:rgba(255,93,115,.14); border-color:rgba(255,93,115,.4); }
.rl-myword-mini { margin-top:16px; font-size:15px; color:#aab3e8; }
.rl-myword-mini b { color:#fff; font-size:22px; margin-left:6px; }
.rl-desc-title { font-size:22px; font-weight:900; margin:18px 0 12px; color:#fff; line-height:1.5; }
.rl-desc-title b { color:#ffd27a; }
.rl-desc-rules { list-style:none; padding:0; margin:0 0 16px; }
.rl-desc-rules li { font-size:14.5px; color:#cdd4ff; padding:9px 14px; margin-bottom:8px; background:rgba(255,255,255,.06); border-radius:12px; }
.rl-order { display:flex; flex-wrap:wrap; gap:8px; margin:14px 0; }
.rl-order-item { display:flex; align-items:center; gap:6px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.1); padding:6px 10px 6px 6px; border-radius:999px; font-size:13px; color:#eef1ff; }
.rl-order-item.dead { opacity:.38; }
.rl-ava { width:30px; height:30px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; color:#fff; font-weight:900; font-size:13px; }

.rl-vote-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:12px; margin:18px 0; }
.rl-vote-card {
  border:1.5px solid rgba(255,255,255,.14); background:rgba(255,255,255,.07);
  border-radius:18px; padding:16px 10px; cursor:pointer; color:#fff;
  display:flex; flex-direction:column; align-items:center; gap:6px;
  transition: transform .15s, border-color .15s, background .15s;
}
.rl-vote-card:active { transform:scale(.95); border-color:#ff8ba0; background:rgba(255,93,115,.16); }
.rl-vote-card .rl-ava { width:52px; height:52px; font-size:22px; }
.rl-vote-name { font-size:16px; font-weight:900; }
.rl-vote-unit { font-size:11.5px; color:#9aa3d6; }
.rl-voted { text-align:center; padding:30px 6px; }
.rl-bars { margin-top:16px; text-align:left; }
.rl-bar-row { display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.rl-bar-name { width:56px; font-size:13.5px; font-weight:800; color:#eef1ff; text-align:right; }
.rl-bar-track { flex:1; height:12px; background:rgba(255,255,255,.1); border-radius:999px; overflow:hidden; }
.rl-bar-track i { display:block; height:100%; background:linear-gradient(90deg,#8b7bff,#ff5d73); border-radius:999px; transition:width .4s ease; }
.rl-bar-n { width:28px; font-size:13px; font-weight:900; color:#ffd27a; }

.rl-out-reveal { text-align:center; padding:30px 12px; border-radius:22px; margin-top:8px; }
.rl-out-reveal.is-uc { background:rgba(255,93,115,.12); border:1.5px solid rgba(255,93,115,.4); }
.rl-out-reveal.is-civ { background:rgba(77,208,225,.1); border:1.5px solid rgba(77,208,225,.36); }
.rl-out-emoji { font-size:58px; }
.rl-out-name { font-size:32px; font-weight:900; color:#fff; margin:8px 0; }
.rl-out-role { font-size:18px; color:#cdd4ff; }
.rl-out-role b { font-size:22px; }
.rl-out-reveal.is-uc .rl-out-role b { color:#ff8ba0; }
.rl-out-reveal.is-civ .rl-out-role b { color:#7ee8f5; }
.rl-spect { text-align:center; padding:36px 10px; }
.rl-out-line { margin-top:12px; font-size:15px; font-weight:800; color:#ffd27a; }

.rl-over { padding:4px 0; }
.rl-over-banner { font-size:30px; font-weight:900; text-align:center; padding:20px; border-radius:20px; margin-bottom:16px; }
.rl-over-banner.uc { color:#fff; background:linear-gradient(135deg,#ff5d73,#c92a4d); box-shadow:0 14px 34px rgba(255,93,115,.4); }
.rl-over-banner.civ { color:#fff; background:linear-gradient(135deg,#4dd0e1,#1c7ed6); box-shadow:0 14px 34px rgba(77,208,225,.36); }
.rl-myresult { text-align:center; font-size:16px; font-weight:900; margin-bottom:14px; }
.rl-myresult.win { color:#7CFFB2; }
.rl-myresult.lose { color:#ffb3be; }
.rl-words { display:flex; align-items:center; gap:10px; justify-content:center; margin-bottom:16px; }
.rl-word-chip { flex:1; text-align:center; border-radius:16px; padding:14px 8px; }
.rl-word-chip label { display:block; font-size:12px; margin-bottom:6px; }
.rl-word-chip b { font-size:24px; font-weight:900; }
.rl-word-chip.civ { background:rgba(77,208,225,.14); border:1px solid rgba(77,208,225,.4); }
.rl-word-chip.civ b { color:#7ee8f5; }
.rl-word-chip.uc { background:rgba(255,93,115,.14); border:1px solid rgba(255,93,115,.4); }
.rl-word-chip.uc b { color:#ff8ba0; }
.rl-word-chip label { color:#9aa3d6; }
.rl-word-vs { font-size:15px; font-weight:900; color:#ffd27a; }
.rl-final-roster { display:flex; flex-direction:column; gap:8px; }
.rl-final-row { display:flex; align-items:center; gap:10px; background:rgba(255,255,255,.06); border-radius:14px; padding:8px 12px; }
.rl-final-row.uc { background:rgba(255,93,115,.14); }
.rl-final-row.dead { opacity:.5; }
.rl-final-name { font-weight:800; flex:1; }
.rl-final-tag { font-size:13px; font-weight:800; }
.rl-final-row.uc .rl-final-tag { color:#ff8ba0; }
.rl-final-row.civ .rl-final-tag { color:#7ee8f5; }

/* 大屏端 */
.rls-stage {
  min-height:100vh; color:#eef1ff; padding:34px 48px 40px;
  background:
    radial-gradient(70% 50% at 85% -10%, rgba(124,108,255,.3), transparent 60%),
    radial-gradient(60% 45% at 0% 110%, rgba(77,208,225,.18), transparent 60%),
    linear-gradient(160deg,#1a2148 0%,#11163a 50%,#0a0e26 100%);
}
.rls-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.rls-title { font-size:38px; font-weight:900; letter-spacing:2px; display:flex; align-items:center; gap:14px; }
.rls-title span { filter:drop-shadow(0 6px 14px rgba(139,123,255,.6)); }
.rls-stat { font-size:20px; font-weight:800; color:#b6bdee; }
.rls-stat b { color:#ffd27a; font-size:26px; }
.rls-main { display:flex; flex-direction:column; align-items:center; width:100%; }
.rls-main > div { width:100%; }
.rls-join, .rls-peek, .rls-describe, .rls-vote, .rls-out, .rls-over { width:100%; display:flex; flex-direction:column; align-items:center; }
.rls-h1 { font-size:52px; font-weight:900; margin:10px 0 14px; color:#fff; text-align:center; }
.rls-hint { font-size:22px; color:#b6bdee; margin:8px 0 22px; text-align:center; }
.rls-hint b { color:#ffd27a; }
.rls-join-ico, .rls-peek-ico { font-size:92px; margin:10px 0; animation:rlFloat 3s ease-in-out infinite; }
.rls-bigcount { font-size:72px; font-weight:900; color:#ffd27a; text-align:center; }
.rls-bigcount span { font-size:26px; color:#b6bdee; margin-left:10px; }
.rls-wall { display:grid; grid-template-columns:repeat(auto-fit,minmax(108px,1fr)); gap:14px; width:100%; max-width:1180px; margin-top:18px; }
.rls-wall.many { gap:10px; max-width:1320px; }
.rls-stage { position: relative; min-height: 100vh; overflow: hidden; }
.rls-art { position:absolute; inset:0; z-index:0; background:url('../games/shui/assets/bg-table.jpg?v=7') center/cover no-repeat; filter:brightness(.62) saturate(1.04) blur(.8px); transform:scale(1.03); }
.rls-art::before { content:''; position:absolute; inset:0;
  background: radial-gradient(90% 70% at 50% 35%, rgba(10,12,28,.12) 0%, rgba(4,5,12,.78) 100%); }
.rls-stage::after { content:''; position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(92% 78% at 50% 42%, rgba(5,7,19,.4) 0%, rgba(3,4,10,.9) 100%); }
.rls-stage > *:not(.rls-art):not(.rls-fig) { position:relative; z-index:2; }
.rls-stage.rls-ph-vote .rls-art, .rls-stage.rls-ph-out .rls-art { filter:brightness(.52) saturate(1.05) sepia(.16) hue-rotate(-18deg) blur(.8px); }
.rls-stage.rls-ph-over .rls-art { filter:brightness(.8) saturate(1.1) blur(.6px); }
.rls-fig { position:absolute; bottom:0; z-index:1; width:min(28vw,430px); height:88vh; pointer-events:none;
  background:url('../games/shui/assets/char-host.jpg?v=7') center top/cover no-repeat; opacity:.82;
  -webkit-mask-image: radial-gradient(85% 85% at 45% 45%, #000 55%, transparent 100%);
  mask-image: radial-gradient(85% 85% at 45% 45%, #000 55%, transparent 100%); }
.rls-fig-l { left:-6vw; }
.rls-fig-r { right:-6vw; background-image:url('../games/shui/assets/char-undercover.jpg?v=7'); }
.rls-ph-join .rls-fig-l { background-image:url('../games/shui/assets/char-group.jpg?v=7'); }
.rls-ph-peek .rls-art, .rls-stage.rls-ph-describe .rls-art { background-image:url('../games/shui/assets/bg-table.jpg?v=7'); }
.rls-fig { position:absolute; bottom:0; z-index:1; width:min(20vw,320px); height:76vh; pointer-events:none;
  background:url('../games/shui/assets/char-undercover.jpg?v=6') center top/cover no-repeat; opacity:.6; mix-blend-mode:screen;
  -webkit-mask-image: radial-gradient(72% 72% at 50% 42%, #000 42%, transparent 100%);
  mask-image: radial-gradient(72% 72% at 50% 42%, #000 42%, transparent 100%); }
.rls-fig-l { left:-2vw; }
.rls-fig-r { right:-2vw; transform:scaleX(-1); background-image:url('../games/shui/assets/char-civilian.jpg?v=6'); }
.rls-ph-peek .rls-art { filter: brightness(.72) saturate(.9); }
.rls-stage.rls-ph-vote::after { background: radial-gradient(120% 80% at 50% 30%, transparent 45%, rgba(120,10,30,.45) 100%); }
.rls-ph-out .rls-art { filter: brightness(.8) saturate(.8); }
.rls-ph-over .rls-art { filter: brightness(1.05) saturate(1.1); }
.rls-wall.many .rls-ava { width:56px; height:56px; font-size:24px; }
.rls-wall.many .rls-seat { padding:8px 4px; gap:4px; }
.rls-wall.many .rls-seat-name { font-size:16px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rls-wall.many .rls-seat-votes { font-size:14px; }
.rls-wall.xmany { grid-template-columns:repeat(10,1fr); gap:8px; max-width:1400px; }
.rls-wall.xmany .rls-ava { width:46px; height:46px; font-size:20px; }
.rls-wall.xmany .rls-seat-name { font-size:14px; }
.rls-wall.xmany .rls-seat { padding:6px 2px; }
.rls-seat {
  background:rgba(255,255,255,.07); border:1.5px solid rgba(255,255,255,.12);
  border-radius:20px; padding:18px 10px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  transition:transform .2s ease, box-shadow .2s ease;
}
.rls-seat.tie { border-color:#ffd27a; box-shadow:0 0 0 3px rgba(255,210,122,.35); }
.rls-seat.dead { opacity:.4; filter:grayscale(.7); }
.rls-ava { width:78px; height:78px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:34px; font-weight:900; color:#fff; }
.rls-seat-name { font-size:22px; font-weight:900; }
.rls-seat-votes { font-size:18px; font-weight:800; color:#ffd27a; }
.rls-seat-dash { color:#5a649c; }
.rls-seat-out { font-size:14px; color:#8d96c9; }
.rls-phase-pill { display:inline-block; font-size:20px; font-weight:800; color:#cdd4ff; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); padding:8px 22px; border-radius:999px; }
.rls-phase-pill.danger { color:#ff9aa9; background:rgba(255,93,115,.14); border-color:rgba(255,93,115,.4); }
.rls-rules { display:flex; gap:18px; margin:10px 0 8px; }
.rls-rules span { font-size:20px; color:#cdd4ff; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); padding:10px 20px; border-radius:14px; }
.rls-out { text-align:center; }
.rls-out-ico { font-size:100px; margin:6px 0; }
.rls-out-label { font-size:24px; color:#b6bdee; }
.rls-out-name { font-size:86px; font-weight:900; color:#fff; margin:6px 0; text-shadow:0 8px 30px rgba(0,0,0,.5); }
.rls-out-role { font-size:34px; font-weight:900; }
.rls-out-role b { font-size:40px; }
.rls-out-role.uc b { color:#ff8ba0; }
.rls-out-role.civ b { color:#7ee8f5; }
.rls-over-banner { font-size:64px; font-weight:900; padding:26px 70px; border-radius:26px; margin-bottom:26px; }
.rls-over-banner.uc { background:linear-gradient(135deg,#ff5d73,#c92a4d); box-shadow:0 18px 50px rgba(255,93,115,.45); }
.rls-over-banner.civ { background:linear-gradient(135deg,#4dd0e1,#1c7ed6); box-shadow:0 18px 50px rgba(77,208,225,.4); }
.rls-words-reveal { display:flex; align-items:center; gap:26px; justify-content:center; margin-bottom:26px; }
.rls-wr { text-align:center; border-radius:22px; padding:22px 44px; }
.rls-wr label { display:block; font-size:20px; color:#b6bdee; margin-bottom:8px; }
.rls-wr b { font-size:56px; font-weight:900; }
.rls-wr.civ { background:rgba(77,208,225,.12); border:2px solid rgba(77,208,225,.4); }
.rls-wr.civ b { color:#8ef2ff; }
.rls-wr.uc { background:rgba(255,93,115,.12); border:2px solid rgba(255,93,115,.4); }
.rls-wr.uc b { color:#ff9aaa; }
.rls-wr-vs { font-size:30px; font-weight:900; color:#ffd27a; }
.rls-final { display:grid; grid-template-columns:repeat(auto-fit,minmax(104px,1fr)); gap:12px; max-width:1200px; width:100%; }
.rls-final.many { grid-template-columns:repeat(auto-fit,minmax(92px,1fr)); gap:8px; }
.rls-final.many .rls-final-n { font-size:15px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.rls-final.many .rls-final-tag { font-size:13px; }
.rls-final.many .rls-final-seat { padding:10px 4px; gap:4px; }
.rls-final.many .rls-ava { width:54px; height:54px; font-size:22px; }
.rls-final-seat { background:rgba(255,255,255,.07); border:1.5px solid rgba(255,255,255,.12); border-radius:18px; padding:16px 8px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:6px; }
.rls-final-seat.uc { background:rgba(255,93,115,.16); border-color:rgba(255,93,115,.5); }
.rls-final-seat.dead { opacity:.5; }
.rls-final-n { font-size:21px; font-weight:900; }
.rls-final-tag { font-size:16px; font-weight:800; }
.rls-final-seat.uc .rls-final-tag { color:#ff9aaa; }
.rls-final-seat.civ .rls-final-tag { color:#8ef2ff; }

/* 讲师台 */
.rlc-form { display:flex; gap:16px; align-items:flex-end; flex-wrap:wrap; margin:16px 0; }
.rlc-field { display:flex; flex-direction:column; gap:8px; }
.rlc-field.grow { flex:1; min-width:240px; }
.rlc-field label { font-size:13px; font-weight:800; color:#6b7280; }
.rlc-stepper { display:flex; align-items:center; gap:10px; }
.rlc-stepper button { width:38px; height:38px; border-radius:10px; font-size:18px; font-weight:900; }
.rlc-stepper b { min-width:34px; text-align:center; font-size:22px; }
.rlc-select { height:40px; border:1px solid #d6d9e6; border-radius:10px; padding:0 12px; font-size:14px; background:#fff; }
.rlc-join-bar { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:14px 0; }
.rlc-join-count { font-size:15px; font-weight:800; color:#3730a3; }
.rlc-join-count b { color:#d97706; font-size:20px; }
.rlc-roster { display:flex; flex-direction:column; gap:7px; max-height:360px; overflow:auto; }
.rlc-player { display:flex; align-items:center; gap:10px; padding:9px 12px; border-radius:12px; background:#f7f8fc; border:1px solid #eceef6; }
.rlc-player.uc { background:#fff1f3; border-color:#ffd4dc; }
.rlc-player.dead { opacity:.45; }
.rlc-seat { width:26px; height:26px; border-radius:50%; background:#6366f1; color:#fff; font-size:12px; font-weight:900; display:flex; align-items:center; justify-content:center; }
.rlc-name { font-weight:800; min-width:64px; }
.rlc-unit { font-size:12px; color:#9aa0b5; flex:1; }
.rlc-votes { font-size:13px; font-weight:900; color:#d97706; min-width:36px; }
.rlc-tag { font-size:12px; font-weight:800; }
.rlc-player.uc .rlc-tag { color:#e11d48; }
.rlc-player.civ .rlc-tag { color:#0e7490; }
.rlc-words-teacher { display:flex; align-items:center; gap:14px; margin:16px 0; }
.rlc-wt { flex:1; text-align:center; border-radius:14px; padding:14px; }
.rlc-wt label { display:block; font-size:12px; color:#6b7280; margin-bottom:4px; }
.rlc-wt b { font-size:26px; }
.rlc-wt.civ { background:#ecfeff; border:1.5px solid #67e8f9; }
.rlc-wt.civ b { color:#0e7490; }
.rlc-wt.uc { background:#fff1f2; border:1.5px solid #fda4af; }
.rlc-wt.uc b { color:#be123c; }
.rlc-wt-vs { font-weight:900; color:#d97706; }
.rlc-live-hint { font-size:16px; color:#374151; line-height:1.7; margin:10px 0; }
.rlc-live-hint b { color:#d97706; }
.rlc-tally-box { margin:12px 0; }
.rlc-tally { display:flex; align-items:center; gap:10px; margin-bottom:8px; }
.rlc-tally .n { width:80px; font-weight:800; font-size:14px; }
.rlc-tally .bar { flex:1; height:14px; background:#eef0f7; border-radius:999px; overflow:hidden; }
.rlc-tally .bar i { display:block; height:100%; background:linear-gradient(90deg,#6366f1,#fb7185); }
.rlc-tally b { width:30px; text-align:center; color:#d97706; }
.rlc-outbox { border-radius:16px; padding:20px; text-align:center; margin:12px 0; }
.rlc-outbox.uc { background:#fff1f2; border:1.5px solid #fda4af; }
.rlc-outbox.civ { background:#ecfeff; border:1.5px solid #67e8f9; }
.rlc-outbox .o-name { font-size:26px; font-weight:900; }
.rlc-outbox .o-role { font-size:18px; font-weight:800; margin-top:6px; }
.rlc-outbox.uc .o-role { color:#be123c; }
.rlc-outbox.civ .o-role { color:#0e7490; }
.rlc-overbox { font-size:30px; font-weight:900; text-align:center; padding:24px; border-radius:18px; margin:10px 0; }
.rlc-overbox.uc { background:#fff1f2; color:#be123c; }
.rlc-overbox.civ { background:#ecfeff; color:#0e7490; }

/* ===== 谁是卧底·侦探悬疑风：手机端彻底覆盖敦煌外壳背景（不串国风） ===== */
body.theme-detective { background: #0b0f26 !important; }
body.theme-detective .shell-bg {
  background: radial-gradient(135% 82% at 50% -12%, #2b3678 0%, #1b2250 40%, #11173a 70%, #0b0f26 100%) !important;
}
body.theme-detective .shell-bg::before,
body.theme-detective .shell-bg::after { display: none !important; }
body.theme-detective .cloud { display: none !important; }
body.theme-detective::before { content:""; position:fixed; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(28vmax 28vmax at 12% 8%, rgba(139,123,255,.14), transparent 60%),
    radial-gradient(30vmax 30vmax at 88% 88%, rgba(77,208,225,.10), transparent 60%); }

/* =====================================================================
   看字说颜色（reaction）· 波普综艺明亮风
   大屏 .rxs- / 讲师 .rxc- / 手机 .rxm-；游戏专属氛围，不套国风
   ===================================================================== */

/* ---- 背景覆盖（大屏 + 手机） ---- */
body.theme-reaction {
  background: #fff3d2 !important;
  color: #2b2440;
}
body.theme-reaction .shell-bg {
  background:
    radial-gradient(120% 70% at 50% -10%, #fffaf0 0%, #ffeeb8 52%, #ffd879 100%) !important;
}
body.theme-reaction .shell-bg::before,
body.theme-reaction .shell-bg::after { display: none !important; }
body.theme-reaction .cloud { display: none !important; }
body.theme-reaction::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(18vmax 18vmax at 8% 14%, rgba(255,61,127,.10), transparent 60%),
    radial-gradient(20vmax 20vmax at 92% 12%, rgba(43,108,255,.10), transparent 60%),
    radial-gradient(24vmax 24vmax at 88% 92%, rgba(0,194,168,.12), transparent 60%),
    radial-gradient(22vmax 22vmax at 10% 90%, rgba(255,122,26,.12), transparent 60%);
}
body.theme-reaction::after {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(43,36,64,.10) 2px, transparent 2px);
  background-size: 34px 34px;
}

/* ================= 大屏 ================= */
.rxs-stage { position: relative; z-index: 1; min-height: 100vh; display: flex; flex-direction: column; padding: 2.2vh 3vw; }
.rxs-top { display: flex; align-items: center; justify-content: space-between; gap: 20px;
  background: #fff; border: 4px solid #2b2440; border-radius: 22px; padding: 14px 28px;
  box-shadow: 0 6px 0 #2b2440; }
.rxs-title { font-size: 1.9vw; font-weight: 900; color: #2b2440; letter-spacing: 1px; }
.rxs-stat { font-size: 1.25vw; font-weight: 800; color: #5a5178; background: #fff3d2;
  border: 3px solid #2b2440; border-radius: 999px; padding: 8px 22px; }
.rxs-stat b { color: #ff3d7f; font-size: 1.35em; }
.rxs-main { flex: 1; display: flex; align-items: center; justify-content: center; }

/* ready */
.rxs-ready { text-align: center; max-width: 70vw; }
.rxs-ready-badge { display: inline-block; background: #2b6cff; color: #fff; font-weight: 900;
  font-size: 1.3vw; padding: 10px 26px; border-radius: 999px; border: 3px solid #2b2440;
  box-shadow: 0 4px 0 #2b2440; transform: rotate(-2deg); }
.rxs-ready-h1 { font-size: 7vw; font-weight: 900; line-height: 1.05; margin: 18px 0 6px;
  color: #2b2440; letter-spacing: 4px;
  -webkit-text-stroke: 2px #fff; text-shadow: 5px 5px 0 #ff3d7f, 10px 10px 0 #ffd23f; }
.rxs-ready-demo { display: flex; align-items: center; justify-content: center; gap: 24px; margin: 26px 0; }
.rxs-demo-w { font-size: 6vw; font-weight: 900; -webkit-text-stroke: 3px #fff;
  text-shadow: 0 4px 0 rgba(0,0,0,.18); }
.rxs-demo-arrow { font-size: 2vw; font-weight: 900; color: #2b2440; background: #ffd23f;
  border: 3px solid #2b2440; border-radius: 999px; padding: 6px 18px; }
.rxs-demo-say { font-size: 6vw; font-weight: 900; color: #fff; background: #22c55e;
  border: 4px solid #2b2440; border-radius: 24px; padding: 0 26px; box-shadow: 0 6px 0 #2b2440; }
.rxs-ready-sub { font-size: 1.7vw; font-weight: 800; color: #2b2440; line-height: 1.6; }
.rxs-ready-sub b { color: #ff3d7f; }
.rxs-ready-rounds { display: flex; gap: 18px; justify-content: center; margin: 30px 0 22px; flex-wrap: wrap; }
.rxs-rchip { background: #fff; border: 4px solid #2b2440; border-radius: 18px; padding: 16px 24px;
  box-shadow: 0 6px 0 #2b2440; display: flex; flex-direction: column; gap: 4px; min-width: 13vw; }
.rxs-rchip b { font-size: 1.5vw; color: #2b6cff; }
.rxs-rchip span { font-size: 1.1vw; font-weight: 800; color: #2b2440; }
.rxs-rchip small { font-size: .95vw; color: #7a7199; font-weight: 700; }
.rxs-ready-hint { font-size: 1.15vw; font-weight: 700; color: #5a5178; }

/* countdown */
.rxs-cd { text-align: center; }
.rxs-cd-num { font-size: 22vw; font-weight: 900; color: #ff3d7f; line-height: 1;
  -webkit-text-stroke: 4px #fff; text-shadow: 0 10px 0 #2b2440; animation: rxPop .5s cubic-bezier(.2,1.6,.4,1) both; }
.rxs-cd-txt { font-size: 2.2vw; font-weight: 900; color: #2b2440; margin-top: 10px; }

/* play */
.rxs-play { width: 100%; text-align: center; }
.rxs-beat { height: 22px; background: #fff; border: 4px solid #2b2440; border-radius: 999px;
  overflow: hidden; box-shadow: 0 4px 0 #2b2440; margin-bottom: 3vh; }
.rxs-beat-bar { height: 100%; width: 100%; border-radius: 999px;
  background: linear-gradient(90deg, #22c55e 0%, #ffd23f 55%, #ff3d7f 100%); }
.rxs-card { background: #fff; border: 6px solid #2b2440; border-radius: 36px;
  box-shadow: 0 12px 0 #2b2440; padding: 4vh 3vw; margin: 0 auto; max-width: 60vw; }
.rxs-word { font-size: 20vw; font-weight: 900; line-height: 1; letter-spacing: 4px;
  -webkit-text-stroke: 5px #fff; paint-order: stroke fill;
  text-shadow: 0 8px 0 rgba(43,36,64,.22); animation: rxPop .22s cubic-bezier(.2,1.5,.4,1) both; }
.rxs-word-tag { font-size: 1.5vw; font-weight: 900; color: #7a7199; margin-top: 1.5vh; }
.rxs-live { display: flex; gap: 22px; justify-content: center; margin: 3vh 0 1.5vh; }
.rxs-live-cell { background: #fff; border: 4px solid #2b2440; border-radius: 20px; padding: 14px 34px;
  box-shadow: 0 5px 0 #2b2440; min-width: 9vw; }
.rxs-live-cell .rxs-live-n { display: block; font-size: 2.6vw; font-weight: 900; color: #2b6cff; line-height: 1; }
.rxs-live-cell.ok .rxs-live-n { color: #22c55e; }
.rxs-live-cell label { font-size: 1.05vw; font-weight: 800; color: #7a7199; }
.rxs-prog { font-size: 1.3vw; font-weight: 900; color: #2b2440; }

/* round end / over */
.rxs-end { width: 72vw; text-align: center; }
.rxs-end-banner { display: inline-block; background: #ff3d7f; color: #fff; font-size: 2.4vw;
  font-weight: 900; padding: 14px 44px; border-radius: 20px; border: 4px solid #2b2440;
  box-shadow: 0 6px 0 #2b2440; transform: rotate(-1deg); margin-bottom: 24px; }
.rxs-over-banner { display: inline-block; background: #ffd23f; color: #2b2440; font-size: 2.4vw;
  font-weight: 900; padding: 14px 44px; border-radius: 20px; border: 4px solid #2b2440;
  box-shadow: 0 6px 0 #2b2440; transform: rotate(-1deg); margin-bottom: 24px; }
.rxs-end-kpis { display: flex; gap: 20px; justify-content: center; margin-bottom: 22px; }
.rxs-kpi { background: #fff; border: 4px solid #2b2440; border-radius: 18px; padding: 16px 30px;
  box-shadow: 0 5px 0 #2b2440; min-width: 12vw; }
.rxs-kpi b { display: block; font-size: 2.6vw; font-weight: 900; color: #2b6cff; }
.rxs-kpi label { font-size: 1.05vw; font-weight: 800; color: #7a7199; }
.rxs-board { background: #fff; border: 4px solid #2b2440; border-radius: 22px; overflow: hidden;
  box-shadow: 0 6px 0 #2b2440; }
.rxs-board-head, .rxs-board-row { display: grid; grid-template-columns: 1.2fr 3fr 1.4fr 1.4fr 1.4fr;
  align-items: center; padding: 14px 22px; }
.rxs-board-head { background: #2b2440; color: #fff; font-weight: 900; font-size: 1.1vw; }
.rxs-board-row { border-top: 2px solid #efe6c8; font-size: 1.25vw; font-weight: 800; }
.rxs-board-row:nth-child(even) { background: #fffaf0; }
.rxs-board-row .rxs-rk { font-size: 1.4em; }
.rxs-board-row .rxs-nm { text-align: left; font-weight: 900; }
.rxs-board-row .rxs-ok { color: #22c55e; font-weight: 900; }
.rxs-finalboard .rxs-board-head, .rxs-finalboard .rxs-board-row { grid-template-columns: 1.2fr 3fr 1.6fr 1.6fr; }
.rxs-score { color: #ff7a1a; font-weight: 900; }
.rxs-end-hint { font-size: 1.1vw; font-weight: 800; color: #7a7199; margin-top: 18px; }

@keyframes rxPop { 0% { transform: scale(.55); opacity: .2; } 70% { transform: scale(1.08); } 100% { transform: scale(1); opacity: 1; } }

/* ================= 讲师台 ================= */
.rxc-rounds { display: flex; gap: 14px; flex-wrap: wrap; margin: 16px 0; }
.rxc-round { flex: 1; min-width: 180px; text-align: left; background: #fff; border: 3px solid #2b2440;
  border-radius: 16px; padding: 16px 18px; cursor: pointer; box-shadow: 0 4px 0 #2b2440;
  transition: transform .12s ease; }
.rxc-round:hover { transform: translateY(-3px); }
.rxc-round:active { transform: translateY(1px); box-shadow: 0 2px 0 #2b2440; }
.rxc-round b { display: block; font-size: 17px; color: #2b6cff; margin-bottom: 6px; }
.rxc-round span { font-size: 13px; font-weight: 700; color: #5a5178; }
.rxc-center { text-align: center; }
.rxc-big { font-size: 64px; font-weight: 900; color: #ff3d7f; margin: 24px 0; }
.rxc-now { display: flex; align-items: center; gap: 30px; justify-content: center; margin: 18px 0; }
.rxc-now-word { width: 180px; height: 180px; background: #fff; border: 4px solid #2b2440;
  border-radius: 22px; display: flex; align-items: center; justify-content: center;
  font-size: 110px; font-weight: 900; -webkit-text-stroke: 3px #fff; box-shadow: 0 6px 0 #2b2440; }
.rxc-now-ans { font-size: 20px; font-weight: 900; }
.rxc-prog { font-weight: 800; color: #5a5178; margin-bottom: 14px; }
.rxc-kpis { display: flex; gap: 12px; margin: 14px 0; }
.rxc-kpi { flex: 1; background: #fff; border: 3px solid #2b2440; border-radius: 14px; text-align: center;
  padding: 12px; box-shadow: 0 4px 0 #2b2440; }
.rxc-kpi b { display: block; font-size: 28px; color: #2b6cff; }
.rxc-kpi span { font-size: 13px; font-weight: 700; color: #7a7199; }
.rxc-board { border: 2px solid #2b2440; border-radius: 14px; overflow: hidden; margin: 12px 0; }
.rxc-row { display: grid; grid-template-columns: .7fr 2fr 1fr 1fr 1fr; align-items: center;
  padding: 10px 16px; border-top: 1px solid #eee; font-weight: 700; font-size: 14px; background: #fff; }
.rxc-row:first-child { border-top: 0; }
.rxc-nm { font-weight: 900; }
.rxc-ok { color: #22c55e; font-weight: 900; }
.rxc-sc { color: #ff7a1a; font-weight: 900; }
.rxc-side-stats { display: flex; gap: 10px; margin: 12px 0; }
.rxc-side-stats > div { flex: 1; text-align: center; background: #fff8e6; border: 2px solid #2b2440;
  border-radius: 12px; padding: 10px 6px; }
.rxc-ss-n { display: block; font-size: 26px; font-weight: 900; color: #2b6cff; }
.rxc-ss-n.ok { color: #22c55e; }
.rxc-side-stats label { font-size: 12px; font-weight: 700; color: #7a7199; }

/* ================= 手机 ================= */
.rxm-wrap { position: relative; z-index: 1; min-height: 100vh; display: flex; flex-direction: column; }
.rxm-head { display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; }
.rxm-badge { background: #2b6cff; color: #fff; font-weight: 900; font-size: 15px;
  padding: 8px 16px; border-radius: 999px; border: 2px solid #2b2440; box-shadow: 0 3px 0 #2b2440; }
.rxm-score { background: #fff; color: #ff7a1a; font-weight: 900; font-size: 16px;
  padding: 8px 16px; border-radius: 999px; border: 2px solid #2b2440; box-shadow: 0 3px 0 #2b2440; }
.rxm-body { flex: 1; display: flex; flex-direction: column; padding: 8px 16px 20px; }

.rxm-ready { text-align: center; margin: auto; }
.rxm-h1 { font-size: 46px; font-weight: 900; color: #2b2440; letter-spacing: 3px;
  -webkit-text-stroke: 1.5px #fff; text-shadow: 3px 3px 0 #ff3d7f; }
.rxm-demo { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 24px 0; }
.rxm-dw, .rxm-ds { font-size: 56px; font-weight: 900; -webkit-text-stroke: 2px #fff; }
.rxm-ar { font-size: 28px; font-weight: 900; }
.rxm-ds { color: #fff; background: #22c55e; border: 3px solid #2b2440; border-radius: 16px; padding: 0 16px; }
.rxm-sub { font-size: 17px; font-weight: 800; color: #2b2440; line-height: 1.6; }
.rxm-wait { margin-top: 34px; background: #fff; border: 3px solid #2b2440; border-radius: 16px;
  padding: 16px; font-weight: 800; color: #5a5178; box-shadow: 0 4px 0 #2b2440; }

.rxm-cd { text-align: center; margin: auto; }
.rxm-cd-num { font-size: 180px; font-weight: 900; color: #ff3d7f; line-height: 1;
  -webkit-text-stroke: 3px #fff; text-shadow: 0 8px 0 #2b2440; animation: rxPop .5s cubic-bezier(.2,1.6,.4,1) both; }
.rxm-cd-txt { font-size: 22px; font-weight: 900; margin-top: 8px; }

.rxm-play { display: flex; flex-direction: column; }
.rxm-meta { display: flex; justify-content: space-between; font-weight: 900; color: #2b2440; font-size: 15px; }
.rxm-beat { height: 14px; background: #fff; border: 2px solid #2b2440; border-radius: 999px;
  overflow: hidden; margin: 10px 0; }
.rxm-beat-bar { height: 100%; width: 100%;
  background: linear-gradient(90deg, #22c55e, #ffd23f 60%, #ff3d7f); }
.rxm-word-card { background: #fff; border: 4px solid #2b2440; border-radius: 26px;
  box-shadow: 0 6px 0 #2b2440; padding: 18px; text-align: center; margin: 6px 0 12px; transition: transform .1s; }
.rxm-word-card.right { border-color: #22c55e; box-shadow: 0 6px 0 #22c55e; }
.rxm-word-card.wrong { border-color: #ff3d7f; box-shadow: 0 6px 0 #ff3d7f; animation: rxShake .3s; }
.rxm-word { font-size: 96px; font-weight: 900; line-height: 1; -webkit-text-stroke: 3px #fff;
  paint-order: stroke fill; animation: rxPop .2s cubic-bezier(.2,1.5,.4,1) both; }
.rxm-word-tag { font-size: 16px; font-weight: 900; color: #7a7199; margin-top: 8px; }
.rxm-word-card.right .rxm-word-tag { color: #22c55e; }
.rxm-word-card.wrong .rxm-word-tag { color: #ff3d7f; }
.rxm-combo { text-align: center; font-weight: 900; font-size: 16px; color: #2b2440; margin-bottom: 12px; }
.rxm-combo b { color: #ff3d7f; font-size: 1.2em; }
.rxm-combo.hot { color: #ff7a1a; }
.rxm-keys { display: grid; gap: 12px; }
.rxm-key { height: 76px; border: 3px solid #2b2440; border-radius: 20px; background: var(--kc);
  box-shadow: 0 5px 0 #2b2440; cursor: pointer; transition: transform .08s, box-shadow .08s;
  position: relative; overflow: hidden; }
.rxm-key span { font-size: 34px; font-weight: 900; color: #fff; -webkit-text-stroke: 1px rgba(0,0,0,.35);
  text-shadow: 0 2px 0 rgba(0,0,0,.25); }
.rxm-key:active { transform: translateY(4px); box-shadow: 0 1px 0 #2b2440; }
.rxm-key:disabled { opacity: .5; filter: grayscale(.3); }
.rxm-tip { text-align: center; font-size: 13px; font-weight: 700; color: #7a7199; margin-top: 12px; }

.rxm-end { text-align: center; margin: auto; width: 100%; }
.rxm-end-title { font-size: 30px; font-weight: 900; color: #fff; background: #ff3d7f;
  border: 3px solid #2b2440; border-radius: 16px; padding: 12px; box-shadow: 0 5px 0 #2b2440; display: inline-block; }
.rxm-over-title { font-size: 34px; font-weight: 900; color: #2b2440; margin-bottom: 16px; }
.rxm-mystats { display: flex; gap: 10px; margin: 20px 0; }
.rxm-mystats > div { flex: 1; background: #fff; border: 3px solid #2b2440; border-radius: 16px;
  padding: 14px 6px; box-shadow: 0 4px 0 #2b2440; }
.rxm-mystats b { display: block; font-size: 24px; color: #2b6cff; }
.rxm-mystats span { font-size: 13px; font-weight: 700; color: #7a7199; }
.rxm-myrank { font-size: 19px; font-weight: 900; margin: 14px 0; }
.rxm-myrank b { color: #ff7a1a; }
.rxm-toplist { background: #fff; border: 3px solid #2b2440; border-radius: 16px; overflow: hidden;
  box-shadow: 0 5px 0 #2b2440; text-align: left; }
.rxm-rank-row { display: grid; grid-template-columns: .8fr 3fr 1fr; align-items: center;
  padding: 11px 16px; border-top: 1px solid #eee; font-weight: 800; }
.rxm-rank-row:first-child { border-top: 0; }
.rxm-rank-row.me { background: #fff3d2; }
.rxm-rank-row .nm { font-weight: 900; }
.rxm-rank-row .sc { text-align: right; color: #ff7a1a; font-weight: 900; }

@keyframes rxShake { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-6px)} 75%{transform:translateX(6px)} }

/* ---- 性能档：极简关弹跳/阴影，保证普通办公本流畅 ---- */
html[data-perf="minimal"] .rxs-word,
html[data-perf="minimal"] .rxs-cd-num,
html[data-perf="minimal"] .rxm-word,
html[data-perf="minimal"] .rxm-cd-num { animation: none; }
html[data-perf="minimal"] .rxs-card,
html[data-perf="minimal"] .rxs-board,
html[data-perf="minimal"] .rxm-word-card,
html[data-perf="minimal"] .rxm-keys .rxm-key { box-shadow: none; }
html[data-perf="minimal"] .rxs-ready-h1 { text-shadow: none; -webkit-text-stroke: 0; }
html[data-perf="smooth"] .rxs-word,
html[data-perf="smooth"] .rxm-word { animation-duration: .15s; }


/* ============================================================
   果蔬碰碰碰 · 清新农场风（一款一视觉，非国风、非波普）
   主色：蔬菜绿 #43a047 / 水果红 #ef5350 / 丰收橙 #ff8f00 / 暖米 #fffdf4
   描边：深叶绿 #2e5d24
   ============================================================ */
body.theme-guoshu { background: #eefbe7 !important; color: #25471c; }
body.theme-guoshu .shell-bg {
  background:
    radial-gradient(120% 72% at 50% -12%, #ffffff 0%, #eafabf 54%, #c9f0a8 100%) !important;
}
body.theme-guoshu .shell-bg::before,
body.theme-guoshu .shell-bg::after { display: none !important; }
body.theme-guoshu .cloud { display: none !important; }
body.theme-guoshu::before {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(16vmax 16vmax at 7% 12%, rgba(239,83,80,.12), transparent 60%),
    radial-gradient(20vmax 20vmax at 94% 10%, rgba(255,143,0,.14), transparent 60%),
    radial-gradient(24vmax 24vmax at 90% 92%, rgba(67,160,71,.16), transparent 60%),
    radial-gradient(20vmax 20vmax at 8% 90%, rgba(67,160,71,.12), transparent 60%);
}
body.theme-guoshu::after {
  content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .35;
  background-image: radial-gradient(rgba(46,93,36,.12) 2px, transparent 2px);
  background-size: 40px 40px;
}
body.theme-guoshu .rxs-top { border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; }
body.theme-guoshu .rxs-title { color: #25471c; }
body.theme-guoshu .rxs-stat { background: #effbe7; border-color: #2e5d24; color: #3d6b2f; }
body.theme-guoshu .rxs-stat b { color: #ef5350; }
body.theme-guoshu .rxs-ready-badge { background: #43a047; border-color: #2e5d24; box-shadow: 0 4px 0 #2e5d24; }
body.theme-guoshu .rxs-ready-h1 { color: #25471c; -webkit-text-stroke: 2px #fff;
  text-shadow: 5px 5px 0 #ff8f00, 10px 10px 0 #a5d66a; }
body.theme-guoshu .rxs-demo-arrow { background: #ffd54f; border-color: #2e5d24; }
body.theme-guoshu .rxs-demo-say { background: #43a047; border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; }
body.theme-guoshu .rxs-ready-sub b { color: #ef5350; }
body.theme-guoshu .rxs-rchip { border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; }
body.theme-guoshu .rxs-rchip b { color: #43a047; }
body.theme-guoshu .rxs-cd-num { color: #ff8f00; text-shadow: 0 10px 0 #2e5d24; }
body.theme-guoshu .rxs-beat { border-color: #2e5d24; box-shadow: 0 4px 0 #2e5d24; }
body.theme-guoshu .rxs-beat-bar { background: linear-gradient(90deg, #43a047 0%, #ffd54f 55%, #ef5350 100%); }
body.theme-guoshu .rxs-card { border-color: #2e5d24; box-shadow: 0 12px 0 #2e5d24; background: #fffdf4; }
body.theme-guoshu .rxs-live-cell { border-color: #2e5d24; box-shadow: 0 5px 0 #2e5d24; }
body.theme-guoshu .rxs-live-cell .rxs-live-n { color: #43a047; }
body.theme-guoshu .rxs-end-banner { background: #ef5350; border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; }
body.theme-guoshu .rxs-over-banner { background: #ffd54f; border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; }
body.theme-guoshu .rxs-kpi { border-color: #2e5d24; box-shadow: 0 5px 0 #2e5d24; }
body.theme-guoshu .rxs-kpi b { color: #43a047; }
body.theme-guoshu .rxs-board { border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; }
body.theme-guoshu .rxs-board-head { background: #2e5d24; }
body.theme-guoshu .rxs-board-row:nth-child(even) { background: #f4fde9; }
body.theme-guoshu .rxs-board-row .rxs-ok { color: #43a047; }
body.theme-guoshu .rxs-score { color: #ef5350; }

/* 大屏中央果蔬图标 */
.rxs-card.sort { display: flex; flex-direction: column; align-items: center; }
.rxs-emoji { font-size: 17vw; line-height: 1; filter: drop-shadow(0 8px 0 rgba(46,93,36,.20));
  animation: rxPop .22s cubic-bezier(.2,1.5,.4,1) both; }
.rxs-item-name { font-size: 5.5vw; font-weight: 900; color: #25471c; letter-spacing: 6px; margin-top: 1vh;
  -webkit-text-stroke: 2px #fff; paint-order: stroke fill; }
.rxs-ready-demo.sort { gap: 18px; flex-wrap: wrap; }
.rxs-ready-demo.sort .rxs-demo-w { font-size: 4.6vw; }

/* 手机端 · 果蔬 */
.rxm-wrap.rxk-sort { background:
    radial-gradient(120% 60% at 50% -8%, #ffffff 0%, #eefabf 60%, #d6f3b0 100%); }
.rxm-wrap.rxk-sort .rxm-badge { background: #43a047; border-color: #2e5d24; box-shadow: 0 3px 0 #2e5d24; }
.rxm-wrap.rxk-sort .rxm-score { color: #ef5350; border-color: #2e5d24; box-shadow: 0 3px 0 #2e5d24; }
.rxm-wrap.rxk-sort .rxm-h1 { color: #25471c; text-shadow: 3px 3px 0 #ff8f00; -webkit-text-stroke: 1.5px #fff; }
.rxm-wrap.rxk-sort .rxm-ds { background: #43a047; border-color: #2e5d24; }
.rxm-wrap.rxk-sort .rxm-word-card { border-color: #2e5d24; box-shadow: 0 6px 0 #2e5d24; background: #fffdf4; }
.rxm-wrap.rxk-sort .rxm-word-card.right { border-color: #43a047; box-shadow: 0 6px 0 #43a047; }
.rxm-wrap.rxk-sort .rxm-word-card.wrong { border-color: #ef5350; box-shadow: 0 6px 0 #ef5350; }
.rxm-emoji { font-size: 130px; line-height: 1;
  filter: drop-shadow(0 6px 0 rgba(46,93,36,.18)); animation: rxPop .2s cubic-bezier(.2,1.5,.4,1) both; }
.rxm-word2 { font-size: 50px; font-weight: 900; color: #25471c; letter-spacing: 4px; margin-top: 6px;
  -webkit-text-stroke: 2px #fff; paint-order: stroke fill; }
.rxm-key.has-emoji { height: 120px; }
.rxm-key.has-emoji span { font-size: 50px; display: flex; flex-direction: column; align-items: center;
  line-height: 1.05; -webkit-text-stroke: 0; }
.rxm-key.has-emoji span i { font-style: normal; font-size: 26px; font-weight: 900; margin-top: 2px;
  -webkit-text-stroke: 1px rgba(0,0,0,.25); }
.rxm-keys.two { gap: 14px; }
.rxm-wrap.rxk-sort .rxm-cd-num { color: #ff8f00; text-shadow: 0 8px 0 #2e5d24; }

/* 讲师台 · 当前物品 */
.rxc-now-item { font-size: 56px; font-weight: 900; background: #fffdf4; border: 4px solid #2e5d24;
  border-radius: 20px; padding: 18px 28px; box-shadow: 0 6px 0 #2e5d24; color: #25471c; }
.rxc-now-item b { font-size: 40px; }

html[data-perf="minimal"] .rxs-emoji,
html[data-perf="minimal"] .rxm-emoji { animation: none; filter: none; }


/* ===== 现场版（live · 不扫码）reaction 大屏：小组代币条 / 动作提示 / 小组榜 ===== */
.rxs-stage.rx-live .rxs-top { margin-bottom: 6px; }
.rxs-livebar { display: flex; justify-content: center; gap: 16px; flex-wrap: wrap; margin: 4px 0 10px; }
.rxs-lb { display: flex; align-items: center; gap: 10px; padding: 10px 22px; border-radius: 999px;
  background: rgba(255,255,255,.12); border: 1.5px solid rgba(255,220,150,.4);
  font-size: 30px; font-weight: 900; color: #fff; backdrop-filter: blur(6px);
  box-shadow: 0 6px 18px rgba(0,0,0,.18); }
.rxs-lb .rxs-lb-u { font-size: 22px; font-weight: 800; opacity: .92; }
.rxs-lb b { color: #ffd76a; font-size: 34px; min-width: 40px; text-align: center; }
.rxs-live-act { display: flex; justify-content: center; gap: 22px; margin-top: 22px; flex-wrap: wrap; }
.rxs-la { font-size: 40px; font-weight: 900; color: #fff; padding: 18px 38px; border-radius: 22px;
  background: linear-gradient(135deg, rgba(255,170,60,.92), rgba(255,120,40,.92));
  box-shadow: 0 10px 26px rgba(255,120,40,.32); animation: rxsLaPulse 1.6s ease-in-out infinite; }
.rx-live.rxk-stroop .rxs-la { background: linear-gradient(135deg, rgba(80,120,255,.92), rgba(120,70,230,.92)); box-shadow: 0 10px 26px rgba(90,90,255,.32); }
@keyframes rxsLaPulse { 0%,100% { transform: scale(1); } 50% { transform: scale(1.05); } }
.rxs-live-tip { font-size: 34px; font-weight: 800; color: #ffe3a0; text-align: center; margin: 8px 0 22px; }
.rx-live .rxs-board-row { grid-template-columns: 120px 1fr 220px !important; }
/* ===== 做相反 opposite（亮紫反差）===== */
body.theme-opposite { background: #f2ecfd !important; color: #3a2570; }
body.theme-opposite .shell-bg { background: radial-gradient(120% 72% at 50% -12%, #ffffff 0%, #e6d8fb 55%, #cdb6f6 100%) !important; }
body.theme-opposite .shell-bg::before, body.theme-opposite .shell-bg::after { display:none !important; }
body.theme-opposite .cloud { display:none !important; }
body.theme-opposite .rxs-top { border-color:#5b3c9e; box-shadow:0 6px 0 #5b3c9e; }
body.theme-opposite .rxs-title { color:#3a2570; }
body.theme-opposite .rxs-stat { background:#f3ecfd; border-color:#5b3c9e; color:#5b3c9e; }
body.theme-opposite .rxs-stat b { color:#8b5cf6; }
body.theme-opposite .rxs-ready-badge { background:#8b5cf6; border-color:#5b3c9e; box-shadow:0 4px 0 #5b3c9e; }
body.theme-opposite .rxs-ready-h1 { color:#3a2570; -webkit-text-stroke:2px #fff; text-shadow:5px 5px 0 #ffd166, 10px 10px 0 #cdb6f6; }
body.theme-opposite .rxs-demo-arrow { background:#ffd166; border-color:#5b3c9e; }
body.theme-opposite .rxs-demo-say { background:#8b5cf6; border-color:#5b3c9e; box-shadow:0 6px 0 #5b3c9e; }
body.theme-opposite .rxs-rchip { border-color:#5b3c9e; box-shadow:0 6px 0 #5b3c9e; }
body.theme-opposite .rxs-rchip b { color:#8b5cf6; }
body.theme-opposite .rxs-cd-num { color:#8b5cf6; text-shadow:0 10px 0 #5b3c9e; }
body.theme-opposite .rxs-beat { border-color:#5b3c9e; box-shadow:0 4px 0 #5b3c9e; }
body.theme-opposite .rxs-beat-bar { background:linear-gradient(90deg,#8b5cf6 0%,#ffd166 55%,#ec5d9a 100%); }
body.theme-opposite .rxs-card { border-color:#5b3c9e; box-shadow:0 12px 0 #5b3c9e; background:#fffdf8; }
body.theme-opposite .rxs-item-name { color:#3a2570; }
body.theme-opposite .rxs-end-banner, body.theme-opposite .rxs-over-banner { background:#8b5cf6; border-color:#5b3c9e; box-shadow:0 6px 0 #5b3c9e; }
body.theme-opposite .rxs-kpi { border-color:#5b3c9e; box-shadow:0 5px 0 #5b3c9e; }
body.theme-opposite .rxs-kpi b { color:#8b5cf6; }
body.theme-opposite .rxs-board { border-color:#5b3c9e; box-shadow:0 6px 0 #5b3c9e; }
body.theme-opposite .rxs-board-head { background:#5b3c9e; }
body.theme-opposite .rxs-board-row:nth-child(even) { background:#f4edfe; }
body.theme-opposite .rxs-score { color:#8b5cf6; }
body.theme-opposite .rxs-la { background:linear-gradient(135deg,#8b5cf6,#ec5d9a); box-shadow:0 10px 26px rgba(139,92,246,.32); }
.rxm-wrap.rxk-opposite { background:radial-gradient(120% 60% at 50% -8%,#ffffff 0%,#e9dbfb 60%,#d3baf7 100%); }
.rxm-wrap.rxk-opposite .rxm-badge { background:#8b5cf6; border-color:#5b3c9e; box-shadow:0 3px 0 #5b3c9e; }
.rxm-wrap.rxk-opposite .rxm-word-card { border-color:#5b3c9e; box-shadow:0 6px 0 #5b3c9e; background:#fffdf8; }
.rxm-wrap.rxk-opposite .rxm-word-card.right { border-color:#8b5cf6; box-shadow:0 6px 0 #8b5cf6; }
.rxm-wrap.rxk-opposite .rxm-word-card.wrong { border-color:#ec407a; box-shadow:0 6px 0 #ec407a; }
.rxm-wrap.rxk-opposite .rxm-cd-num { color:#8b5cf6; text-shadow:0 8px 0 #5b3c9e; }

/* ===== 气球 qiqiu（天空蓝 + 派对粉）===== */
body.theme-qiqiu { background:#e9f5ff !important; color:#0f3a63; }
body.theme-qiqiu .shell-bg { background:radial-gradient(120% 72% at 50% -12%,#ffffff 0%,#d3e9ff 55%,#b6d9ff 100%) !important; }
body.theme-qiqiu .shell-bg::before, body.theme-qiqiu .shell-bg::after { display:none !important; }
body.theme-qiqiu .cloud { display:none !important; }
body.theme-qiqiu .rxs-top { border-color:#1565c0; box-shadow:0 6px 0 #1565c0; }
body.theme-qiqiu .rxs-title { color:#0f3a63; }
body.theme-qiqiu .rxs-stat { background:#e9f5ff; border-color:#1565c0; color:#1565c0; }
body.theme-qiqiu .rxs-ready-badge { background:#1e88e5; border-color:#1565c0; box-shadow:0 4px 0 #1565c0; }
body.theme-qiqiu .rxs-ready-h1 { color:#0f3a63; -webkit-text-stroke:2px #fff; text-shadow:5px 5px 0 #ff8fb1, 10px 10px 0 #b6d9ff; }
body.theme-qiqiu .rxs-demo-arrow { background:#ffd166; border-color:#1565c0; }
body.theme-qiqiu .rxs-demo-say { background:#ec407a; border-color:#1565c0; box-shadow:0 6px 0 #1565c0; }
body.theme-qiqiu .rxs-rchip { border-color:#1565c0; box-shadow:0 6px 0 #1565c0; }
body.theme-qiqiu .rxs-rchip b { color:#1e88e5; }
body.theme-qiqiu .rxs-cd-num { color:#ec407a; text-shadow:0 10px 0 #1565c0; }
body.theme-qiqiu .rxs-beat { border-color:#1565c0; box-shadow:0 4px 0 #1565c0; }
body.theme-qiqiu .rxs-beat-bar { background:linear-gradient(90deg,#1e88e5 0%,#ffd166 55%,#ec407a 100%); }
body.theme-qiqiu .rxs-card { border-color:#1565c0; box-shadow:0 12px 0 #1565c0; background:#ffffff; }
body.theme-qiqiu .rxs-item-name { color:#0f3a63; }
body.theme-qiqiu .rxs-end-banner, body.theme-qiqiu .rxs-over-banner { background:#ec407a; border-color:#1565c0; box-shadow:0 6px 0 #1565c0; }
body.theme-qiqiu .rxs-board { border-color:#1565c0; box-shadow:0 6px 0 #1565c0; }
body.theme-qiqiu .rxs-board-head { background:#1565c0; }
body.theme-qiqiu .rxs-board-row:nth-child(even) { background:#eef6ff; }
body.theme-qiqiu .rxs-score { color:#ec407a; }
body.theme-qiqiu .rxs-la { background:linear-gradient(135deg,#1e88e5,#ec407a); box-shadow:0 10px 26px rgba(30,136,229,.32); }
.rxm-wrap.rxk-cue { background:radial-gradient(120% 60% at 50% -8%,#ffffff 0%,#d9edff 60%,#bfe0ff 100%); }
.rxm-wrap.rxk-cue .rxm-badge { background:#1e88e5; border-color:#1565c0; box-shadow:0 3px 0 #1565c0; }
.rxm-wrap.rxk-cue .rxm-word-card { border-color:#1565c0; box-shadow:0 6px 0 #1565c0; background:#fff; }
.rxm-wrap.rxk-cue .rxm-word-card.right { border-color:#1e88e5; box-shadow:0 6px 0 #1e88e5; }
.rxm-wrap.rxk-cue .rxm-word-card.wrong { border-color:#ec407a; box-shadow:0 6px 0 #ec407a; }

/* ===== 大风吹 dafeng（青蓝 + 琥珀）===== */
body.theme-dafeng { background:#e8f8f4 !important; color:#0c4a42; }
body.theme-dafeng .shell-bg { background:radial-gradient(120% 72% at 50% -12%,#ffffff 0%,#cdf2e8 55%,#a9e7d8 100%) !important; }
body.theme-dafeng .shell-bg::before, body.theme-dafeng .shell-bg::after { display:none !important; }
body.theme-dafeng .cloud { display:none !important; }
body.theme-dafeng .rxs-top { border-color:#00695c; box-shadow:0 6px 0 #00695c; }
body.theme-dafeng .rxs-title { color:#0c4a42; }
body.theme-dafeng .rxs-stat { background:#e8f8f4; border-color:#00695c; color:#00695c; }
body.theme-dafeng .rxs-ready-badge { background:#00897b; border-color:#00695c; box-shadow:0 4px 0 #00695c; }
body.theme-dafeng .rxs-ready-h1 { color:#0c4a42; -webkit-text-stroke:2px #fff; text-shadow:5px 5px 0 #ffca28, 10px 10px 0 #a9e7d8; }
body.theme-dafeng .rxs-demo-arrow { background:#ffd166; border-color:#00695c; }
body.theme-dafeng .rxs-demo-say { background:#fb8c00; border-color:#00695c; box-shadow:0 6px 0 #00695c; }
body.theme-dafeng .rxs-rchip { border-color:#00695c; box-shadow:0 6px 0 #00695c; }
body.theme-dafeng .rxs-rchip b { color:#00897b; }
body.theme-dafeng .rxs-cd-num { color:#fb8c00; text-shadow:0 10px 0 #00695c; }
body.theme-dafeng .rxs-beat { border-color:#00695c; box-shadow:0 4px 0 #00695c; }
body.theme-dafeng .rxs-beat-bar { background:linear-gradient(90deg,#00897b 0%,#ffd166 55%,#fb8c00 100%); }
body.theme-dafeng .rxs-card { border-color:#00695c; box-shadow:0 12px 0 #00695c; background:#ffffff; }
body.theme-dafeng .rxs-item-name { color:#0c4a42; }
body.theme-dafeng .rxs-end-banner, body.theme-dafeng .rxs-over-banner { background:#fb8c00; border-color:#00695c; box-shadow:0 6px 0 #00695c; }
body.theme-dafeng .rxs-board { border-color:#00695c; box-shadow:0 6px 0 #00695c; }
body.theme-dafeng .rxs-board-head { background:#00695c; }
body.theme-dafeng .rxs-board-row:nth-child(even) { background:#ecfaf6; }
body.theme-dafeng .rxs-score { color:#fb8c00; }
body.theme-dafeng .rxs-la { background:linear-gradient(135deg,#00897b,#fb8c00); box-shadow:0 10px 26px rgba(0,137,123,.32); }
/* 大风吹手机端（青）覆盖气球默认蓝 */
.rxm-wrap.rxm-dafeng { background:radial-gradient(120% 60% at 50% -8%,#ffffff 0%,#d2f4ec 60%,#b3e9dd 100%); }
.rxm-wrap.rxm-dafeng .rxm-badge { background:#00897b; border-color:#00695c; box-shadow:0 3px 0 #00695c; }
.rxm-wrap.rxm-dafeng .rxm-word-card { border-color:#00695c; box-shadow:0 6px 0 #00695c; }
.rxm-wrap.rxm-dafeng .rxm-word-card.right { border-color:#00897b; box-shadow:0 6px 0 #00897b; }
.rxm-wrap.rxm-dafeng .rxm-word-card.wrong { border-color:#fb8c00; box-shadow:0 6px 0 #fb8c00; }
.rxm-wrap.rxm-dafeng .rxm-cd-num { color:#fb8c00; text-shadow:0 8px 0 #00695c; }
/* ==================== 大风吹·吹什么（wind 特征起立，青蓝琥珀） ==================== */
@keyframes windSway { 0%,100%{transform:translateX(0) rotate(-2deg);} 50%{transform:translateX(10px) rotate(2deg);} }
@keyframes windPop { 0%{transform:scale(.6);opacity:0;} 60%{transform:scale(1.08);} 100%{transform:scale(1);opacity:1;} }
.rxs-stage.rxk-wind .rxs-emoji.is-wind { font-size:13vw; animation:windSway 1.6s ease-in-out infinite; }
.rxs-stage.rxk-wind .rxs-item-name.is-wind { font-size:4.6vw; color:#00695c; letter-spacing:4px; animation:windPop .45s ease both; }
.rxs-stage.rxk-wind .rxs-card { background:linear-gradient(180deg,#ffffff 0%,#e8f8f4 100%); }
.rxm-wrap.rxm-dafeng .rxm-emoji.is-wind { font-size:104px; animation:windSway 1.5s ease-in-out infinite; }
.rxm-wrap.rxm-dafeng .rxm-wind-pre { font-size:20px; font-weight:800; color:#00897b; margin-top:2px; letter-spacing:1px; }
.rxm-wrap.rxm-dafeng .rxm-word2.is-wind { font-size:40px; color:#00695c; letter-spacing:1px; line-height:1.18; margin-top:2px; animation:windPop .4s ease both; }
.rxm-wrap.rxm-dafeng .rxm-wind-post { font-size:19px; font-weight:800; color:#fb8c00; margin-top:2px; }
.rxm-keys.wind-keys { gap:14px; }
.rxm-keys.wind-keys .rxm-key { height:96px; }
.rxm-keys.wind-keys .rxm-key[data-rxkey="up"] { height:128px; box-shadow:0 6px 0 #00695c, 0 14px 30px rgba(0,105,92,.32); }
.rxm-keys.wind-keys .rxm-key[data-rxkey="up"] span { font-size:56px; }
.rxm-keys.wind-keys .rxm-key[data-rxkey="up"] span i { font-size:27px; }
.rxm-keys.wind-keys .rxm-key[data-rxkey="sit"] { opacity:.78; }
html[data-perf="minimal"] .rxs-stage.rxk-wind .rxs-emoji.is-wind,
html[data-perf="minimal"] .rxm-wrap.rxm-dafeng .rxm-emoji.is-wind,
html[data-perf="minimal"] .rxm-wrap.rxm-dafeng .rxm-word2.is-wind { animation:none; }
/* ==================== 正话反说 · 年会红金（zhenghua） ==================== */
.theme-zhenghua {
  --gx-bg1:#fff4e3; --gx-bg2:#f7d9a8; --gx-bg3:#eeb96a;
  --gx-red:#c0271c; --gx-gold:#c9941f; --gx-yellow:#f2c14b; --gx-green:#5e7d4f;
  --gx-blue:#3f6b96; --gx-pink:#c25b73; --gx-purple:#7a5c9e;
  --gx-ink:#3a1410; --gx-ink2:#7a5a3a; --gx-card:#fffaf0; --gx-line:#e3c08a;
  --gx-accent:#c0271c; --gx-accent2:#d99b1f;
  color:var(--gx-ink);
}
.zhenghua-stage { position:fixed; inset:0; z-index:0;
  background:
    radial-gradient(circle at 12% 14%, rgba(255,236,190,.92), transparent 58%),
    radial-gradient(circle at 88% 88%, rgba(214,48,32,.18), transparent 55%),
    linear-gradient(155deg,#fff6e6 0%,#f8dfb2 52%,#eec081 100%); }
.zhenghua-stage::before { content:""; position:absolute; inset:0; opacity:.16;
  background-image:
    radial-gradient(circle at 8% 30%, rgba(192,39,28,.5) 0 10px, transparent 12px),
    radial-gradient(circle at 92% 22%, rgba(201,148,31,.5) 0 8px, transparent 10px),
    radial-gradient(circle at 80% 70%, rgba(192,39,28,.4) 0 7px, transparent 9px),
    radial-gradient(circle at 18% 82%, rgba(201,148,31,.5) 0 9px, transparent 11px); }
.zhenghua-stage::after { content:""; position:absolute; inset:0; opacity:.10;
  background-image:
    repeating-linear-gradient(45deg, transparent 0 44px, rgba(192,39,28,.35) 45px 46px); }
.theme-zhenghua .gx-q { font-family:"KaiTi","STKaiti","FangSong",serif; color:#a31f16; letter-spacing:.04em; }
.theme-zhenghua .gx-tile { background:linear-gradient(180deg,#fffdf6,#ffe9c6); border:2px solid #d9a83c; color:#8a1c12; box-shadow:0 3px 0 #b97c1e; }
.theme-zhenghua .gx-tile.on { background:linear-gradient(180deg,#d93622,#b01f14); border-color:#f2c14b; color:#fff7df; }
.theme-zhenghua .gx-slot { border-color:#d9a83c; }
.theme-zhenghua .gx-opt { background:#fffaf0; border-color:#e3c08a; }
.theme-zhenghua .gx-opt.correct { background:linear-gradient(180deg,#e8453a,#b01f14); border-color:#f2c14b; color:#fff7df; }
.theme-zhenghua .gx-buzz-btn { background:radial-gradient(circle at 50% 38%,#e8453a,#a31f16); }
.theme-zhenghua .gx-buzz-big-ring { border-color:#d93622; }
.theme-zhenghua .gx-buzz-big-txt { color:#a31f16; }
/* 手机端 */
body.theme-zhenghua { background:#fff1df; }
body.theme-zhenghua .shell-bg { background:radial-gradient(135% 70% at 50% -8%,#fff6e2 0%,#f7d9a0 55%,#eeb868 100%); }
body.theme-zhenghua .shell-bg::after { display:none; }
body.theme-zhenghua .cloud { display:none; }

.theme-zhenghua .gx-tile.used { background:linear-gradient(180deg,#d93622,#b01f14); border-color:#f2c14b; color:#fff7df; }
.theme-zhenghua .gx-m-submit.ready, body.theme-zhenghua .gx-m-submit.ready { background:linear-gradient(180deg,#e8453a,#a31f16); }

/* ===== 现场引导脚本 script：速静（宁静蓝绿）/ 读心术（神秘紫） ===== */
.sc-view { position: fixed; inset: 0; display: flex; flex-direction: column; overflow: hidden; }
.sc-stage { position: absolute; inset: 0; z-index: 0; }
.sc-stage::before, .sc-stage::after { content:''; position: absolute; border-radius: 50%; filter: blur(70px); opacity: .35; animation: scFloat 16s ease-in-out infinite; }
.sc-stage::before { width: 46vmin; height: 46vmin; left: 8%; top: 12%; }
.sc-stage::after { width: 38vmin; height: 38vmin; right: 8%; bottom: 12%; animation-delay: -8s; }
.theme-sujing .sc-view { color: #eafaf5; }
.theme-sujing .sc-stage { background: radial-gradient(120% 90% at 50% 0%, #1f5a58 0%, #123d43 48%, #0b282e 100%); }
.theme-sujing .sc-stage::before { background: #6fd6c0; }
.theme-sujing .sc-stage::after { background: #8fd0e8; }
.theme-duxinshu .sc-view { color: #f2ecff; }
.theme-duxinshu .sc-stage { background: radial-gradient(120% 90% at 50% 0%, #3b1d6e 0%, #241147 48%, #150a2e 100%); }
.theme-duxinshu .sc-stage::before { background: #b48cff; }
.theme-duxinshu .sc-stage::after { background: #7cc8ff; }
.sc-hud { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: 26px 42px; }
.sc-name { font-size: 30px; font-weight: 900; letter-spacing: 2px; text-shadow: 0 2px 12px rgba(0,0,0,.4); }
.sc-badge { font-size: 19px; font-weight: 700; padding: 9px 20px; border-radius: 999px; background: rgba(255,255,255,.14); border: 1px solid rgba(255,255,255,.28); backdrop-filter: blur(6px); }
.sc-center { position: relative; z-index: 2; flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 0 8vw; }
.sc-emoji { font-size: 150px; line-height: 1; margin-bottom: 34px; filter: drop-shadow(0 14px 30px rgba(0,0,0,.35)); animation: scBreathe 5s ease-in-out infinite; }
.sc-title { font-size: 56px; font-weight: 900; letter-spacing: 3px; margin-bottom: 26px; text-shadow: 0 4px 18px rgba(0,0,0,.45); }
.theme-sujing .sc-title { color: #bff3e2; }
.theme-duxinshu .sc-title { color: #d9c2ff; }
.sc-text { font-size: 38px; font-weight: 700; line-height: 1.6; max-width: 1100px; }
.sc-sub { margin-top: 22px; font-size: 25px; font-weight: 500; line-height: 1.7; opacity: .82; max-width: 1000px; }
.sc-foot { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 26px; padding: 30px 42px 40px; }
.sc-count { font-size: 21px; font-weight: 700; opacity: .85; }
.sc-dots { display: flex; gap: 12px; }
.sc-dot { width: 12px; height: 12px; border-radius: 50%; background: rgba(255,255,255,.25); transition: all .35s; }
.sc-dot.done { background: rgba(255,255,255,.55); }
.sc-dot.on { width: 34px; border-radius: 999px; background: linear-gradient(90deg,#ffd873,#f2ac3d); box-shadow: 0 0 16px rgba(242,172,61,.8); }
.sc-step { animation: scFade .6s ease both; }
@keyframes scFade { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: translateY(0); } }
@keyframes scBreathe { 0%,100% { transform: scale(1); } 50% { transform: scale(1.08); } }
@keyframes scFloat { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(30px,-26px) scale(1.12); } }
/* 手机端不参与脚本游戏，无需适配 */
/* ================= 图片找不同（spot2 · 双图找茬） ================= */
/* 大屏 theme-zhaobutong：明亮卡通暖橙天蓝，保留原 PPT 卡通插画氛围（非国风） */
.fd-view { position: fixed; inset: 0; overflow: hidden;
  background: radial-gradient(120% 90% at 50% 0%, #bfeaff 0%, #8fd0f5 42%, #5aa7e6 100%);
  display: flex; flex-direction: column; padding: 26px 34px; box-sizing: border-box; }
.fd-cover { position: absolute; inset: 0; background-size: cover; background-position: center; filter: saturate(1.05); }
.fd-cover-mask { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,60,110,.25), rgba(20,60,110,.55)); }
.fd-hud { position: relative; z-index: 3; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; }
.fd-name { font-size: 30px; font-weight: 900; color: #fff; letter-spacing: 2px; text-shadow: 0 3px 10px rgba(0,60,110,.45); }
.fd-badge { font-size: 17px; font-weight: 800; color: #7a4a00; background: linear-gradient(180deg,#ffe9a8,#ffc94d);
  padding: 7px 16px; border-radius: 999px; box-shadow: 0 4px 12px rgba(0,0,0,.18); }
.fd-progress { margin-left: auto; font-size: 18px; font-weight: 800; color: #fff; background: rgba(15,60,110,.35);
  padding: 8px 18px; border-radius: 999px; backdrop-filter: blur(4px); }
.fd-progress b { color: #ffd84d; font-size: 24px; }
.fd-cover-center { position: relative; z-index: 3; margin: auto; text-align: center; color: #fff; }
.fd-big { font-size: 72px; font-weight: 900; letter-spacing: 6px; text-shadow: 0 6px 24px rgba(0,50,100,.5); animation: fdBounce 1.6s ease-in-out infinite; }
.fd-tip { font-size: 26px; font-weight: 700; margin-top: 18px; text-shadow: 0 3px 12px rgba(0,50,100,.5); }
@keyframes fdBounce { 0%,100% { transform: scale(1); } 50% { transform: scale(1.04); } }
.fd-board { flex: 1; display: flex; align-items: center; justify-content: center; gap: 26px; position: relative; z-index: 2; min-height: 0; }
.fd-pic { position: relative; flex: 1; max-width: 46%; border-radius: 18px; overflow: hidden;
  box-shadow: 0 18px 48px rgba(10,50,90,.35); border: 5px solid #fff; background: #fff; }
.fd-pic img { width: 100%; display: block; aspect-ratio: 700/525; object-fit: cover; }
.fd-pic-tag { position: absolute; top: 12px; left: 12px; font-size: 18px; font-weight: 900; color: #fff;
  background: rgba(20,70,120,.62); padding: 5px 16px; border-radius: 999px; backdrop-filter: blur(3px); }
.fd-vs { font-size: 46px; font-weight: 900; color: #fff; text-shadow: 0 4px 14px rgba(0,60,110,.5); animation: fdBounce 1.4s infinite; }
.fd-ring { position: absolute; transform: translate(-50%,-50%); border-radius: 50%; display: flex; align-items: center; justify-content: center;
  pointer-events: none; animation: fdPop .35s cubic-bezier(.2,1.4,.4,1) both; }
.fd-ring.found { border: 6px solid #34d399; box-shadow: 0 0 0 4px rgba(52,211,153,.35), 0 0 26px rgba(52,211,153,.9); }
.fd-ring.found .fd-ring-ico { font-size: clamp(16px,2.4vw,30px); color: #fff; background: #16a34a; width: 1.4em; height: 1.4em; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-weight: 900; }
.fd-ring.miss { border: 6px dashed #ff5d5d; box-shadow: 0 0 0 4px rgba(255,93,93,.3), 0 0 22px rgba(255,93,93,.8); }
.fd-ring-num { font-size: clamp(15px,2.2vw,28px); color: #fff; background: #ef4444; width: 1.5em; height: 1.5em; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-weight: 900; }
.fd-ring.hidden { display: none; }
@keyframes fdPop { from { opacity: 0; transform: translate(-50%,-50%) scale(.4); } to { opacity: 1; transform: translate(-50%,-50%) scale(1); } }
.fd-answers { position: relative; z-index: 3; display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; margin-top: 14px; }
.fd-ans { display: flex; align-items: center; gap: 8px; background: rgba(255,255,255,.92); border-radius: 12px; padding: 8px 14px;
  font-size: 16px; font-weight: 700; color: #21476b; box-shadow: 0 6px 16px rgba(0,40,80,.18); }
.fd-ans b { background: #ef4444; color: #fff; width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; }
.fd-ans.ok { background: rgba(220,255,238,.95); }
.fd-ans.ok b { background: #16a34a; }
.fd-ans em { font-style: normal; color: #16a34a; font-size: 14px; }
.fd-done { margin: auto; text-align: center; background: rgba(255,255,255,.94); border-radius: 22px; padding: 40px 56px; box-shadow: 0 20px 60px rgba(10,50,90,.35); }
.fd-done-emoji { font-size: 92px; animation: fdBounce 1.4s infinite; }
.fd-done-title { font-size: 40px; font-weight: 900; color: #21476b; margin: 12px 0 22px; }
.fd-rank { display: flex; flex-direction: column; gap: 10px; min-width: 360px; }
.fd-rank-row { display: flex; align-items: center; gap: 12px; background: #eef7ff; border-radius: 12px; padding: 10px 18px; font-size: 19px; font-weight: 800; color: #21476b; }
.fd-rk-no { background: #2f86d6; color: #fff; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 15px; }
.fd-rk-name { flex: 1; text-align: left; }
.fd-rk-pt { color: #f2871e; }
.fd-rank-empty { color: #5a7a96; font-size: 17px; font-weight: 600; }

/* 手机端 fdm */
.fdm-wrap { min-height: 100vh; box-sizing: border-box; padding: 16px 14px 28px;
  background: linear-gradient(180deg,#bfeaff 0%,#7cc6f2 55%,#5aa7e6 100%); display: flex; flex-direction: column; }
.fdm-top { background: rgba(255,255,255,.92); border-radius: 16px; padding: 13px 16px; box-shadow: 0 8px 22px rgba(20,70,120,.18); }
.fdm-title { font-size: 19px; font-weight: 900; color: #1f5d96; }
.fdm-prog { font-size: 14px; font-weight: 800; color: #40607e; margin: 6px 0 8px; }
.fdm-prog b { color: #f2871e; font-size: 18px; }
.fdm-bar { height: 9px; border-radius: 999px; background: #d7e9f7; overflow: hidden; }
.fdm-bar-in { height: 100%; border-radius: 999px; background: linear-gradient(90deg,#ffd84d,#ff9f43); transition: width .35s ease; }
.fdm-hint { text-align: center; color: #fff; font-weight: 800; font-size: 16px; margin: 14px 0 10px; text-shadow: 0 2px 8px rgba(0,60,110,.4); }
.fdm-imgbox { position: relative; border-radius: 16px; overflow: hidden; border: 4px solid #fff; box-shadow: 0 14px 34px rgba(10,50,90,.3); background: #fff; }
.fdm-imgbox.tappable { cursor: pointer; }
.fdm-img { width: 100%; display: block; aspect-ratio: 700/525; object-fit: cover; }
.fdm-ring { position: absolute; transform: translate(-50%,-50%); border-radius: 50%; display: flex; align-items: center; justify-content: center;
  pointer-events: none; animation: fdPop .35s cubic-bezier(.2,1.4,.4,1) both; }
.fdm-ring.found { border: 5px solid #22c55e; box-shadow: 0 0 0 3px rgba(34,197,94,.3), 0 0 18px rgba(34,197,94,.8); }
.fdm-ring.found span { font-size: 15px; color: #fff; background: #16a34a; width: 1.4em; height: 1.4em; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 900; }
.fdm-ring.miss { border: 5px dashed #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.28); }
.fdm-ring.miss span { font-size: 14px; color: #fff; background: #ef4444; width: 1.5em; height: 1.5em; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 900; }
.fdm-tap { position: absolute; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%;
  border: 4px solid #fff; background: rgba(255,179,0,.55); pointer-events: none; animation: fdmTap .6s ease-out forwards; }
@keyframes fdmTap { 0% { transform: scale(.4); opacity: 1; } 100% { transform: scale(2.2); opacity: 0; } }
.fdm-ans-list { margin-top: 12px; display: flex; flex-direction: column; gap: 8px; }
.fdm-ans { display: flex; align-items: center; gap: 9px; background: rgba(255,255,255,.94); border-radius: 11px; padding: 9px 13px; font-size: 14px; font-weight: 700; color: #21476b; }
.fdm-ans b { background: #ef4444; color: #fff; min-width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 12px; }
.fdm-ans.ok { background: rgba(220,255,238,.96); }
.fdm-ans.ok b { background: #16a34a; }
.fdm-wait { margin: auto; text-align: center; color: #fff; }
.fdm-wait-emoji { font-size: 84px; animation: fdBounce 1.5s infinite; }
.fdm-wait-t { font-size: 24px; font-weight: 900; margin: 14px 0 8px; text-shadow: 0 3px 10px rgba(0,60,110,.4); }
.fdm-wait .hint { color: #eaf6ff; }
/* 讲师台小答案条 */
.fd-ans-mini { display: flex; align-items: center; gap: 10px; background: #f2f8ff; border-radius: 10px; padding: 9px 14px; font-size: 15px; font-weight: 700; color: #2a4d6e; margin-bottom: 7px; }
.fd-ans-mini b { background: #ef4444; color: #fff; min-width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; }
.fd-ans-mini.ok { background: #e8fff3; } .fd-ans-mini.ok b { background: #16a34a; }
.fd-ans-mini em { margin-left: auto; font-style: normal; color: #16a34a; font-weight: 800; }
.fd-progressbar { height: 12px; border-radius: 999px; background: #e2edf7; overflow: hidden; margin-top: 12px; }
.fd-progressbar-in { height: 100%; border-radius: 999px; background: linear-gradient(90deg,#ffd84d,#ff9f43); transition: width .4s ease; }
/* ===== 狼人杀 ===== */
.wolf-status{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.wolf-status>div{background:rgba(255,255,255,.04);border:1px solid rgba(216,177,90,.22);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:4px}
.wolf-status b{color:var(--gold-hi);font-size:14px}
.wolf-status span{color:#d9cfb4;font-size:13px;line-height:1.5}
.wolf-dawn{margin:18px 0;padding:18px 20px;border-radius:14px;background:rgba(216,177,90,.08);border:1px solid rgba(216,177,90,.35);font-size:18px;font-weight:800;color:#f3e7c8}
.wws-stage{position:relative;min-height:100vh;overflow:hidden;color:#f3e7c8}
.wws-bg{position:absolute;inset:0;background:url('../games/wolf/assets/bg-village.jpg?v=1') center/cover no-repeat,url('../games/shui/assets/bg-table.jpg?v=7') center/cover no-repeat;filter:brightness(.55) saturate(1.05) blur(.6px);transform:scale(1.04)}
.wws-vignette{position:absolute;inset:0;background:radial-gradient(80% 65% at 50% 38%,rgba(8,8,22,.18),rgba(3,4,12,.9) 100%)}
.wws-hud{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:center;padding:26px 46px 0}
.wws-title{font-size:34px;font-weight:900;color:#f2d58a;text-shadow:0 4px 18px rgba(0,0,0,.7)}
.wws-meta{font-size:19px;font-weight:800;color:#d9cfb4}
.wws-meta b{color:#f2d58a;font-size:23px}
.wws-center{position:relative;z-index:2;text-align:center;margin-top:4.5vh;min-height:36vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.wws-kicker{font-size:17px;letter-spacing:.35em;color:#b9a77c;font-weight:800}
.wws-big{font-size:74px;font-weight:900;letter-spacing:.06em;color:#f5e6bd;text-shadow:0 6px 32px rgba(0,0,0,.8)}
.wws-sub{font-size:21px;font-weight:700;color:#cbbd98}
.wws-moon{font-size:78px;filter:drop-shadow(0 0 32px rgba(242,213,138,.6))}
.wws-deaths{font-size:22px;font-weight:700;color:#d9cfb4}
.wws-deaths b{color:#ff9c9c}
.wws-wall{position:relative;z-index:2;display:flex;flex-wrap:wrap;justify-content:center;gap:12px;padding:18px 40px;max-width:1500px;margin:0 auto}
.wws-seat{width:110px;padding:10px 6px;border-radius:14px;background:rgba(12,16,34,.72);border:1px solid rgba(216,177,90,.3);text-align:center;position:relative}
.wws-seat.dead{opacity:.36;filter:grayscale(.7)}
.wws-ava{width:54px;height:54px;margin:0 auto 6px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:23px;font-weight:900;color:#1b1206;background:linear-gradient(145deg,#f2d58a,#c79b3f)}
.wws-name{font-size:15px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wws-role{font-size:12px;color:#f2d58a;font-weight:800;margin-top:2px}
.wws-vote{font-size:13px;color:#7ee8f5;font-weight:800;margin-top:3px}
.wws-out{font-size:11px;color:#ff8ba0;margin-top:3px}
.wws-foot{position:relative;z-index:2;text-align:center;padding:10px;font-size:13px;color:rgba(243,231,200,.45);letter-spacing:.15em}
.theme-wolf.rl-wrap{background:linear-gradient(180deg,rgba(4,5,14,.35),rgba(4,5,14,.92)),url('../games/wolf/assets/bg-village.jpg?v=1') center/cover no-repeat}
.wwp-head{width:100%;display:flex;justify-content:space-between;font-size:13px;font-weight:800;color:#d9cfb4;margin-bottom:10px}
.wwp-card{width:100%;border-radius:18px;overflow:hidden;background:rgba(10,14,30,.82);border:1px solid rgba(216,177,90,.4);display:flex;text-align:left;position:relative}
.wwp-card.wolf{border-color:rgba(255,110,120,.55);box-shadow:0 0 34px rgba(180,20,40,.2)}
.wwp-art{width:42%;height:230px;object-fit:cover;object-position:center top;flex:none}
.wwp-card-body{padding:16px 14px;display:flex;flex-direction:column;gap:6px;flex:1;min-width:0}
.wwp-tag{font-size:12px;font-weight:900;letter-spacing:.12em;color:#f2d58a}
.wwp-card.wolf .wwp-tag{color:#ff8ba0}
.wwp-role{font-size:32px;font-weight:900;color:#fff3d6;line-height:1.1}
.wwp-name{font-size:14px;font-weight:800;color:#cbbd98}
.wwp-desc{font-size:13px;line-height:1.6;color:#c9bd9e}
.wwp-mates{font-size:13px;color:#ffb1b1;font-weight:800;line-height:1.5}
.wwp-dead{font-size:13px;color:#ff8ba0;font-weight:800}
.wwp-sec{width:100%;text-align:left;font-size:15px;font-weight:900;color:#f2d58a;margin:16px 0 8px}
.wwp-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}
.wwp-target{padding:11px 8px;border-radius:11px;border:1px solid rgba(216,177,90,.35);background:rgba(16,22,44,.82);color:#f0e5cc;font-size:14px;font-weight:800;font-family:inherit;cursor:pointer}
.wwp-target.poison{border-color:rgba(120,220,140,.4)}.wwp-target.on{border-color:#f2d58a;background:rgba(216,177,90,.2)}
.wwp-btn{width:100%;padding:13px;border-radius:13px;border:none;font-size:16px;font-weight:900;font-family:inherit;cursor:pointer;margin-top:10px;background:linear-gradient(180deg,#8be2a0,#3fae68);color:#062210}
.wwp-kill{width:100%;text-align:left;font-size:14px;color:#ffb1b1;font-weight:800;margin-bottom:6px}
.wwp-done{width:100%;text-align:center;font-size:13px;color:#9f9272;margin-top:8px}
.wwp-wait{width:100%;text-align:center;font-size:17px;font-weight:800;color:#cbbd98;line-height:1.8;margin-top:18px;padding:18px;border-radius:14px;background:rgba(12,16,34,.6);border:1px solid rgba(216,177,90,.18)}
.wwp-wait span{font-size:13px;color:#9f9272}
.wwp-wait.win{color:#8be2a0;border-color:rgba(139,226,160,.5)}
.wwp-wait.lose{color:#ff8ba0;border-color:rgba(255,139,160,.4)}
.wwp-result{width:100%;padding:12px;border-radius:12px;background:rgba(216,177,90,.1);font-size:14px;font-weight:800;color:#efe4c8;margin-top:10px}
.wwp-result b.bad{color:#ff8ba0}.wwp-result b.good{color:#7ee8f5}

.wws-orb{width:104px;height:104px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff8dd 0 18%,#f2d58a 42%,#b98f45 68%,rgba(185,143,69,0) 72%);box-shadow:0 0 70px rgba(242,213,138,.55),0 0 140px rgba(242,213,138,.25);}
body.theme-wolf{background:#05070f!important}.rl-wrap.theme-wolf{min-height:100vh;width:100%;border-radius:0;padding-bottom:44px}
.wolf-force{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0}.wolf-force select{background:#101a30;color:#f0e5cc;border:1px solid rgba(216,177,90,.35);border-radius:9px;padding:7px 9px;font-family:inherit;font-size:13px}
.ww-role-modal{position:relative;width:760px;max-width:96vw;max-height:88vh;overflow:auto;margin:5vh auto;padding:24px;border-radius:20px;background:linear-gradient(170deg,#16223d,#0d1629);border:1px solid rgba(216,177,90,.55);box-shadow:0 30px 80px rgba(0,0,0,.65)}
.ww-camp{margin-bottom:14px;border:1px solid rgba(216,177,90,.2);border-radius:14px;padding:10px}
.ww-camp-title{font-size:16px;font-weight:900;color:#f2d58a;margin-bottom:6px}
.ww-role-row{display:grid;grid-template-columns:130px 1fr 104px;gap:10px;align-items:center;padding:7px 8px;border-radius:9px}
.ww-role-row.on{background:rgba(216,177,90,.08)}
.ww-role-check{display:flex;align-items:center;gap:8px;color:#efe4c8;font-size:14px;cursor:pointer}
.ww-role-desc{font-size:12px;line-height:1.5;color:#a99c7c}
.ww-role-count{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.ww-role-count button{width:26px;height:26px;border-radius:8px;border:1px solid rgba(216,177,90,.35);background:rgba(0,0,0,.25);color:#f2d58a;font-weight:900;cursor:pointer}
.ww-role-count b{width:18px;text-align:center;color:#f2d58a}
@media(max-width:640px){.ww-role-row{grid-template-columns:1fr 90px}.ww-role-desc{display:none}}
.sheriff{outline:1px solid rgba(242,213,138,.7)}
.wwp-card-body{max-height:240px;overflow:auto}.wwp-desc{font-size:12.5px;line-height:1.55}
/* ===== 看图大猜想 ===== */
.gxg-stage{position:relative;min-height:100vh;overflow:hidden;color:#fff}
.gxg-bg{position:absolute;inset:0;background:radial-gradient(80% 70% at 30% 15%,#5b21b6,#1b0b36 70%,#09040f);z-index:0}
.gxg-veil{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 45%,rgba(255,255,255,.06),rgba(0,0,0,.5));z-index:1}
.gxg-hud{position:relative;z-index:3;display:flex;justify-content:space-between;align-items:center;padding:26px 46px 0}
.gxg-title{font-size:34px;font-weight:900;color:#fde68a;letter-spacing:.04em}
.gxg-meta{font-size:20px;font-weight:800;color:#e9d5ff}.gxg-meta b{color:#fde68a;font-size:25px}
.gxg-main{position:relative;z-index:3;display:flex;justify-content:center;align-items:center;min-height:72vh}
.gxg-board{position:relative;width:min(58vw,760px);aspect-ratio:4/3;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.65)}
.gxg-board img{position:absolute;inset:3%;width:94%;height:94%;object-fit:contain}
.gxg-tiles{position:absolute;inset:0;display:grid;grid-template-columns:repeat(5,1fr);grid-template-rows:repeat(2,1fr)}
.gxg-tile{display:flex;align-items:center;justify-content:center;font-size:42px;font-weight:900;color:rgba(255,255,255,.35);
  background:linear-gradient(150deg,#8b5cf6,#4c1d95);border:1px solid rgba(255,255,255,.15);
  transition:transform .55s cubic-bezier(.5,-.4,.85,.55),opacity .45s ease}
.gxg-tile.drop{transform:translateY(-110%) rotate(12deg);opacity:0}
.gxg-answerbar{position:absolute;left:0;right:0;bottom:0;padding:20px 24px;background:linear-gradient(transparent,rgba(0,0,0,.9));text-align:center;display:none}
.gxg-answerbar.show{display:block}
.gxg-answer{font-size:38px;font-weight:900;color:#fde68a;letter-spacing:.05em}
.gxg-answer span{font-size:16px;color:#fff;opacity:.7;margin-right:14px;letter-spacing:.2em}
.gxg-answer i{font-size:16px;font-style:normal;color:#e9d5ff;margin-left:14px;font-weight:700}
.gxg-hint{font-size:17px;color:#e9d5ff;font-weight:700}
.gxg-foot{position:absolute;left:0;right:0;bottom:14px;z-index:3;text-align:center;font-size:13px;color:rgba(255,255,255,.5);letter-spacing:.12em}
.gxg-ctrl{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:18px;margin-top:14px;align-items:start}
.gxg-ctrl-img{background:#fff;border-radius:16px;padding:8px;min-height:260px;display:flex;align-items:center;justify-content:center}
.gxg-ctrl-img img{max-width:100%;max-height:380px;object-fit:contain}
.gxg-ctrl-ans{padding:12px 14px;border-radius:12px;background:rgba(216,177,90,.1);border:1px solid rgba(216,177,90,.3);font-size:18px;font-weight:800;color:#f2d58a}
.gxg-ctrl-ans b{color:#fff3d6}.gxg-ctrl-ans span{display:block;font-size:12px;color:#cbbd98;margin-top:4px}
.gxg-ctrl-stat{margin-top:10px;font-size:14px;color:#d9cfb4}.gxg-ctrl-stat b{color:#f2d58a}
@media(max-width:900px){.gxg-ctrl{grid-template-columns:1fr}}
.gxg-finish{position:relative;z-index:3;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}.gxg-finish-k{font-size:22px;letter-spacing:.3em;color:#cbbd98;font-weight:800}.gxg-finish-n{font-size:120px;font-weight:900;color:#fde68a;line-height:1}.gxg-finish-n small{font-size:30px;margin-left:8px}.gxg-finish-s{font-size:20px;color:#e9d5ff}
.wolf-status .ws-card{background:rgba(255,255,255,.045);border:1px solid rgba(216,177,90,.22);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.ws-head{display:flex;flex-direction:column;gap:4px}.ws-head b{color:var(--gold-hi);font-size:14px}.ws-head span{color:#d9cfb4;font-size:13px;line-height:1.45}
.ws-act{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ws-act select{flex:1;min-width:120px;background:#101a30;color:#f0e5cc;border:1px solid rgba(216,177,90,.35);border-radius:8px;padding:7px 8px;font-family:inherit;font-size:13px}
.ws-act .kbtn{padding:7px 10px;font-size:13px}
.ww-force-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:10px 0;padding:10px;border-radius:10px;background:rgba(216,177,90,.06);border:1px dashed rgba(216,177,90,.25)}
.ww-force-row select{background:#101a30;color:#f0e5cc;border:1px solid rgba(216,177,90,.35);border-radius:8px;padding:7px 8px;font-family:inherit;font-size:13px}
.ww-picked{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;max-height:240px;overflow:auto;padding:2px}
.ww-pick{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:10px;border:1px solid rgba(216,177,90,.28);background:rgba(12,16,34,.8);color:#efe4c8;font-size:14px;font-family:inherit;cursor:pointer;text-align:left;min-width:0}
.ww-pick:hover{border-color:rgba(242,213,138,.7);background:rgba(216,177,90,.1)}
.ww-pick b{width:24px;height:24px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#8b5cf6,#5b21b6);color:#fff;font-size:12px}
.ww-pick span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ww-pick i{font-style:normal;color:#9f9272;font-size:14px}
.ww-pick:hover i{color:#ff9c9c}
.gxg-hudright{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.gxg-score{display:flex;align-items:center;gap:18px;padding:8px 18px;border-radius:14px;background:rgba(24,12,48,.72);border:1px solid rgba(242,213,138,.35);box-shadow:0 8px 30px rgba(0,0,0,.35);backdrop-filter:blur(8px)}
.gxg-score span{font-size:16px;font-weight:700;color:#cbbd98;white-space:nowrap}
.gxg-score b{font-size:30px;font-weight:900;color:#fde68a;margin:0 4px;text-shadow:0 0 18px rgba(242,213,138,.28)}
@media(max-width:1100px){.gxg-score b{font-size:24px}.gxg-score span{font-size:13px}}
.ww-daylist{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin:10px 0;max-height:330px;overflow:auto}
.ww-day{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1px solid rgba(216,177,90,.25);background:rgba(12,16,34,.78);color:#efe4c8;font-size:14px;min-width:0}
.ww-day>b{width:24px;height:24px;flex:none;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#8b5cf6,#5b21b6);color:#fff;font-size:12px}
.ww-day>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:700}
.ww-day>i{font-style:normal;font-size:12px;color:#f2d58a;white-space:nowrap}
.ww-day.dead{opacity:.45;filter:grayscale(.6)}
.ww-idbar{display:flex;flex-wrap:wrap;gap:6px;padding:8px 10px;margin-bottom:10px;border-radius:12px;background:rgba(9,13,28,.72);border:1px solid rgba(216,177,90,.22);max-height:86px;overflow:auto}
.ww-idchip{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:8px;background:rgba(255,255,255,.05);border:1px solid rgba(216,177,90,.16);font-size:12px;color:#e8dcc0;white-space:nowrap}
.ww-idchip b{color:#f2d58a}.ww-idchip i{font-style:normal;color:#a99c7c;font-size:11px}
.ww-idchip.dead{opacity:.4;text-decoration:line-through}
.ws-title b{color:var(--gold-hi);font-size:15px}
.ws-who{font-size:13px;color:#fff3d6;font-weight:800;margin-top:2px}
.ws-status{font-size:12px;color:#c9bd9e;line-height:1.45}
.ws-dead{font-size:12px;color:#ff8ba0}
.ww-mini{margin-left:4px;padding:3px 6px;border-radius:6px;border:1px solid rgba(242,213,138,.4);background:rgba(216,177,90,.12);color:#f2d58a;font-size:11px;font-family:inherit;cursor:pointer;white-space:nowrap}.ww-mini:hover{background:rgba(216,177,90,.25)}
body.theme-wolf{background:#05070f!important;background-image:none!important}
body.theme-wolf .shell-bg,body.theme-wolf .cloud{display:none!important}
body.theme-wolf .m-wrap{max-width:none!important;width:100%!important;margin:0!important;padding:0!important;min-height:100vh;background:#05070f}
body.theme-wolf .rl-wrap.theme-wolf{min-height:100vh!important;border-radius:0!important;padding:22px 16px 46px!important;justify-content:flex-start!important}
.wwp-spec{width:100%;border-radius:18px;background:rgba(10,14,30,.82);border:1px solid rgba(216,177,90,.35);padding:18px 16px;text-align:left}
.wwp-spec-phase{font-size:28px;font-weight:900;color:#f2d58a}
.wwp-spec-sub{font-size:13px;color:#c9bd9e;margin-top:4px;line-height:1.6}
.wwp-spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:14px}
.wwp-spec-p{display:flex;align-items:center;gap:6px;padding:8px;border-radius:9px;background:rgba(255,255,255,.05);border:1px solid rgba(216,177,90,.14);font-size:13px;min-width:0}
.wwp-spec-p b{width:22px;height:22px;flex:none;border-radius:50%;background:linear-gradient(145deg,#8b5cf6,#5b21b6);display:flex;align-items:center;justify-content:center;font-size:11px;color:#fff}
.wwp-spec-p span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#efe4c8;font-weight:700}
.wwp-spec-p i{font-style:normal;font-size:11px;color:#f2d58a}
.wwp-spec-p em{font-style:normal;font-size:11px;color:#7ee8f5}
.wwp-spec-p.dead{opacity:.4;filter:grayscale(.7)}
.wwp-spec-tip{font-size:12px;color:#8f8468;line-height:1.6;margin-top:14px}
.wwp-spec-win{margin-top:10px;padding:10px;border-radius:10px;background:rgba(216,177,90,.1);color:#f2d58a;font-weight:800;font-size:15px}
.wwp-spec-win span{display:block;font-size:12px;color:#c9bd9e;margin-top:3px;font-weight:600}
.roll-slot.rolling{animation:rollJitter .16s ease-in-out infinite alternate;text-shadow:0 0 48px rgba(242,213,138,.55)}
@keyframes rollJitter{from{transform:translateY(-6px) scale(.98);opacity:.72}to{transform:translateY(6px) scale(1.02);opacity:1}}
/* 随机点名老虎机 */
.roll-cv{gap:14px}
.roll-machine{position:relative;width:min(74vw,1100px);height:22vh;min-height:130px;overflow:hidden;border-radius:22px;
  background:linear-gradient(180deg,rgba(20,12,44,.92),rgba(8,5,20,.96));border:1px solid rgba(242,213,138,.45);
  box-shadow:0 24px 80px rgba(0,0,0,.6),inset 0 0 50px rgba(242,213,138,.08)}
.roll-machine::before,.roll-machine::after{content:'';position:absolute;left:0;right:0;height:26%;z-index:3;pointer-events:none}
.roll-machine::before{top:0;background:linear-gradient(#0a0616,rgba(10,6,22,0))}
.roll-machine::after{bottom:0;background:linear-gradient(rgba(10,6,22,0),#0a0616)}
.roll-reel{position:absolute;left:0;right:0;top:0;display:flex;flex-direction:column;will-change:transform}
.roll-item{height:22vh;min-height:130px;line-height:22vh;text-align:center;font-size:clamp(58px,9vh,130px);font-weight:900;
  color:#f2d58a;letter-spacing:.06em;text-shadow:0 0 40px rgba(242,213,138,.35);white-space:nowrap}
.roll-machine.spinning .roll-reel{animation:reelRoll .55s linear infinite}
@keyframes reelRoll{from{transform:translateY(0)}to{transform:translateY(-50%)}}
.roll-machine.stopping .roll-reel{animation:reelStop 2.2s cubic-bezier(.12,.82,.16,1) forwards}
@keyframes reelStop{from{transform:translateY(0)}to{transform:translateY(calc(var(--idx) * -22vh))}}
.roll-winner{position:absolute;inset:0;z-index:2;display:flex;align-items:center;justify-content:center;font-size:clamp(64px,10vh,150px);
  font-weight:900;color:#ffe6a3;letter-spacing:.06em;text-shadow:0 0 50px rgba(242,213,138,.7);opacity:0;transform:scale(.72);transition:opacity .28s,transform .38s cubic-bezier(.16,1,.3,1)}
.roll-machine.done .roll-winner{opacity:1;transform:scale(1)}
.roll-machine.done .roll-reel{opacity:0}
.roll-unit{margin-top:4px;font-size:26px}
.roll-slot{display:none}

/* 讲台首页留白：让三套皮肤的背景都透出来 */
.ws-main{max-width:1180px;margin:0 auto}
.home-grid{gap:22px}
.home-card{padding:18px 20px}
.home-card .hc-ico{font-size:30px;margin-bottom:8px}
.home-card h4{font-size:20px}
.home-card p{font-size:13px;line-height:1.55}
@supports (background: color-mix(in srgb, white 60%, transparent)){
  .home-card{background:color-mix(in srgb, var(--panel) 68%, transparent)}
}
@media (max-width:1100px){
  .ws-main{max-width:none}
}

/* ==================== 猜灯谜 · 元宵灯会 v2 ==================== */
.dengmi-stage{
  background:
    radial-gradient(ellipse at 50% 46%, rgba(38,4,4,.02) 0%, rgba(32,3,3,.24) 58%, rgba(20,2,3,.62) 100%),
    linear-gradient(180deg, rgba(24,3,3,.10), rgba(42,6,5,.30)),
    url("../games/dengmi/cover.jpg") center/cover no-repeat;
}
.dengmi-stage::before{
  content:"";position:absolute;inset:-8%;pointer-events:none;
  background:
    radial-gradient(circle at 11% 28%, rgba(255,196,92,.24), transparent 16%),
    radial-gradient(circle at 82% 21%, rgba(255,180,82,.20), transparent 15%),
    radial-gradient(circle at 50% 12%, rgba(255,235,180,.10), transparent 22%);
  animation:dmGlow 7s ease-in-out infinite alternate;
}
.dengmi-stage::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 45%, transparent 48%, rgba(22,2,3,.38) 100%);
}
@keyframes dmGlow{from{opacity:.65;transform:scale(1)}to{opacity:1;transform:scale(1.025)}}

.theme-dengmi .gx-media-riddle{
  position:relative;width:min(1120px,82vw);margin:28px auto 0;padding:0;
  background:none;border:0;box-shadow:none;
  transform-origin:50% -40px;
  animation:dmSway 9s ease-in-out infinite;
}
.theme-dengmi .gx-media-riddle::before{
  content:"";position:absolute;left:50%;top:-44px;width:2px;height:44px;transform:translateX(-50%);
  background:linear-gradient(180deg,transparent,#f2c14b);box-shadow:0 0 12px rgba(242,193,75,.55);
}
.theme-dengmi .gx-riddle-text{
  width:100%;box-sizing:border-box;
  font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;
  font-weight:700!important;letter-spacing:.06em;
  color:#5a1512!important;
  background:linear-gradient(180deg,#fffaf0,#f3e0b6)!important;
  border:2px solid #b4762b!important;border-top:6px solid #a51f18!important;border-radius:4px!important;
  box-shadow:0 20px 48px rgba(0,0,0,.38),inset 0 0 0 4px rgba(255,255,255,.35)!important;
  padding:30px 44px 24px!important;
}
.theme-dengmi .gx-riddle-quote{display:none}
.theme-dengmi .gx-riddle-src,
.theme-dengmi .gx-m-riddle-src{
  display:block;width:fit-content;margin:12px auto 0;padding:4px 16px;
  border:1px solid #a3541c;border-radius:2px;
  background:rgba(255,247,226,.90);
  color:#7c2416!important;font-family:"Microsoft YaHei",sans-serif;
  font-size:26px;font-weight:700;letter-spacing:.18em;line-height:1.5;
  box-shadow:0 4px 12px rgba(80,18,10,.18);
}
.theme-dengmi .gx-buzz-big{display:none!important}
.theme-dengmi .gx-buzz-stage .gx-timer{margin-top:22px}

/* 手机端：同一张灯会背景，谜条变灯笼纸卡 */
body.theme-dengmi{
  background:#240405;color:#fff3d8;
}
body.theme-dengmi .shell-bg{
  background:
    radial-gradient(ellipse at 50% 45%, rgba(35,3,3,.04), rgba(25,2,3,.48) 80%),
    url("../games/dengmi/cover.jpg") center/cover no-repeat!important;
  opacity:1!important;
}
body.theme-dengmi .shell-bg::after{
  content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 40%,transparent 35%,rgba(20,2,3,.45) 100%);
}
.theme-dengmi .gx-m-riddle{
  position:relative;margin:14px 0 6px;padding:16px 16px 12px;
  background:linear-gradient(180deg,#fffaf0,#f3e0b6);
  border:2px solid #b4762b;border-top:5px solid #a51f18;border-radius:4px;
  box-shadow:0 12px 28px rgba(0,0,0,.32),inset 0 0 0 3px rgba(255,255,255,.30);
}
.theme-dengmi .gx-m-riddle::before{
  content:"";position:absolute;left:50%;top:-18px;width:2px;height:18px;transform:translateX(-50%);
  background:#f2c14b;
}
.theme-dengmi .gx-m-riddle-quote{display:none}
.theme-dengmi .gx-m-riddle-text{
  color:#5a1512!important;font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;
  font-weight:700!important;font-size:34px;line-height:1.5;letter-spacing:.04em;
}
.theme-dengmi .gx-m-riddle-src{
  display:block;width:fit-content;margin:10px auto 0;padding:3px 12px;
  border:1px solid #a3541c;border-radius:2px;background:rgba(255,247,226,.92);
  color:#7c2416;font-size:15px;font-weight:700;letter-spacing:.16em;
}
.theme-dengmi .gx-m-buzz .gx-m-q{color:#ffe6ad!important;text-shadow:0 2px 12px rgba(0,0,0,.4)}
.theme-dengmi .gx-buzz-btn{
  background:radial-gradient(circle at 35% 28%,#ffde82,#ef9d1b 62%,#a92a12)!important;
  border:4px solid #f7d37a!important;
  box-shadow:0 14px 0 #7f1f12,0 24px 46px rgba(0,0,0,.42),0 0 50px rgba(255,176,64,.28)!important;
  color:#4a1808!important;
}
.theme-dengmi .gx-buzz-win,.theme-dengmi .gx-buzz-lost{background:rgba(255,247,226,.94);border-color:#b4762b}
.theme-dengmi .gx-m-timer{background:rgba(255,239,199,.24)}



/* 灯谜：谜条已经是题面，顶部通用标题不再重复 */
.theme-dengmi .gx-media-stage > .gx-q{display:none}
.theme-dengmi .gx-m-q{display:none}
.theme-dengmi .gx-center.gx-media-stage{padding-top:72px}
.theme-dengmi .gx-m-riddle-src{font-size:17px;padding:4px 14px}

/* ==================== 正话反说 · 红金舞台 v2 ==================== */
.zhenghua-stage{
  background:
    radial-gradient(ellipse at 50% 44%, rgba(35,3,3,.10) 0%, rgba(42,4,4,.34) 64%, rgba(28,2,3,.72) 100%),
    linear-gradient(180deg, rgba(62,7,6,.14), rgba(38,3,3,.28)),
    url("../games/zhenghua/cover.jpg") center 44%/cover no-repeat;
}
.zhenghua-stage::before{
  content:"";position:absolute;inset:-6%;pointer-events:none;opacity:.85;
  background:
    radial-gradient(circle at 9% 18%, rgba(255,221,130,.24), transparent 17%),
    radial-gradient(circle at 91% 20%, rgba(255,190,95,.20), transparent 16%),
    radial-gradient(circle at 50% 92%, rgba(255,224,150,.10), transparent 30%);
  animation:zhGlow 6.5s ease-in-out infinite alternate;
}
.zhenghua-stage::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 48%, transparent 36%, rgba(34,2,3,.34) 100%);
}
@keyframes zhGlow{from{opacity:.55;transform:scale(1)}to{opacity:1;transform:scale(1.03)}}

.theme-zhenghua .gx-q{
  font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;
  color:#7c1712!important;letter-spacing:.03em;
}
.theme-zhenghua .gx-media-stage > .gx-q{
  position:relative;z-index:2;
  width:fit-content;max-width:88%;box-sizing:border-box;
  margin:0 auto 8px;padding:16px 34px 14px;
  background:linear-gradient(180deg,#fffaf0,#f7e1b5);
  border:2px solid #d9a83c;border-top:6px solid #b42017;border-radius:5px;
  box-shadow:0 18px 42px rgba(50,4,4,.30),inset 0 0 0 4px rgba(255,255,255,.36);
  font-size:clamp(34px,3.3vw,52px);font-weight:700;line-height:1.4;
  animation:zhCardIn .55s cubic-bezier(.16,1,.3,1) both;
}
.theme-zhenghua .gx-media-stage > .gx-q::after{
  content:"反 过 来 说";display:block;margin-top:5px;
  font-size:11px;font-weight:700;letter-spacing:.34em;color:#a3541c;opacity:.8;
}
.theme-zhenghua .gx-media-stage .gx-timer{
  width:min(720px,64vw);height:12px;margin:16px auto 0;
  border-radius:999px;background:rgba(64,7,6,.34);
  border:1px solid rgba(255,222,154,.40);
  box-shadow:inset 0 2px 5px rgba(0,0,0,.25);
}
.theme-zhenghua .gx-media-stage .gx-timer i{
  display:block;height:100%;border-radius:999px;
  background:linear-gradient(90deg,#a51f14,#e0574a 55%,#f5c95e);
  box-shadow:0 0 14px rgba(242,193,75,.38);
}
.theme-zhenghua .gx-media-stage .gx-sub{
  color:#ffe7ba!important;font-size:23px;font-weight:600;
  text-shadow:0 2px 12px rgba(0,0,0,.42);
}
@keyframes zhCardIn{from{opacity:0;transform:translateY(-12px) scale(.97)}to{opacity:1;transform:none}}

/* 手机端正话反说：红金舞台，字块更像年会展台 */
body.theme-zhenghua{background:#3a0808;color:#fff3df}
body.theme-zhenghua .shell-bg{
  background:
    radial-gradient(ellipse at 50% 44%, rgba(32,2,2,.04), rgba(26,2,3,.48) 82%),
    url("../games/zhenghua/cover.jpg") center center/cover no-repeat!important;
  opacity:1!important;
}
body.theme-zhenghua .shell-bg::after{
  content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 42%,transparent 30%,rgba(28,2,3,.38) 100%);
}
body.theme-zhenghua .gx-m{padding:12px 12px 10px;background:rgba(65,6,6,.58);border:1px solid rgba(242,193,75,.38);border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.22)}
body.theme-zhenghua .gx-m-q{color:#ffe7b0;text-shadow:0 2px 10px rgba(0,0,0,.32)}
.theme-zhenghua .gx-m-modebadge{background:rgba(255,245,220,.92);color:#8a1c12;border-color:#d9a83c}
.theme-zhenghua .gx-tiles{gap:8px;max-width:360px}
.theme-zhenghua .gx-tile{
  border-radius:8px;min-height:58px;
  background:linear-gradient(180deg,#fffdf6,#ffe8b8);
  border:2px solid #d9a83c;color:#8a1c12;
  box-shadow:0 5px 0 #a86a18,0 8px 16px rgba(0,0,0,.18);
  animation:zhTileIn .38s cubic-bezier(.16,1,.3,1) both;
}
.theme-zhenghua .gx-tile.on{background:linear-gradient(180deg,#e8453a,#a51f14);border-color:#f2c14b;color:#fff7df;box-shadow:0 5px 0 #6b130c}
.theme-zhenghua .gx-m-submit{border-radius:9px;background:linear-gradient(180deg,#f7d681,#d99b1f);color:#4a1808;box-shadow:0 5px 0 #8c5b12}
.theme-zhenghua .gx-m-submit.ready{background:linear-gradient(180deg,#e8453a,#a51f14);color:#fff7df}
.theme-zhenghua .gx-m-timer{height:12px;background:rgba(64,7,6,.35);border:1px solid rgba(255,222,154,.35)}
.theme-zhenghua .gx-m-timer i{background:linear-gradient(90deg,#a51f14,#f2c14b)}
.theme-zhenghua .gx-buzz-btn{background:radial-gradient(circle at 50% 35%,#f5d37b,#d93622 58%,#8f1b12)!important;border:4px solid #f2c14b}
@keyframes zhTileIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}

.theme-zhenghua .gx-title{color:#ffe8b8!important;text-shadow:0 2px 12px rgba(0,0,0,.45)}
.theme-zhenghua .gx-pill{background:rgba(46,3,3,.56);color:#ffe8b8;border:1px solid rgba(242,193,75,.5)}
.theme-zhenghua .gx-pill b{color:#fff3d1}

/* 正话反说：题目卡放屏幕正中，不贴顶 */
.theme-zhenghua .gx-center.gx-media-stage{
  justify-content:center;
  padding-top:70px;
  padding-bottom:70px;
}
.theme-zhenghua .gx-center.gx-media-stage > .gx-q{margin-top:0;margin-bottom:14px}
.theme-zhenghua .gx-center.gx-media-stage .gx-timer{margin-top:12px}
.theme-zhenghua .gx-center.gx-media-stage{min-height:100vh!important;height:100vh;box-sizing:border-box}

/* ==================== 看图猜成语 · 宣纸书卷 v2 ==================== */
.chengyu-stage{
  background:
    radial-gradient(ellipse at 50% 46%, rgba(255,252,243,.30) 0%, rgba(247,235,211,.46) 62%, rgba(239,218,177,.62) 100%),
    url("../games/chengyu/cover.jpg") center/cover no-repeat;
}
.chengyu-stage::before{
  content:"";position:absolute;inset:-8%;pointer-events:none;opacity:.75;
  background:
    radial-gradient(circle at 10% 24%, rgba(56,40,15,.10), transparent 20%),
    radial-gradient(circle at 90% 76%, rgba(56,40,15,.08), transparent 18%),
    radial-gradient(circle at 50% 8%, rgba(255,250,235,.18), transparent 26%);
  animation:cyInk 9s ease-in-out infinite alternate;
}
.chengyu-stage::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 46%, transparent 42%, rgba(94,65,28,.16) 100%);
}
@keyframes cyInk{from{opacity:.55;transform:scale(1)}to{opacity:.9;transform:scale(1.02)}}

.theme-chengyu .gx-title{
  color:#3b2a12!important;font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;
  font-size:46px;font-weight:700;letter-spacing:.12em;text-shadow:0 2px 0 rgba(255,252,240,.7);
}
.theme-chengyu .gx-pill{
  background:rgba(255,252,242,.88);color:#5b3c1b;border:1px solid rgba(150,104,50,.34);
  box-shadow:0 4px 12px rgba(82,55,23,.10);
}
.theme-chengyu .gx-pill b{color:#9a2e22}
.theme-chengyu .gx-center.gx-media-stage{
  justify-content:center;min-height:100vh!important;height:100vh;box-sizing:border-box;
  padding-top:70px;padding-bottom:62px;
}
.theme-chengyu .gx-media-img{
  position:relative;width:min(680px,54vw);height:auto;min-height:0;
  margin:0 auto;padding:20px 32px;box-sizing:border-box;
  background:linear-gradient(180deg,rgba(255,252,242,.97),rgba(248,238,215,.97));
  border:0;border-radius:3px;
  box-shadow:0 22px 52px rgba(88,58,22,.24),inset 0 0 0 1px rgba(117,78,34,.14);
  animation:cyUnroll .58s cubic-bezier(.16,1,.3,1) both;
}
.theme-chengyu .gx-media-img::before,
.theme-chengyu .gx-media-img::after{
  content:"";position:absolute;top:-10px;bottom:-10px;width:17px;z-index:4;
  border-radius:5px;
  background:linear-gradient(90deg,#8e5928,#d3a464 40%,#a66c2e 68%,#70431e);
  box-shadow:0 5px 12px rgba(55,32,11,.3),inset 0 1px 0 rgba(255,255,255,.35);
}
.theme-chengyu .gx-media-img::before{left:-11px}
.theme-chengyu .gx-media-img::after{right:-11px}
.theme-chengyu .gx-media-img img{
  width:100%;height:auto;max-height:52vh;object-fit:contain;
  padding:10px;border:1px solid rgba(153,109,52,.28);border-radius:2px;
  background:#fffdf7;box-shadow:none;
  filter:saturate(.93) sepia(.04);
  animation:cyImageIn .6s ease-out both;
}
.gx-img-seal{display:none}
.theme-chengyu .gx-img-seal{
  display:flex;align-items:center;justify-content:center;
  position:absolute;right:16px;bottom:13px;z-index:5;
  width:38px;height:42px;border-radius:3px;
  background:#a83125;color:#ffe9c8;border:1px solid #731b14;
  font-family:"Microsoft YaHei",sans-serif;font-size:17px;font-weight:700;
  box-shadow:0 4px 10px rgba(92,23,16,.25);transform:rotate(-4deg);
  animation:cySeal .5s .25s cubic-bezier(.2,1.4,.4,1) both;
}
.theme-chengyu .gx-timer{
  width:min(620px,54vw);height:10px;margin:18px auto 0;
  border:1px solid rgba(117,78,34,.30);background:rgba(84,55,22,.12);
  box-shadow:inset 0 2px 4px rgba(0,0,0,.12);
}
.theme-chengyu .gx-timer i{background:linear-gradient(90deg,#5b3818,#b67c32 65%,#d9aa58)}
.theme-chengyu .gx-sub{
  color:#4a3218!important;font-size:23px;font-weight:600;
  text-shadow:0 1px 0 rgba(255,252,242,.65);
}
@keyframes cyUnroll{from{opacity:0;transform:scaleX(.92) translateY(8px)}to{opacity:1;transform:none}}
@keyframes cyImageIn{from{opacity:.4;transform:scale(.97)}to{opacity:1;transform:none}}
@keyframes cySeal{from{opacity:0;transform:rotate(-12deg) scale(.6)}to{opacity:1;transform:rotate(-4deg) scale(1)}}

/* 学员手机：同一卷宣纸，图片和字块都放在纸上 */
body.theme-chengyu{background:#f3e3c3;color:#38280f}
body.theme-chengyu .shell-bg{
  background:
    radial-gradient(ellipse at 50% 45%, rgba(255,252,245,.22), rgba(241,222,184,.35) 80%),
    url("../games/chengyu/cover.jpg") center/cover no-repeat!important;
  opacity:1!important;
}
body.theme-chengyu .shell-bg::after{
  content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 42%,transparent 34%,rgba(87,57,23,.20) 100%);
}
body.theme-chengyu .gx-m{
  padding:12px 12px 10px;background:rgba(255,252,242,.84);
  border:1px solid rgba(117,78,34,.26);border-radius:8px;
  box-shadow:0 12px 32px rgba(88,58,22,.16);
}
body.theme-chengyu .gx-m-q{color:#38280f;text-shadow:none}
.theme-chengyu .gx-m-modebadge{background:#fffaf0;color:#6b451f;border-color:#c49a5b}
.theme-chengyu .gx-m-media{
  position:relative;margin:8px 0 14px;padding:12px 16px;
  background:linear-gradient(180deg,#fffdf7,#f8efd9);
  border:1px solid rgba(117,78,34,.28);border-radius:3px;
  box-shadow:0 8px 22px rgba(88,58,22,.14);
}
.theme-chengyu .gx-m-media::before,
.theme-chengyu .gx-m-media::after{
  content:"";position:absolute;top:-5px;bottom:-5px;width:9px;border-radius:3px;z-index:3;
  background:linear-gradient(90deg,#8e5928,#c99b5b,#70431e);
}
.theme-chengyu .gx-m-media::before{left:-5px}
.theme-chengyu .gx-m-media::after{right:-5px}
.theme-chengyu .gx-m-media img{
  width:100%;height:auto;max-height:34vh;object-fit:contain;
  background:#fffdf7;border-radius:2px;border:1px solid rgba(153,109,52,.22);padding:4px;
}
.theme-chengyu .gx-img-seal{width:27px;height:30px;right:10px;bottom:8px;font-size:13px}
.theme-chengyu .gx-m-timer{height:10px;background:rgba(84,55,22,.13);border:1px solid rgba(117,78,34,.28)}
.theme-chengyu .gx-m-timer i{background:linear-gradient(90deg,#5b3818,#c08a3c)}
.theme-chengyu .gx-tiles{gap:8px}
.theme-chengyu .gx-tile{
  background:linear-gradient(180deg,#fffdf5,#f4e5c6);
  border:2px solid #8b5a2b;color:#38280f;border-radius:5px;
  box-shadow:0 4px 0 #b68a4f,0 6px 12px rgba(70,42,12,.16);
  animation:cyTileIn .4s cubic-bezier(.16,1,.3,1) both;
}
.theme-chengyu .gx-tile.on{background:linear-gradient(180deg,#b23a2b,#8d241b);border-color:#e0b36a;color:#fff7e6;box-shadow:0 4px 0 #641711}
.theme-chengyu .gx-m-submit{border-radius:6px;background:linear-gradient(180deg,#d8aa62,#a96d2c);color:#fff8e8;box-shadow:0 5px 0 #70431e}
.theme-chengyu .gx-m-submit.ready{background:linear-gradient(180deg,#a83125,#7e1e16);color:#fff7e6}
@keyframes cyTileIn{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}

.theme-chengyu .gx-media-stage > .gx-q{display:none}
body.theme-chengyu .gx-m > .gx-m-q{display:none}

/* 看图猜成语手机：压缩图面，保证提交按钮露出 */
.theme-chengyu .gx-m-media{margin:4px 0 8px;padding:8px 12px}
.theme-chengyu .gx-m-media img{max-height:25vh;padding:3px}
.theme-chengyu .gx-tiles{gap:7px;margin-bottom:12px}
.theme-chengyu .gx-tile{min-height:50px}
.theme-chengyu .gx-m-submit{position:sticky;bottom:8px;z-index:6;margin-top:8px}

/* ==================== 数字读心术 · 星夜水晶球 v2 ==================== */
.theme-duxinshu .sc-stage{
  background:
    radial-gradient(ellipse at 50% 42%, rgba(87,45,160,.10) 0%, rgba(25,8,55,.34) 52%, rgba(9,3,25,.78) 100%),
    linear-gradient(180deg, rgba(23,8,52,.18), rgba(9,3,25,.42)),
    url("../games/duxinshu/cover.jpg") center 42%/cover no-repeat;
}
.theme-duxinshu .sc-stage::before{
  width:74vmin;height:74vmin;left:50%;top:50%;right:auto;bottom:auto;
  transform:translate(-50%,-50%);filter:none;opacity:.55;
  background:radial-gradient(circle, transparent 58%, rgba(193,153,255,.12) 59%, transparent 60%);
  border:1px solid rgba(212,174,255,.20);
  box-shadow:0 0 70px rgba(159,104,255,.18),inset 0 0 80px rgba(159,104,255,.10);
  animation:mindOrbit 26s linear infinite;
}
.theme-duxinshu .sc-stage::after{
  width:52vmin;height:52vmin;left:50%;top:50%;right:auto;bottom:auto;
  transform:translate(-50%,-50%);filter:none;opacity:.42;
  background:radial-gradient(circle, transparent 56%, rgba(120,196,255,.10) 57%, transparent 58%);
  border:1px dashed rgba(255,221,150,.30);border-radius:50%;
  animation:mindOrbit 18s linear infinite reverse;
}
@keyframes mindOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}
.theme-duxinshu .sc-hud .sc-name{color:#f5e7c8;font-size:30px;text-shadow:0 3px 16px rgba(0,0,0,.5)}
.theme-duxinshu .sc-badge{
  background:rgba(47,22,95,.56);border-color:rgba(212,174,255,.35);
  color:#e5d7ff;box-shadow:0 8px 24px rgba(0,0,0,.18);
}
.theme-duxinshu .sc-emoji{display:none}
.theme-duxinshu .sc-center{isolation:isolate}
.theme-duxinshu .sc-center::before{
  content:"";position:absolute;z-index:-1;width:min(70vh,760px);height:min(70vh,760px);
  left:50%;top:50%;transform:translate(-50%,-50%);
  border:1px solid rgba(209,168,255,.15);border-radius:50%;
  box-shadow:0 0 80px rgba(161,103,255,.13),inset 0 0 80px rgba(161,103,255,.08);
  pointer-events:none;
}
.theme-duxinshu .sc-title{
  color:#f6d88e;font-size:62px;letter-spacing:.10em;
  text-shadow:0 4px 22px rgba(0,0,0,.55),0 0 26px rgba(255,206,122,.18);
}
.theme-duxinshu .sc-text{color:#fff3df;font-size:38px;line-height:1.55;text-shadow:0 3px 18px rgba(0,0,0,.4)}
.theme-duxinshu .sc-sub{color:#d7c5ff;font-size:24px;opacity:1}
.theme-duxinshu .sc-foot .sc-count{color:#cbb9ee}
.theme-duxinshu .sc-dot{background:rgba(210,185,255,.24)}
.theme-duxinshu .sc-dot.done{background:rgba(210,185,255,.5)}
.theme-duxinshu .sc-dot.on{background:linear-gradient(90deg,#ffe2a0,#b98cff);box-shadow:0 0 18px rgba(185,140,255,.7)}

/* 手机端读心术：跟着大屏，不操作 */
body.theme-duxinshu{background:#12062b;color:#f4ebff}
body.theme-duxinshu .sc-stu-stage{
  position:fixed;inset:0;z-index:0;
  background:
    radial-gradient(ellipse at 50% 42%, rgba(91,45,160,.08), rgba(14,4,34,.72) 78%),
    url("../games/duxinshu/cover.jpg") center 42%/cover no-repeat;
}
body.theme-duxinshu .sc-stu-stage::after{
  content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 42%,transparent 28%,rgba(7,2,20,.52) 100%);
}
.sc-stu-view{position:fixed;inset:0;z-index:1;display:flex;flex-direction:column;overflow:hidden}
.sc-stu-hud{display:flex;align-items:center;justify-content:space-between;padding:20px 18px 8px;font-size:13px;font-weight:700;letter-spacing:.12em;color:#d5c5f2;position:relative;z-index:2}
.sc-stu-hud span:last-child{padding:5px 10px;border:1px solid rgba(212,174,255,.32);border-radius:999px;color:#f0e4ff;background:rgba(47,22,95,.45)}
.sc-stu-center{
  position:relative;z-index:2;width:calc(100% - 32px);max-width:420px;margin:auto;
  padding:20px 18px 18px;box-sizing:border-box;text-align:center;
  background:linear-gradient(165deg,rgba(53,28,99,.78),rgba(22,9,48,.88));
  border:1px solid rgba(212,174,255,.30);border-radius:16px;
  box-shadow:0 22px 54px rgba(2,0,12,.42),inset 0 1px 0 rgba(255,255,255,.08);
  animation:mindCardIn .5s cubic-bezier(.16,1,.3,1) both;
}
.sc-stu-orb{font-size:56px;line-height:1;filter:drop-shadow(0 0 22px rgba(185,140,255,.6));animation:mindFloat 4s ease-in-out infinite}
.sc-stu-step{display:inline-block;margin:8px auto 10px;padding:4px 12px;border-radius:999px;background:rgba(246,216,142,.12);border:1px solid rgba(246,216,142,.30);color:#f6d88e;font-size:11px;letter-spacing:.16em}
.sc-stu-title{color:#f6d88e;font-size:25px;font-weight:700;line-height:1.45;text-shadow:0 3px 14px rgba(0,0,0,.35)}
.sc-stu-text{margin-top:12px;color:#fff3df;font-size:20px;font-weight:600;line-height:1.6}
.sc-stu-sub{margin-top:9px;color:#cfc0ea;font-size:14px;line-height:1.6}
.sc-stu-note{margin-top:16px;padding-top:10px;border-top:1px solid rgba(212,174,255,.18);color:#a99bc8;font-size:11px;letter-spacing:.06em}
.sc-stu-foot{position:relative;z-index:2;display:flex;justify-content:center;padding:12px 16px 22px}
.sc-stu-foot span{display:flex;gap:5px;align-items:center;max-width:100%;overflow:hidden}
.sc-stu-dot{width:6px;height:6px;border-radius:50%;background:rgba(213,197,242,.24);flex:none}
.sc-stu-dot.done{background:rgba(213,197,242,.55)}
.sc-stu-dot.on{width:16px;border-radius:999px;background:linear-gradient(90deg,#f6d88e,#b98cff);box-shadow:0 0 10px rgba(185,140,255,.7)}
@keyframes mindFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes mindCardIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}


/* ==================== 断句大挑战 · 墨绿黑板 v2 ==================== */
.duanju-stage{
  background:
    linear-gradient(180deg, rgba(5,25,19,.18), rgba(5,25,19,.30)),
    url("../games/duanju/cover.jpg") center/cover no-repeat;
}
.duanju-stage::before{
  content:"";position:absolute;inset:-8%;pointer-events:none;opacity:.65;
  background:
    radial-gradient(circle at 15% 22%, rgba(255,255,255,.10) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 18%, rgba(255,255,255,.08) 0 1px, transparent 2px),
    radial-gradient(circle at 88% 76%, rgba(255,255,255,.08) 0 1px, transparent 2px),
    radial-gradient(circle at 36% 82%, rgba(255,255,255,.06) 0 1px, transparent 2px);
  background-size:170px 150px,220px 190px,260px 210px,190px 170px;
  animation:djDust 12s ease-in-out infinite alternate;
}
.duanju-stage::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 46%, transparent 40%, rgba(3,18,14,.38) 100%);
}
@keyframes djDust{from{opacity:.35;transform:translateY(0)}to{opacity:.8;transform:translateY(-8px)}}

.theme-duanju .gx-title{
  color:#f1f6dd!important;font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;
  font-size:34px;font-weight:700;letter-spacing:.08em;text-shadow:0 2px 12px rgba(0,0,0,.45);
}
.theme-duanju .gx-pill{
  background:rgba(9,39,30,.62);color:#ecf4da;border:1px solid rgba(241,239,210,.34);
}
.theme-duanju .gx-pill b{color:#f2cf5b}
.theme-duanju .gx-center.gx-media-stage{
  justify-content:center;min-height:100vh!important;height:100vh;box-sizing:border-box;
  padding-top:72px;padding-bottom:64px;
}
.theme-duanju .gx-media-riddle{
  position:relative;width:min(1160px,84vw);margin:0 auto;padding:2px 0;
  background:transparent;border:0;box-shadow:none;
  animation:djChalkIn .6s cubic-bezier(.16,1,.3,1) both;
}
.theme-duanju .gx-media-riddle::before{
  content:"";position:absolute;inset:-14px -22px;border:2px solid rgba(239,246,218,.22);
  border-radius:3px;pointer-events:none;transform:rotate(-.2deg);
}
.theme-duanju .gx-media-riddle::after{
  content:"";position:absolute;left:9%;right:9%;bottom:-12px;height:3px;
  background:linear-gradient(90deg,transparent,rgba(240,244,220,.6),transparent);
  transform:scaleX(.8);transform-origin:center;animation:djUnderline .7s .2s ease both;
}
.theme-duanju .gx-riddle-quote{display:none}
.theme-duanju .gx-riddle-text{
  background:transparent!important;border:0!important;box-shadow:none!important;
  color:#f4f1dc!important;font-family:"Microsoft YaHei","PingFang SC",sans-serif!important;
  font-weight:700!important;font-size:clamp(40px,4.2vw,62px)!important;
  line-height:1.8!important;letter-spacing:.04em!important;
  padding:26px 42px 28px!important;text-shadow:0 2px 0 rgba(0,0,0,.20);
}
.theme-duanju .gx-riddle-src{
  display:block;width:fit-content;margin:12px auto 0;padding:3px 15px;
  border:1px dashed rgba(242,207,91,.55);border-radius:2px;
  color:#f2cf5b;font-family:"Microsoft YaHei",sans-serif;
  font-size:22px;font-weight:700;letter-spacing:.24em;background:rgba(8,32,24,.34);
}
.theme-duanju .gx-timer{
  width:min(650px,58vw);height:10px;margin:22px auto 0;
  background:rgba(239,246,218,.14);border:1px solid rgba(239,246,218,.24);
}
.theme-duanju .gx-timer i{background:linear-gradient(90deg,#d1bd69,#f2cf5b)}
.theme-duanju .gx-sub{color:#edf2d9!important;font-size:23px;font-weight:600;text-shadow:0 2px 10px rgba(0,0,0,.4)}
@keyframes djChalkIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes djUnderline{from{transform:scaleX(0)}to{transform:scaleX(.8)}}

/* 手机端：同一块黑板，粉笔字和白线 */
body.theme-duanju{background:#0a2b22;color:#f4f1dc}
body.theme-duanju .shell-bg{
  background:
    radial-gradient(ellipse at 50% 44%, rgba(8,39,30,.06), rgba(3,20,15,.45) 82%),
    url("../games/duanju/cover.jpg") center/cover no-repeat!important;
  opacity:1!important;
}
body.theme-duanju .shell-bg::after{
  content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 42%,transparent 30%,rgba(2,18,13,.42) 100%);
}
body.theme-duanju .gx-m{
  padding:14px 14px 12px;background:rgba(5,32,24,.72);
  border:1px solid rgba(239,246,218,.22);border-radius:8px;
  box-shadow:0 14px 34px rgba(0,0,0,.24);
}
.theme-duanju .gx-m-q{color:#f1efd8;font-family:"Microsoft YaHei",sans-serif;font-weight:700}
.theme-duanju .gx-m-riddle{
  margin:10px 0 14px;padding:12px 10px;background:transparent!important;border:0;box-shadow:none;
  border-top:1px dashed rgba(239,246,218,.28);border-bottom:1px dashed rgba(239,246,218,.28);
}
.theme-duanju .gx-m-riddle-quote{display:none}
.theme-duanju .gx-m-riddle-text{
  color:#f4f1dc!important;font-family:"Microsoft YaHei",sans-serif!important;font-weight:700!important;
  font-size:24px!important;line-height:1.7;text-shadow:0 1px 0 rgba(0,0,0,.2);
}
.theme-duanju .gx-m-riddle-src{
  display:block;width:fit-content;margin:10px auto 0;color:#f2cf5b;
  font-size:13px;font-weight:700;letter-spacing:.2em;border:1px dashed rgba(242,207,91,.45);padding:2px 10px;
}
.theme-duanju .gx-m-timer{height:10px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18)}
.theme-duanju .gx-m-timer i{background:linear-gradient(90deg,#d1bd69,#f2cf5b)}
.theme-duanju .gx-buzz-btn{
  background:radial-gradient(circle at 36% 30%,#fff8d8,#e5c46b 60%,#b18a32)!important;
  border:4px solid rgba(255,247,214,.85)!important;
  box-shadow:0 12px 0 #6e5520,0 20px 36px rgba(0,0,0,.3)!important;
  color:#173d30!important;
}
.theme-duanju .gx-m-submit{background:linear-gradient(180deg,#d7c06b,#a9852e);color:#18382b;box-shadow:0 5px 0 #6b521d}
.theme-duanju .gx-m-submit.ready{background:linear-gradient(180deg,#f0d77d,#ba9135);color:#173d30}
.theme-duanju .gx-m-typebox input{background:rgba(255,255,255,.10);color:#f4f1dc;border-color:rgba(255,255,255,.24)}


/* 断句：大屏不放大抢答圆钮，只留粉笔题面 */
.theme-duanju .gx-buzz-big{display:none!important}
.theme-duanju .gx-media-stage>.gx-q{display:none}
.theme-duanju .gx-center.gx-media-stage{
  justify-content:center;min-height:100vh!important;height:100vh;box-sizing:border-box;
  padding-top:70px;padding-bottom:64px;
}
.theme-duanju .gx-media-riddle{margin-top:0}

/* ==================== 你比划我猜 · 舞台聚光灯 v2 ==================== */
.mint-stage{
  background:
    radial-gradient(ellipse at 50% 46%, rgba(3,24,22,.06) 0%, rgba(3,24,22,.30) 58%, rgba(2,15,16,.72) 100%),
    url("../assets/bg/bihua-stage.jpg") center/cover no-repeat;
}
.mint-stage::before{
  content:"";position:absolute;inset:-5%;pointer-events:none;opacity:.8;
  background:
    radial-gradient(circle at 18% 18%, rgba(255,211,122,.20), transparent 18%),
    radial-gradient(circle at 82% 22%, rgba(255,232,166,.16), transparent 16%),
    radial-gradient(circle at 50% 90%, rgba(66,206,177,.13), transparent 28%);
  animation:bhGlow 7s ease-in-out infinite alternate;
}
.mint-stage::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 46%, transparent 38%, rgba(1,15,16,.38) 100%);
}
@keyframes bhGlow{from{opacity:.55;transform:scale(1)}to{opacity:.95;transform:scale(1.025)}}

.theme-mint{
  --gx-bg1:#0b3b36;--gx-bg2:#062723;--gx-bg3:#021614;
  --gx-red:#ff8f7d;--gx-gold:#f2c86b;--gx-yellow:#ffe7a2;
  --gx-green:#7de0bd;--gx-blue:#8ec8ff;--gx-pink:#ff9db6;
  --gx-ink:#fff5dc;--gx-ink2:#b7d9ce;--gx-card:#0c342e;--gx-line:rgba(242,200,107,.36);
  --gx-accent:#ffd27a;--gx-accent2:#7de0bd;
}
.theme-mint .gx-rule{
  background:rgba(2,25,23,.52)!important;color:#fff5dc!important;
  border-color:rgba(242,200,107,.35)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.16);
}
.theme-mint .gx-pill{background:rgba(2,23,22,.58);color:#fff3d5;border:1px solid rgba(242,200,107,.42)}
.theme-mint .gx-pill b{color:#ffdf91}
.ch-audience{
  background:radial-gradient(ellipse at 50% 48%,rgba(2,23,21,.54),transparent 68%);
}
.ch-performer{color:#ffd583!important;font-family:"Microsoft YaHei",sans-serif!important;font-weight:700!important}
.ch-time{color:#ffe3a0!important;text-shadow:0 4px 24px rgba(255,184,76,.28),0 2px 10px rgba(0,0,0,.45)}
.ch-audtip{color:#d4eee4!important;font-weight:600}
.ch-got{color:#ffdd91;text-shadow:0 4px 22px rgba(255,190,92,.22)}
.ch-final .gx-rank,.gx-rankrow{color:#fff4da}
.gx-rankrow .gx-rk{color:#f2c86b}
.gx-rankrow.r1{background:rgba(242,200,107,.16);border-color:rgba(242,200,107,.44)}

/* 学生端同舞台 */
body.theme-mint{background:#06211f;color:#fff5dc}
body.theme-mint .gx-m{background:rgba(3,31,29,.76);border:1px solid rgba(242,200,107,.28);border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.28)}
.theme-mint .gx-m-q{color:#fff5dc}
.theme-mint .gx-m-state .big{color:#fff5dc}
.theme-mint .ch-m-word{color:#ffe2a0;text-shadow:0 3px 16px rgba(255,180,76,.22)}
.theme-mint .ch-m-hint{color:#b7d9ce!important}
.theme-mint .gx-m-modebadge{background:rgba(255,245,220,.92);color:#123f36;border-color:rgba(242,200,107,.5)}
.theme-mint .gx-btn{box-shadow:0 5px 0 rgba(0,0,0,.22)}
.theme-mint .gx-m-submit{background:linear-gradient(180deg,#f1cd78,#c9943d);color:#173c32;box-shadow:0 5px 0 #7b5b20}
@keyframes bhFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}

/* ==================== 断句大挑战 · 原创黑板底图 ==================== */
.duanju-stage{
  background:
    radial-gradient(ellipse at 50% 46%, rgba(4,28,23,.08) 0%, rgba(3,22,18,.18) 58%, rgba(2,14,12,.48) 100%),
    url("../assets/bg/duanju-board.jpg") center/cover no-repeat;
}
.duanju-stage::before{
  background-image:
    radial-gradient(circle at 15% 24%, rgba(255,249,222,.12) 0 1px, transparent 2px),
    radial-gradient(circle at 72% 22%, rgba(255,249,222,.10) 0 1px, transparent 2px),
    radial-gradient(circle at 84% 78%, rgba(255,249,222,.09) 0 1px, transparent 2px);
  background-size:180px 160px,230px 200px,260px 220px;
}
.duanju-stage::after{background:radial-gradient(ellipse at 50% 46%,transparent 44%,rgba(2,13,11,.32) 100%)}

/* ==================== 剩余游戏：原创氛围底图（数据驱动） ==================== */

/* ===== C5 · 加载与切换三套规则（2026-10-30）=====
   一、页面切换：主区内容淡入上浮 280ms
   二、数据加载：占位块呼吸脉冲 1.2s 循环
   三、弹层出现：遮罩 160ms 淡入 + 卡片 280ms 弹出（带回弹）
   reduce 机器沿用既有口径：压到 1ms 保留终态。 */
@keyframes c5PageIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes c5Pulse { 0%, 100% { opacity: .45; } 50% { opacity: .9; } }
@keyframes c5MaskIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes c5PopIn { from { opacity: 0; transform: scale(.96) translateY(8px); } to { opacity: 1; transform: none; } }
#app .ws-main > *, .mod-wrap > *, .m-page > * { animation: c5PageIn var(--mo-base) var(--mo-out) both; }
.c5-loading, .skeleton, [data-loading="1"] { animation: c5Pulse 1.2s ease-in-out infinite; }
.sp-mask, .pop-mask, .modal-mask, .c5-mask { animation: c5MaskIn var(--mo-fast) ease both; }
.sp-card, .pop-card, .modal-card, .c5-pop { animation: c5PopIn var(--mo-base) var(--mo-pop) both; }


/* ===== C4 · 九个功能页统一入场错峰（2026-10-30）=====
   抢答/点名/弹幕/投票/金句墙/匿名信箱/积分榜/结算仪式/班级管理
   这九页都由 #main 里的 .panel 组成，按行序 60ms 错峰升起，不用改 JS。 */
@keyframes c4Rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
#app .ws-main .panel > *, #app .ws-main .home-card, #app .ws-main .mod-col > * { animation: c4Rise var(--mo-slow) var(--mo-out) both; }
#app .ws-main .panel > *:nth-child(1), #app .ws-main .home-card:nth-child(1), #app .ws-main .mod-col > *:nth-child(1) { animation-delay: 0ms; }
#app .ws-main .panel > *:nth-child(2), #app .ws-main .home-card:nth-child(2), #app .ws-main .mod-col > *:nth-child(2) { animation-delay: 60ms; }
#app .ws-main .panel > *:nth-child(3), #app .ws-main .home-card:nth-child(3), #app .ws-main .mod-col > *:nth-child(3) { animation-delay: 120ms; }
#app .ws-main .panel > *:nth-child(4), #app .ws-main .home-card:nth-child(4), #app .ws-main .mod-col > *:nth-child(4) { animation-delay: 180ms; }
#app .ws-main .panel > *:nth-child(5), #app .ws-main .home-card:nth-child(5), #app .ws-main .mod-col > *:nth-child(5) { animation-delay: 240ms; }
#app .ws-main .panel > *:nth-child(6), #app .ws-main .home-card:nth-child(6), #app .ws-main .mod-col > *:nth-child(6) { animation-delay: 300ms; }
#app .ws-main .panel > *:nth-child(7), #app .ws-main .home-card:nth-child(7), #app .ws-main .mod-col > *:nth-child(7) { animation-delay: 360ms; }
#app .ws-main .panel > *:nth-child(8), #app .ws-main .home-card:nth-child(8), #app .ws-main .mod-col > *:nth-child(8) { animation-delay: 420ms; }
#app .ws-main .panel > *:nth-child(9), #app .ws-main .home-card:nth-child(9), #app .ws-main .mod-col > *:nth-child(9) { animation-delay: 480ms; }
#app .ws-main .panel > *:nth-child(10), #app .ws-main .home-card:nth-child(10), #app .ws-main .mod-col > *:nth-child(10) { animation-delay: 540ms; }


/* 2026-11-02 三端回归修正（B07）
   1) 手机端底部给固定页脚留位置：出题四选项时最后一行会被 .stu-credit 压住；
   2) theme-dengmi 的抢答成功卡是米白底，而 --gx-ink 在该主题是米色 → 副标题与「等待判定」几乎看不见。 */
@media (max-width: 767px) {
  .gx-view { padding-bottom: 34px; }
}
.theme-dengmi .gx-buzz-win-sub,
.theme-dengmi .gx-buzz-win .gx-buzz-wait { color: #5c1615; }

/* 2026-11-02 手机端 choice 出题屏一屏可读（B07）：390×844 下四选项 + 题图会顶到固定页脚，压缩版式而不是让页面滚动 */
@media (max-width: 767px) {
  .gx-m-choice { padding: 12px 14px 44px !important; }
  .gx-m-choice .gx-m-media { padding: 6px 8px; }
  .gx-m-choice .gx-m-media img { width: auto !important; height: auto !important; max-height: 22vh !important; }
  .gx-m-choice .gx-m-opts { gap: 10px; }
  .gx-m-choice .gx-m-opt { padding: 10px 14px !important; font-size: 17px; border-radius: 14px; }
  .gx-m-choice .gx-m-opt .gx-letter { width: 34px; height: 34px; font-size: 15px; border-width: 2px; }
  .gx-m-choice .gx-m-timer { margin: 10px 0; }
  .gx-m-choice .gx-m-state { padding: 10px 8px; }
  .gx-m-choice .gx-m-state .big { font-size: 24px; }
}

/* ===== 讲师台选题板 v3.9.80（前缀 gxgb，避免与大屏 .gxg-board 冲突） ===== */
.gxgb-wrap{margin:0 0 14px;padding:14px;border-radius:16px;background:rgba(18,26,48,.66);border:1px solid rgba(216,177,90,.24);box-shadow:0 10px 26px rgba(0,0,0,.35)}
.gxgb-hd{display:flex;align-items:baseline;gap:8px;font-size:15px;font-weight:800;color:#f2d58a;margin-bottom:10px;white-space:nowrap;overflow:hidden}
.gxgb-hd span{font-weight:500;font-size:11px;color:#cbbd98;opacity:.85;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.gxgb-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;max-height:472px;overflow-y:auto;overflow-x:hidden;padding:2px 4px 2px 2px;scrollbar-width:thin;scrollbar-color:rgba(216,177,90,.5) transparent}
.gxgb-cell{position:relative;aspect-ratio:1/1;border-radius:11px;border:2px solid rgba(216,177,90,.42);
  background:linear-gradient(160deg,#1a2440,#0e1730 62%,#16233c);overflow:hidden;cursor:pointer;padding:0;
  font-family:inherit;color:#e8dcbe;font-weight:800;font-size:14px;
  box-shadow:inset 0 2px 0 rgba(255,255,255,.09),0 5px 0 rgba(8,12,24,.85),0 8px 14px rgba(0,0,0,.45);
  transition:transform .2s cubic-bezier(.22,1.4,.4,1),border-color .2s,box-shadow .2s}
.gxgb-cell:hover{transform:translateY(-3px);border-color:rgba(216,177,90,.9)}
.gxgb-cell img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.9}
.gxgb-cell em{position:absolute;left:5px;bottom:4px;font-style:normal;font-size:11px;padding:1px 5px;
  border-radius:6px;background:rgba(0,0,0,.62);color:#fff;font-variant-numeric:tabular-nums}
.gxgb-cell.on{border-color:#f0a338;box-shadow:inset 0 2px 0 rgba(255,255,255,.14),0 7px 0 rgba(8,12,24,.9),0 0 0 3px rgba(240,163,56,.3),0 0 26px rgba(240,163,56,.35)}
.gxgb-cell.got{border-color:#3fbf7f}
.gxgb-cell.got::after{content:"✓";position:absolute;right:5px;top:2px;font-size:15px;font-weight:900;color:#5ce0a4;text-shadow:0 1px 4px rgba(0,0,0,.8)}
