:root {
  --primary: #F4511E;
  --primary-2: #FF7A3D;
  --ink: #1F2937;
  --ink-2: #6B7280;
  --ink-3: #9AA0A6;
  --line: #EDE7DE;
  --bg: #FAF8F5;
  --card: #FFFFFF;
  --danger: #E5484D;
  --ok: #2FA84F;
  --warn: #D97706;
  --radius: 14px;
  --shadow: 0 6px 24px rgba(23, 43, 60, 0.06);
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  background: var(--bg); color: var(--ink); font-size: 14px;
}
.hidden { display: none !important; }
a { color: var(--primary); text-decoration: none; }
button { font-family: inherit; }

/* ---------- 登录浮层 ---------- */
.overlay {
  position: fixed; inset: 0; z-index: 100;
  background: radial-gradient(1200px 600px at 30% 0%, #FFEDE1 0%, #F3F6F7 60%);
  display: flex; align-items: center; justify-content: center;
}
.login-card {
  width: 420px; background: #fff; border-radius: 20px; padding: 44px 40px;
  box-shadow: var(--shadow); text-align: center;
}
.login-logo { font-size: 30px; font-weight: 800; color: var(--primary); }
.login-sub { margin-top: 8px; color: var(--ink-2); }
.login-note { margin: 22px 0; color: var(--ink-3); font-size: 12px; line-height: 1.8; }
.login-status { margin-top: 14px; color: var(--warn); font-size: 13px; min-height: 18px; }

/* ---------- 布局 ---------- */
.shell { display: flex; height: 100%; }
.sidebar {
  width: 212px; background: linear-gradient(180deg, #0B2A58, #071A33); color: #D8E4F2; flex-shrink: 0;
  display: flex; flex-direction: column;
}
.brand { padding: 22px 20px 14px; }
.brand-name { font-size: 20px; font-weight: 800; color: #fff; }
.brand-tag { font-size: 12px; color: #8FA8C8; margin-top: 2px; }
.nav { flex: 1; padding: 8px 10px; overflow-y: auto; }
.nav-item {
  display: block; color: #D8E4F2; padding: 11px 14px; border-radius: 10px;
  margin-bottom: 2px; font-size: 14px; transition: all .15s;
}
.nav-item:hover { background: rgba(255,255,255,.08); color: #fff; }
.nav-item.active { background: var(--primary-2); color: #fff; font-weight: 600; }
.nav-admin { margin-top: 14px; border-top: 1px solid rgba(255,255,255,.12); padding-top: 12px; color: #9DB2D0; font-size: 13px; }
.sidebar-foot { padding: 14px 20px; font-size: 11px; color: #7E93B5; line-height: 1.7; }
.main {
  flex: 1; display: flex; flex-direction: column; min-width: 0;
  /* 2026-09-19：主内容区补背景——暖橙光晕自右上角洒入，与登录页同风格，页面不再白板 */
  background:
    radial-gradient(1100px 520px at 88% -12%, rgba(255, 140, 58, .12), transparent 62%),
    radial-gradient(900px 460px at -6% 110%, rgba(244, 81, 30, .05), transparent 58%),
    linear-gradient(180deg, #FBF0E7 0%, var(--bg) 36%);
  background-attachment: fixed;
}
.topbar {
  height: 56px; background: #fff; border-bottom: 1px solid var(--line);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 22px; flex-shrink: 0;
}
.topbar-title { font-size: 17px; font-weight: 700; }
.topbar-right { display: flex; align-items: center; gap: 12px; }
.badge-ai { background: #FFF1E6; color: var(--primary); font-size: 12px; padding: 4px 12px; border-radius: 20px; }
.user-box { font-size: 13px; color: var(--ink); background: #EEF3F8; border: 1px solid #D8E4EF; padding: 5px 14px; border-radius: 16px; font-weight: 600; }
.blind-note { margin: 14px 0 4px; font-size: 13px; color: #B05A2C; background: #FFF3E8; border: 1px dashed #F0B27A; padding: 8px 14px; border-radius: 10px; }
/* 自由练习页头：提示 + 筛选整体包进白色胶囊（2026-09-20） */
.free-head {
  background: #ffffff; border: 1px solid rgba(244, 81, 30, .07);
  border-radius: 16px; padding: 14px 16px; margin: 14px 0;
}
.free-head .blind-note { margin: 0 0 10px; background: transparent; border: none; padding: 0 2px; }
.free-head .filter-bar { display: flex; align-items: center; gap: 10px; flex-wrap: nowrap; margin-bottom: 0; }
/* 2026-10-12b 用户反馈：搜索条加长（弹性 380-520px）；搜索框/总数胶囊/刷新按钮统一 40px 高 */
.free-head .search-input { flex: 0 1 380px; min-width: 200px; max-width: 440px; }
.free-head .filter-bar .btn { height: 40px; padding: 0 20px; display: inline-flex; align-items: center; box-sizing: border-box; }
.quiz-timer { display: inline-flex; align-items: center; gap: 5px; background: #F4511E; color: #fff; font-size: 13px; font-weight: 700; padding: 4px 12px; border-radius: 14px; font-variant-numeric: tabular-nums; }
.quiz-timer.urgent { background: #C62828; animation: timerPulse 1s ease-in-out infinite; }
@keyframes timerPulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.view { flex: 1; overflow-y: auto; padding: 22px; }

/* ---------- 通用组件 ---------- */
.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px 20px; }
.btn {
  border: 0; cursor: pointer; border-radius: 10px; padding: 10px 22px;
  font-size: 14px; font-weight: 600; transition: all .15s; display: inline-block;
}
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-primary { background: linear-gradient(135deg, var(--primary), var(--primary-2)); color: #fff; }
.btn-primary:hover:not(:disabled) { filter: brightness(1.06); }
.btn-ghost { background: #F5F3EF; color: var(--ink); }
.btn-ghost:hover { background: #E3ECEE; }
.btn-danger { background: #FBE9E4; color: var(--danger); }
.btn-block { display: block; width: 100%; }
.empty { text-align: center; color: var(--ink-3); padding: 60px 0; }
.empty b { display: block; font-size: 15px; color: var(--ink-2); margin-bottom: 6px; }
.muted { color: var(--ink-3); }
.small { font-size: 12px; }

/* toast */
#toastWrap { position: fixed; top: 66px; left: 50%; transform: translateX(-50%); z-index: 200; display: flex; flex-direction: column; gap: 8px; align-items: center; }
.toast { background: rgba(17,30,36,.92); color: #fff; padding: 9px 18px; border-radius: 8px; font-size: 13px; max-width: 70vw; animation: fadeIn .2s; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; } }

/* 表格 */
.tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.tbl th, .tbl td { text-align: left; padding: 9px 10px; border-bottom: 1px solid var(--line); }
.tbl th { color: var(--ink-3); font-weight: 600; font-size: 12px; }
.tbl tr:hover td { background: #FAF8F5; }

/* 标签 */
.tag { display: inline-block; padding: 3px 10px; border-radius: 12px; font-size: 12px; }
.tag-ok { background: #E6F6EC; color: var(--ok); }
.tag-bad { background: #FDEBE7; color: var(--danger); }
.tag-warn { background: #FFF4E0; color: var(--warn); }
.tag-info { background: #FFF1E6; color: var(--primary); }
.tag-real { background: #F3ECFB; color: #7C3AED; }
.tag-line { background: #F0F4F5; color: var(--ink-2); }

/* 弹层 */
.modal-mask { position: fixed; inset: 0; background: rgba(10,20,26,.5); z-index: 90; display: flex; align-items: center; justify-content: center; }
.modal { background: #fff; border-radius: 16px; padding: 24px 26px; width: min(720px, 92vw); max-height: 86vh; overflow-y: auto; box-shadow: 0 20px 60px rgba(0,0,0,.2); }
.modal-title { font-size: 16px; font-weight: 700; margin-bottom: 12px; }
.modal-foot { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }

/* ---------- 首页 ---------- */
.stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin-bottom: 20px; }
.stat-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px 18px; }
.stat-num { font-size: 26px; font-weight: 800; color: var(--primary); }
.stat-label { color: var(--ink-3); font-size: 12px; margin-top: 4px; }
/* 病例库数据版（自由练习 · 病例数量统计板） */
.pool-board { display: flex; gap: 14px; margin-bottom: 12px; }
.pool-total {
  flex: 0 0 216px; border-radius: var(--radius); padding: 20px 22px;
  background: linear-gradient(135deg, #F4511E 0%, #FF8A50 100%);
  color: #fff; box-shadow: var(--shadow); display: flex; flex-direction: column; justify-content: center;
}
.pool-total-num { font-size: 44px; font-weight: 800; line-height: 1; letter-spacing: .5px; }
.pool-total-lab { font-size: 14px; font-weight: 600; margin-top: 10px; }
.pool-total-sub { font-size: 12px; opacity: .85; margin-top: 4px; }
.pool-rows {
  flex: 1; background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow);
  padding: 16px 18px; display: flex; flex-direction: column; justify-content: center; gap: 12px; min-width: 0;
}
.pool-row { display: grid; grid-template-columns: 110px 1fr 64px; align-items: center; gap: 12px; }
.pool-name { font-size: 13px; color: var(--ink); display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.pool-name .dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; }
.pool-bar { height: 8px; background: #F0EAE2; border-radius: 6px; overflow: hidden; }
.pool-bar span { display: block; height: 100%; border-radius: 6px; min-width: 3px; }
.pool-n { font-weight: 700; color: var(--ink); text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pool-foot { margin: -2px 0 20px; font-size: 12px; color: var(--ink-3); padding-left: 2px; }
.pool-foot b { color: var(--ink-2); font-weight: 600; }
.pool-empty { padding: 16px 18px; font-size: 13px; color: var(--ink-3); background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); margin-bottom: 12px; }
@media (max-width: 760px) {
  .pool-board { flex-direction: column; }
  .pool-total { flex: none; flex-direction: row; align-items: baseline; gap: 12px; padding: 16px 18px; }
  .pool-total-num { font-size: 32px; }
  .pool-total-lab { margin-top: 0; }
  .pool-total-sub { display: none; }
  .pool-row { grid-template-columns: 92px 1fr 52px; }
}
.filter-bar { display: flex; gap: 8px; align-items: center; margin-bottom: 16px; flex-wrap: wrap; }
.seg { display: inline-flex; background: #E9EFF1; border-radius: 10px; padding: 3px; gap: 2px; }
.seg button { border: 0; background: transparent; padding: 7px 16px; border-radius: 8px; cursor: pointer; font-size: 13px; color: var(--ink-2); }
.seg button.on { background: #fff; color: var(--primary); font-weight: 700; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
.search-input { border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; width: 220px; font-size: 13px; outline: none; }
.case-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(216px, 1fr)); gap: 14px; }
.case-card { background: #fff; border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); cursor: pointer; transition: transform .15s, box-shadow .15s; }
.case-card:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(23,43,60,.12); }
.case-thumb { width: 100%; aspect-ratio: 16 / 10; background: #0B1B30 center/cover no-repeat; position: relative; }
.case-thumb.thumb-ausc { background: linear-gradient(160deg, #13324B 0%, #0B1B30 100%); display: flex; align-items: center; justify-content: center; }
.case-thumb.thumb-ausc svg { width: 46%; height: 46%; color: #9CCBE2; opacity: .95; }
.case-card.noimg .case-thumb { display: flex; align-items: center; justify-content: center; color: #7EA3A8; font-size: 26px; }
.case-meta { padding: 10px 12px 12px; }
.case-title { font-size: 13.5px; font-weight: 600; line-height: 1.45; min-height: 39px; padding: 0 12px; overflow-wrap: anywhere; }
/* 2026-10-13：口述选题卡内容居中 + 副标题胶囊（用户反馈） */
.oral-page .case-card.ausc-card .case-thumb { background-size: contain; background-position: center center; background-color: #ffffff; }
.oral-page .case-title { text-align: center; margin-top: 14px; }
.oral-page .case-meta { text-align: center; padding: 2px 12px 14px; }
.meta-pill { display: inline-block; border-radius: 999px; padding: 3px 12px; font-size: 12px; line-height: 1.6; margin: 0 3px; }
.meta-pill.diff { background: #EAF2FE; color: #3a6ad9; }
.meta-pill.mode { background: #E6F5F6; color: #1d7f86; }
.meta-pill.lv1 { background: #E7F6EF; color: #1d8a5f; }
.meta-pill.lv2 { background: #FFF3E0; color: #B07818; }
.meta-pill.lv3 { background: #FDEAEA; color: #c0392b; }
.oral-head-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
.oral-head-row #btnOralRandom { align-self: center; }
.oral-head-txt { flex: 1; min-width: 0; }
.case-line { margin-top: 7px; display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }

/* ---------- 判读页 ---------- */
.quiz-layout { display: flex; gap: 18px; height: calc(100vh - 122px); }
.quiz-stage { flex: 1.2; background: #0B1B30; border-radius: var(--radius); overflow: hidden; position: relative; display: flex; flex-direction: column; min-width: 0; }
.stage-head { min-height: 46px; height: 46px; flex-shrink: 0; display: flex; align-items: center; gap: 8px; padding: 0 14px; background: linear-gradient(180deg, #16283F 0%, #0D1C31 100%); border-bottom: 1px solid rgba(255,255,255,.08); color: #C9D7E8; }
.stage-head .small { min-width: 0; flex-shrink: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; opacity: .85; }
.stage-head .tag, .stage-head .quiz-timer, .stage-head .stage-zoom { flex-shrink: 0; }
.stage-head .sp { flex: 1; }
.stage-zoom { background: rgba(255,255,255,.1); border: 0; color: #E6EEF8; border-radius: 8px; padding: 5px 12px; cursor: pointer; font-size: 12px; transition: background .15s; }
.stage-zoom:hover { background: rgba(255,255,255,.22); }
.stage-zoom:disabled { opacity: .35; cursor: not-allowed; }
.stage-zoom:disabled:hover { background: rgba(255,255,255,.1); }
.stage-zoom.on { background: var(--primary-2); }
#btnExitQuiz { background: rgba(244,81,30,.85); color: #fff; }
#btnExitQuiz:hover { background: var(--primary); }
.img-scroll { flex: 1; overflow: auto; display: flex; align-items: flex-start; padding: 14px; }
/* 听诊播放区：听诊器图标 + 引导语 + 播放器（纵向居中排列） */
.ausc-scroll { flex-direction: column; align-items: center; justify-content: center; gap: 10px; }
.ausc-scroll > svg { width: 54px; height: 54px; color: #9CCBE2; flex-shrink: 0; }
.ausc-scroll .ausc-tip { color: #7FA3BC; font-size: 12.5px; letter-spacing: 1px; }
.ausc-scroll audio { width: min(540px, 92%); }
/* 听诊部位示意图（P1-10）：心脏瓣膜听诊区 / 肺部听诊区，标注本次录音采集部位 */
.ausc-scroll img.ausc-area {
  display: block; max-width: 92%; border-radius: 8px; background: #fff;
  box-shadow: 0 2px 10px rgba(15,33,64,.10); transition: width .16s ease-out, height .16s ease-out;
  user-select: none; -webkit-user-select: none; -webkit-user-drag: none;
}
.ausc-scroll .ausc-area-cap { color: #6C8AA3; font-size: 12px; letter-spacing: .3px; margin-top: -2px; }
.img-box { position: relative; display: inline-block; line-height: 0; margin: auto; }
.img-box img { border-radius: 4px; display: block; transition: width .16s ease-out, height .16s ease-out; user-select: none; -webkit-user-select: none; -webkit-user-drag: none; }
.mark-dot {
  position: absolute; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%;
  border: 2px solid #FFD84D; background: rgba(255,216,77,.25); cursor: pointer; z-index: 5;
}
.mark-dot::after { content: attr(data-i); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #FFD84D; font-size: 11px; font-weight: 700; }
.mark-dot.std { border-color: #6EDB8A; background: rgba(110,219,138,.3); pointer-events: none; }
.mark-dot.std::after { color: #6EDB8A; }
.stage-tip { position: absolute; left: 12px; bottom: 10px; z-index: 6; color: #BFE0E3; font-size: 12px; background: rgba(0,0,0,.45); padding: 5px 10px; border-radius: 8px; }

.quiz-panel { width: 420px; flex-shrink: 0; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); overflow-y: auto; padding: 18px; }
.q-hint { background: #F5F9FA; border-radius: 10px; padding: 12px 14px; font-size: 13px; line-height: 1.7; color: var(--ink-2); margin-bottom: 14px; }
/* 素材来源 attribution（公开数据集合规展示）：浅灰框卡片，与上方临床信息卡同宽对齐 */
.q-source { background: #F3F4F6; border-radius: 10px; padding: 10px 14px; font-size: 12px; color: #667385; line-height: 1.6; margin: 0 0 12px; }
.q-source .muted { color: #99a3b1; margin-left: 4px; }
.q-mod { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; flex-wrap: wrap; }
.q-title { font-size: 17px; font-weight: 800; margin-bottom: 12px; line-height: 1.5; }
.opt { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 10px; margin-bottom: 10px; cursor: pointer; transition: all .15s; }
.opt:hover { border-color: #BCD6D9; }
.opt .k { width: 24px; height: 24px; border-radius: 50%; background: #F5F3EF; color: var(--ink-2); display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex-shrink: 0; }
.opt.sel { border-color: var(--primary); background: #FFF6EF; }
.opt.sel .k { background: var(--primary); color: #fff; }
.opt.rev-right { border-color: var(--ok); background: #F1FAF4; }
.opt.rev-wrong { border-color: var(--danger); background: #FEF1ED; }
.opt .rev-mark { margin-left: auto; font-size: 12px; }
.audio-row { display: flex; gap: 10px; align-items: center; margin-bottom: 14px; }
.audio-row audio { flex: 1; height: 40px; }
.submit-bar { display: flex; gap: 10px; margin-top: 14px; }
.step-block { border: 1px dashed #BCD6D9; border-radius: 10px; padding: 12px; margin-bottom: 12px; background: #FBFDFD; }
.step-name { font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.step-guide { color: var(--ink-3); font-size: 12px; margin-bottom: 8px; line-height: 1.6; }
.step-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { border: 1px solid var(--line); border-radius: 16px; padding: 5px 14px; cursor: pointer; font-size: 12.5px; background: #fff; }
.chip.on { background: var(--primary); color: #fff; border-color: var(--primary); }
.chip.rev-ok { background: #E6F6EC; border-color: var(--ok); color: var(--ok); }
.chip.rev-no { background: #FDEBE7; border-color: var(--danger); color: var(--danger); }

/* 结果卡 */
.result-card { border-radius: 12px; padding: 14px 16px; margin-top: 14px; font-size: 13px; }
.result-ok { background: #F1FAF4; border: 1px solid #C6E8D3; color: #1F6B3A; }
.result-bad { background: #FEF1ED; border: 1px solid #F5CFC4; color: #9A3A22; }
.score-row { display: flex; gap: 8px; flex-wrap: wrap; margin: 10px 0; }
.score-pill { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 6px 12px; font-size: 13px; }
.score-pill b { color: var(--primary); }
.explain-block { margin-top: 12px; border-left: 3px solid #F0DEC8; padding: 4px 0 4px 14px; }
.explain-block h4 { font-size: 13px; margin: 10px 0 4px; color: var(--primary); }
.explain-block p { font-size: 13px; line-height: 1.8; color: var(--ink-2); }
.ai-card { margin-top: 14px; background: #101F28; color: #DDEAEC; border-radius: 12px; padding: 14px 16px; font-size: 13px; line-height: 1.8; white-space: pre-wrap; }
.ai-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.ai-badge { background: rgba(255,255,255,.12); padding: 3px 10px; border-radius: 12px; font-size: 11px; color: #9FD8DD; }

/* 错题/我的 */
.mistake-row { display: flex; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.mistake-row:last-child { border-bottom: 0; }
/* 错题维度分组（与小程序错题本同口径：diag/loc/step） */
.mistake-dim { display: flex; align-items: center; gap: 8px; margin: 14px 0 2px; padding-top: 12px; border-top: 1px dashed var(--line); font-weight: 600; font-size: 13px; }
.mistake-dim-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.mistake-dim-label { margin-right: 4px; }
.mistake-thumb { width: 76px; height: 52px; border-radius: 8px; background: #0B1B30 center/cover no-repeat; flex-shrink: 0; }
.mistake-main { flex: 1; min-width: 0; }
.mistake-title { font-weight: 600; font-size: 14px; }
.mistake-sub { color: var(--ink-3); font-size: 12px; margin-top: 3px; }
.mistake-act { display: flex; gap: 8px; align-items: center; }
.menu-list { }
.menu-item { display: flex; align-items: center; justify-content: space-between; padding: 15px 4px; border-bottom: 1px solid var(--line); cursor: pointer; }
.menu-item:hover { color: var(--primary); }
.menu-item:last-child { border-bottom: 0; }
.menu-main b { display: block; font-size: 14px; }
.menu-main span { color: var(--ink-3); font-size: 12px; }
.menu-arrow { color: var(--ink-3); font-size: 18px; }

/* 表格输入 */
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.field input, .field textarea, .field select {
  width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 13px; outline: none; font-family: inherit;
}
.field textarea { min-height: 90px; resize: vertical; line-height: 1.7; }
.field input:focus, .field textarea:focus { border-color: var(--primary); }
.hint-note { font-size: 12px; color: var(--ink-3); line-height: 1.7; margin-top: 4px; }

/* sim */
/* 三十三轮二改（用户口径：整页一个滚动条或没有）：
   取消面板内部滚动 —— 试卷随页面自然滚动，全页只有窗口一条滚动条；
   计时条吸顶常显（考试中随时可见倒计时） */
#simQuiz { height: auto !important; overflow: visible; }
#simQuiz .quiz-layout { height: auto; }
#simQuiz .quiz-stage { overflow: visible; }
#simQuiz .img-scroll { overflow: visible; flex: none; }
#simQuiz .quiz-panel { overflow-y: visible; }
#simQuiz .sim-top { position: sticky; top: 0; z-index: 6; background: #fff; margin-bottom: 16px; padding: 10px 0; border-bottom: 1px solid #EDF0F4; }
.sim-top { display: flex; align-items: center; gap: 14px; margin-bottom: 16px; flex-wrap: wrap; }
.sim-timer { font-size: 20px; font-weight: 800; color: var(--danger); font-variant-numeric: tabular-nums; min-width: 68px; text-align: center; }
.sim-progress { flex: 1; min-width: 140px; }
.progress-track { height: 8px; background: #E9EFF1; border-radius: 4px; overflow: hidden; }
.progress-fill { height: 100%; background: linear-gradient(90deg, var(--primary), var(--primary-2)); border-radius: 4px; transition: width .3s; }
/* 机考分段进度：每题一格，答完点亮（珊瑚橙=用户操作） */
.sim-progress { flex: 1; min-width: 220px; display: flex; align-items: center; gap: 12px; justify-content: center; }
.sim-segs { display: flex; gap: 6px; }
.sim-segs .seg {
  width: 34px; height: 10px; border-radius: 5px; background: #E9EFF1;
  box-shadow: inset 0 0 0 1px rgba(15, 33, 64, .06);
  transition: background .25s, transform .25s;
}
.sim-segs .seg.on { background: linear-gradient(90deg, #F4511E, #FF8C3A); box-shadow: none; transform: scaleY(1.15); }
.sim-prog-txt { font-size: 13px; font-weight: 700; color: #35506b; white-space: nowrap; font-variant-numeric: tabular-nums; min-width: 74px; }
.mode-switch { display: flex; gap: 8px; margin-bottom: 16px; }
.flow-actions { display: flex; gap: 10px; margin-top: 16px; }

/* ---------- 补充：判读 / 个人 / 表单 / 邀请 ---------- */
.ta, textarea.ta {
  width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px;
  font-size: 13px; outline: none; font-family: inherit; resize: vertical; line-height: 1.7; background: #fff;
}
.ta:focus { border-color: var(--primary); }

.menu-row {
  display: flex; align-items: center; justify-content: space-between; padding: 13px 4px;
  border-bottom: 1px solid var(--line); color: var(--ink);
}
.menu-row:hover { color: var(--primary); }
.menu-row:last-child { border-bottom: 0; }
.menu-title { font-weight: 600; font-size: 14px; }

.user-card { display: flex; gap: 16px; align-items: center; }
.avatar {
  width: 56px; height: 56px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--primary-2));
  color: #fff; font-size: 24px; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.user-body { flex: 1; min-width: 0; }
.user-name { font-size: 17px; font-weight: 800; }
.user-edit { display: flex; gap: 8px; align-items: center; margin-top: 8px; flex-wrap: wrap; }
.user-edit .search-input { width: 200px; }

.form-row { margin: 12px 0; }
.form-row label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.form-row input, .form-row select {
  width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 10px 12px; font-size: 13px; outline: none; background: #fff;
}
.card-in { background: #FDFCFA; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; margin: 12px 0; }

.invite-hero { text-align: center; padding: 18px; background: #FFF1E6; border-radius: 12px; }
.invite-code {
  font-size: 34px; font-weight: 900; letter-spacing: 10px; color: var(--primary); margin: 10px 0 14px;
}
@media (max-width: 760px) {
  .sidebar { width: 64px; }
  .brand-name, .brand-tag, .nav-item, .sidebar-foot { display: none; }
  .nav-item.active { display: block; font-size: 11px; padding: 6px 4px; text-align: center; }
  .nav-admin { display: block; font-size: 10px; padding: 6px 4px; text-align: center; }
  .view { padding: 12px; }
  .case-grid { grid-template-columns: 1fr; }
}

/* ================= 登录面板（手机号 / 注册 / 微信扫码） ================= */
.login-card { width: 460px; padding: 36px 40px 30px; }
.login-tabs {
  display: flex; gap: 4px; margin: 24px 0 18px; background: #F5F3EF; border-radius: 12px; padding: 4px;
}
.login-tab {
  flex: 1; border: 0; background: transparent; padding: 9px 0; border-radius: 9px;
  font-size: 14px; font-weight: 600; color: var(--ink-2); cursor: pointer; transition: all .15s;
}
.login-tab.active { background: #fff; color: var(--primary); box-shadow: 0 2px 8px rgba(23,43,60,.08); }

.auth-pane { text-align: left; }
.auth-input {
  width: 100%; border: 1px solid var(--line); border-radius: 10px; padding: 11px 13px;
  font-size: 14px; outline: none; margin-bottom: 10px; font-family: inherit; background: #fff;
}
.auth-input:focus { border-color: var(--primary); }
.auth-row { display: flex; gap: 10px; align-items: stretch; }
.auth-row .auth-input { flex: 1; margin-bottom: 10px; }
.auth-send { flex-shrink: 0; white-space: nowrap; margin-bottom: 10px; }
.auth-submit { margin-top: 2px; padding: 12px 0; font-size: 15px; }
.auth-tip { margin-top: 12px; font-size: 12px; color: var(--ink-3); text-align: center; line-height: 1.7; }
.auth-subtitle { font-size: 14px; font-weight: 700; margin-bottom: 12px; }

/* 微信模拟二维码 */
.wx-qr-area { text-align: center; }
.wx-qr-mock {
  width: 200px; height: 200px; margin: 4px auto 16px; background: #fff; border-radius: 10px;
  padding: 12px; box-shadow: 0 4px 18px rgba(23,43,60,.10);
}
.wx-qr-grid {
  display: grid; grid-template-columns: repeat(21, 1fr); grid-template-rows: repeat(21, 1fr);
  width: 176px; height: 176px; margin: 0 auto; gap: 0;
}
.qr-cell { background: #fff; }
.qr-cell.on { background: #111; }
.wx-qr-brand { font-size: 13px; font-weight: 700; color: var(--ink); margin-top: 8px; }
.wx-qr-dev { font-size: 11px; color: var(--warn); margin-top: 4px; }

/* ===== PC 端三处改造新增样式（hero / 登录方式 / 训练选择 / 账号安全） ===== */
/* 登录：方式切换 seg */
.method-seg { display: flex; background: #F5F1EA; border-radius: 12px; padding: 3px; margin-bottom: 16px; }
.method-seg button { flex: 1; border: 0; background: transparent; padding: 9px 0; border-radius: 10px; font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; }
.method-seg button.on { background: #fff; color: var(--primary); box-shadow: 0 2px 8px rgba(23,43,60,.08); }
.auth-pane .auth-tip { color: var(--ink-3); font-size: 12px; margin-top: 10px; line-height: 1.7; }

/* 首页 hero */
.hero-banner {
  background: linear-gradient(120deg, #FF8C3A 0%, #F4511E 100%);
  border-radius: 18px; color: #fff; padding: 26px 30px; margin-bottom: 18px;
  box-shadow: var(--shadow); display: flex; align-items: center;
}
.hero-main { max-width: 560px; }
.hero-kicker { font-size: 12px; opacity: .85; letter-spacing: 1px; }
.hero-title { font-size: 30px; font-weight: 800; margin: 8px 0 6px; }
.hero-sub { font-size: 14px; opacity: .92; line-height: 1.7; }
.hero-actions { margin-top: 16px; display: flex; gap: 12px; }
.hero-cta { padding: 12px 30px; font-size: 15px; white-space: nowrap; flex-shrink: 0; }
/* 橙渐变底上的按钮体系：主按钮白底珊瑚字，次按钮白描边幽灵，与背景拉开层次 */
.hero-banner .btn-primary {
  background: #fff; color: var(--primary);
  box-shadow: 0 4px 12px rgba(120, 30, 0, .18);
}
.hero-banner .btn-primary:hover { background: #FFF3EA; }
.hero-banner .btn-ghost {
  background: rgba(255,255,255,.12); color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.55);
}
.hero-banner .btn-ghost:hover { background: rgba(255,255,255,.24); box-shadow: inset 0 0 0 1px rgba(255,255,255,.75); }

/* 训练选择页 */
.btn-lg { padding: 14px 40px; font-size: 15px; border-radius: 12px; }
.train-hero {
  background: linear-gradient(120deg, #0B2A58 0%, #071A33 100%); border-radius: 18px; color: #fff;
  padding: 24px 28px; display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px;
}
.train-hero-title { font-size: 24px; font-weight: 800; }
.train-hero-sub { color: #B8D5D9; font-size: 13px; margin-top: 8px; line-height: 1.7; }
.train-hero-sim { white-space: nowrap; }
/* 2026-09-20 判读题库选区背景面板：与页面底色区分 */
.train-panel {
  background: #ffffff;
  border: 1px solid rgba(244, 81, 30, .07);
  border-radius: 18px; padding: 20px 22px 22px; margin-bottom: 14px;
}
.train-panel .train-block:first-child { margin-top: 0; }
.train-block { margin: 18px 0 8px; }
.train-block-title { font-weight: 800; font-size: 15px; margin-bottom: 12px; }
.train-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.train-card {
  background: #fff; border: 2px solid transparent; border-radius: 16px; box-shadow: var(--shadow);
  padding: 18px 16px; text-align: left; cursor: pointer; font-family: inherit; color: var(--ink); transition: all .15s;
}
.train-card:hover { border-color: #BEE3E4; }
.train-card.sel { border-color: var(--primary); background: #FFF6EF; }
.train-card-head { display: flex; align-items: center; gap: 10px; }
.train-badge { width: 34px; height: 34px; border-radius: 10px; background: #FFF1E6; color: var(--primary); font-weight: 800; display: flex; align-items: center; justify-content: center; }
.train-card.sel .train-badge { background: var(--primary); color: #fff; }
.train-card-name { font-size: 15px; font-weight: 700; }
.train-card-desc { color: var(--ink-3); font-size: 12px; margin: 10px 0 8px; line-height: 1.6; min-height: 34px; }
.train-card-count { color: var(--primary); font-size: 12px; font-weight: 600; }
.train-start-row { display: flex; align-items: center; gap: 18px; margin: 22px 0 18px; }
.train-tip { color: var(--ink-2); font-size: 13px; line-height: 1.8; }

/* 账号安全（我的页） */
.sec-row { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px dashed var(--line); }
.sec-row:last-child { border-bottom: 0; }
.sec-name { font-size: 14px; font-weight: 600; }
.sec-desc { color: var(--ink-3); font-size: 12px; margin-top: 3px; }
.pwd-panel { background: #FAF8F5; border-radius: 12px; padding: 14px; margin-top: 10px; }
.pwd-panel .auth-row { margin: 8px 0; }
.pwd-panel .auth-input { display: block; width: 100%; margin: 8px 0; }

/* AI考官口述模拟（oral 视图） */
/* 2026-10-13：内容区背景与 AI 病人（vsp）页一致——去掉外扩，同用 .view 标准宽度；
   选题卡最小列宽 250 保留（标题不再局促，case-title 带 0 12px 内边距与 case-meta 对齐） */
.oral-page { max-width: none; margin: 0; }
.oral-page .case-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 16px; }
.oral-top { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 2px 0 14px; }
/* 2026-10-13：选题页头部移入卡内，与卡片融合（用户反馈布局不美观） */
.oral-top-in { margin: 0 0 14px; padding-bottom: 12px; border-bottom: 1px dashed var(--line); }
.stage-tag-oral { background: var(--primary); color: #fff; padding: 5px 12px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.oral-mode { font-size: 12px; padding: 3px 10px; border-radius: 999px; background: #FFF1E6; color: var(--primary); font-weight: 600; }
.oral-exam { position: relative; overflow: hidden; padding: 0; }
.oral-exam-row { display: flex; gap: 12px; padding: 16px; background: linear-gradient(135deg, #0E2A33, #17434F); }
.oral-avatar { flex: 0 0 44px; height: 44px; border-radius: 50%; background: #2AA9B0; display: flex; align-items: center; justify-content: center; color: #fff; font-weight: 800; font-size: 13px; }
.oral-name { color: #7FD1D4; font-size: 12px; margin-bottom: 6px; font-weight: 600; }
.oral-prompt { color: #EAF6F6; font-size: 14px; line-height: 1.8; }
.oral-clinical { display: flex; gap: 8px; background: #FFF8E6; border-top: 1px solid #F0E4C0; padding: 10px 16px; font-size: 13px; align-items: baseline; }
.oral-clinical-label { flex: 0 0 auto; color: #B08B2C; font-weight: 700; }
.oral-clinical-text { color: #5A5240; line-height: 1.7; }
.oral-timer { display: flex; align-items: center; gap: 16px; padding: 14px 18px; margin-top: 12px; }
.oral-timer-left { display: flex; flex-direction: column; align-items: center; min-width: 74px; }
.oral-timer-num { font-size: 26px; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--ink); }
.oral-timer-num.ticking { color: var(--danger); }
.oral-timer-unit { font-size: 11px; color: var(--ink-3); margin-top: 2px; }
.oral-timer-track { flex: 1; height: 8px; border-radius: 99px; background: #E6EFEF; overflow: hidden; }
.oral-timer-fill { height: 100%; background: linear-gradient(90deg, #2AA9B0, #FF9F43); transition: width 1s linear; }
.oral-img-card { padding: 0; margin-top: 12px; overflow: hidden; display: flex; justify-content: center; background: #08131A; }
.oral-img { max-width: 100%; max-height: 420px; display: block; margin: 0 auto; }
.oral-img.strip { max-height: 300px; }
.oral-img-ph { display: flex; align-items: center; justify-content: center; color: #5F8290; font-size: 13px; min-height: 120px; padding: 24px; text-align: center; background: #08131A; }
.oral-ops { margin-top: 12px; }
.oral-ready-title { font-size: 16px; font-weight: 800; }
.oral-ready-tip { font-size: 13px; color: var(--ink-2); margin-top: 8px; line-height: 1.8; }
.text-tip { background: #FFF6EF; border: 1px solid #D8EEEF; border-radius: 10px; padding: 10px 12px; }
.oral-speaking-head { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.oral-speaking-title { font-size: 15px; font-weight: 800; }
.oral-speaking-status { font-size: 11px; color: #fff; background: var(--primary); border-radius: 999px; padding: 2px 8px; }
.oral-textarea { width: 100%; min-height: 150px; border: 1px solid var(--line); border-radius: 12px; padding: 12px; font: inherit; font-size: 14px; line-height: 1.8; resize: vertical; box-sizing: border-box; }
.oral-textarea:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(42, 169, 176, .12); }
.oral-score { display: flex; flex-direction: column; margin-top: 12px; border-left: 6px solid; }
.oral-score.good { border-color: var(--ok); }
.oral-score.ok { border-color: var(--primary); }
.oral-score.mid { border-color: #FFB020; }
.oral-score.low { border-color: var(--danger); }
.oral-score-top { display: flex; align-items: center; gap: 18px; }
.oral-score-num { font-size: 56px; font-weight: 900; color: var(--primary); line-height: 1; }
.oral-score.good .oral-score-num { color: var(--ok); }
.oral-score.ok .oral-score-num { color: var(--primary); }
.oral-score.mid .oral-score-num { color: #FFB020; }
.oral-score.low .oral-score-num { color: var(--danger); }
.oral-score-label { font-size: 15px; font-weight: 800; }
.oral-score-sub { font-size: 12px; color: var(--ink-3); margin-top: 4px; }
.oral-comment-block { margin-top: 14px; background: #FAF8F5; border-radius: 12px; padding: 12px 14px; }
.oral-comment-lead { font-size: 12px; color: var(--ink-3); margin-bottom: 4px; font-weight: 600; }
.oral-comment-text { font-size: 14px; line-height: 1.8; color: var(--ink); }
.oral-review { margin-top: 12px; padding: 0; }
.oral-review-title { font-size: 15px; font-weight: 800; padding: 14px 18px; border-bottom: 1px dashed var(--line); }
.oral-rp-item { display: flex; gap: 12px; padding: 12px 18px; border-bottom: 1px dashed var(--line); }
.oral-rp-item:last-child { border-bottom: 0; }
.oral-rp-item.hit { background: #F4FBF8; }
.oral-rp-item.miss { background: #FFFBF4; }
.oral-badge { flex: 0 0 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 13px; margin-top: 2px; }
.oral-badge.ok { background: #DFF3EC; color: var(--ok); }
.oral-badge.no { background: #FFE7D6; color: var(--danger); }
.oral-rp-main { flex: 1; min-width: 0; }
.oral-rp-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.oral-rp-label { font-size: 14px; font-weight: 700; }
.oral-rp-type { font-size: 11px; color: var(--ink-3); background: #EFF4F4; border-radius: 6px; padding: 1px 6px; }
.oral-rp-line { font-size: 13px; line-height: 1.7; display: flex; flex-wrap: wrap; gap: 6px; }
.oral-hit-text { color: var(--ok); font-weight: 600; }
.oral-pts { color: var(--ink-3); font-size: 12px; font-weight: 600; }
.oral-suggest-line { display: block; }
.oral-suggest-label { display: inline-block; font-size: 11px; color: #B08B2C; background: #FCF1DA; border-radius: 6px; padding: 1px 7px; margin-right: 6px; font-weight: 600; }
.oral-suggest-text { color: #5A5240; }
.oral-suggest-card { margin-top: 12px; background: #FFF8E6; border: 1px solid #F0E4C0; }
.oral-suggest-title { font-size: 14px; font-weight: 800; color: #8A6B1F; margin-bottom: 8px; }
.oral-suggest-body { font-size: 13px; line-height: 1.9; color: #5A5240; }
.oral-mine-card { margin-top: 12px; background: #FAF8F5; }
.oral-mine-title { font-size: 12px; font-weight: 700; color: var(--ink-3); margin-bottom: 8px; }
.oral-mine-text { font-size: 13px; line-height: 1.8; color: var(--ink); white-space: pre-wrap; background: #fff; border: 1px dashed var(--line); border-radius: 10px; padding: 10px 12px; }
.oral-entry-flow { margin-top: 14px; flex-wrap: wrap; }
.oral-entry-btn { width: 100%; border-style: dashed !important; }
.oral-msg { flex: 1; min-width: 0; }
.oral-score-info { flex: 1; }

/* 收藏本例（路线图⑤）：训练页「收藏病例」专项入口 */
.fav-row { margin-top: 14px; display: flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 16px; border-radius: 12px; background: rgba(245,166,35,.08);
  border: 1px dashed rgba(245,166,35,.55); color: #b39255; font-size: 13px; user-select: none; }
.fav-row .fav-star { font-size: 17px; color: #c9b28a; }
.fav-row.faved { background: rgba(245,166,35,.16); border-style: solid; color: #d99a1e; font-weight: 600; }
.fav-row.faved .fav-star { color: #F5A623; }

/* 多轮追问（路线图⑥） */
.ai-follow-row { margin-top: 10px; display: flex; gap: 8px; align-items: center; }
.ai-follow-row .input { flex: 1; height: 36px; }

/* 备考倒计时 + 打卡（路线图⑦） */
.exam-card { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.exam-left { font-size: 14px; display: flex; align-items: center; }
.exam-right { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.exam-streak { font-size: 13px; color: var(--muted, #7FA3BC); }
.exam-streak.on { color: #E85D3F; font-weight: 700; }

/* ---------- AI 举一反三变式题（quiz 结果卡，深色 AI 卡内配色） ---------- */
.vari-item { padding: 9px 14px; margin-top: 8px; border: 1px solid rgba(159,216,221,.28); border-radius: 10px; cursor: pointer; background: rgba(255,255,255,.055); }
.vari-item:hover { background: rgba(255,255,255,.10); }
.vari-q { font-size: 14px; line-height: 1.6; color: #EAF4F6; }
.vari-q b { color: #9FD8DD; margin-right: 4px; }
.vari-a { color: #BFE6EE; font-size: 13px; line-height: 1.6; }
#variBody .small.muted { color: #7FA3BC; }

/* ---------- 合规：三件套同意行 + 文本阅读器（legal.js） ---------- */
.btn-sm { padding: 7px 12px; font-size: 12.5px; border-radius: 10px; }

.agree-row {
  margin-top: 20px; padding: 10px 12px; border: 1px solid var(--line);
  border-radius: 10px; background: #FFFDFB; text-align: left;
}
.agree-row.shake { animation: agreeShake .5s ease; border-color: var(--danger); background: #FFF6F6; }
@keyframes agreeShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-5px); } 40% { transform: translateX(5px); }
  60% { transform: translateX(-3px); } 80% { transform: translateX(3px); }
}
.agree-label { display: flex; align-items: flex-start; gap: 8px; font-size: 12.5px; color: var(--ink-2); line-height: 1.7; cursor: pointer; }
.agree-label input[type="checkbox"] { margin-top: 2px; accent-color: var(--primary); width: 15px; height: 15px; flex: 0 0 15px; }
.agree-tip { margin-top: 8px; font-size: 12px; color: var(--ink-3); text-align: center; }
.legal-link { color: var(--primary); text-decoration: none; }
.legal-link:hover { text-decoration: underline; }
.foot-legal { margin-bottom: 6px; font-size: 11.5px; }
.sidebar .foot-legal .legal-link { color: rgba(255, 255, 255, .82); }

body.no-scroll { overflow: hidden; }

.legal-overlay { background: rgba(23, 33, 43, .55); backdrop-filter: blur(2px); }
.legal-panel {
  width: min(860px, 92vw); max-height: 86vh; background: #fff; border-radius: 18px;
  box-shadow: 0 24px 60px rgba(15, 30, 45, .28); display: flex; flex-direction: column; overflow: hidden;
}
.legal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px 12px; border-bottom: 1px solid var(--line);
}
.legal-title { font-size: 18px; font-weight: 800; color: var(--ink); }
.legal-close {
  border: none; background: transparent; font-size: 16px; color: var(--ink-3);
  cursor: pointer; width: 30px; height: 30px; border-radius: 8px; line-height: 1;
}
.legal-close:hover { background: #F4F1ED; color: var(--ink); }
.legal-tabs { display: flex; gap: 6px; padding: 12px 22px 0; flex-wrap: wrap; }
.legal-tab {
  border: 1px solid var(--line); background: #fff; color: var(--ink-2);
  padding: 6px 13px; border-radius: 20px; font-size: 12.5px; cursor: pointer;
}
.legal-tab:hover { border-color: var(--primary); color: var(--primary); }
.legal-tab.on { background: var(--primary); border-color: var(--primary); color: #fff; font-weight: 600; }
.legal-body { padding: 16px 22px 22px; overflow-y: auto; line-height: 1.85; color: var(--ink); }
.legal-intro {
  font-size: 13.5px; color: var(--ink-2); background: #FBF7F2;
  border-left: 3px solid var(--primary); border-radius: 8px; padding: 11px 14px; margin-bottom: 6px;
}
.legal-sec { margin-top: 16px; }
.legal-sec h4 { font-size: 14.5px; margin-bottom: 6px; color: var(--ink); }
.legal-sec p { font-size: 13.5px; color: #374151; margin-top: 5px; text-align: justify; }
.legal-table { width: 100%; border-collapse: collapse; margin: 12px 0 4px; font-size: 12.5px; }
.legal-table th, .legal-table td { border: 1px solid var(--line); padding: 8px 10px; text-align: left; vertical-align: top; }
.legal-table th { background: #FBF7F2; color: var(--ink-2); font-weight: 600; white-space: nowrap; }
.legal-updated { margin-top: 18px; font-size: 12px; color: var(--ink-3); }
.legal-foot {
  padding: 11px 22px; border-top: 1px solid var(--line);
  font-size: 11.5px; color: var(--ink-3); background: #FCFBF9;
}
@media (max-width: 620px) {
  .legal-panel { width: 96vw; max-height: 90vh; }
  .legal-body { padding: 14px 16px 18px; }
  .legal-table { font-size: 11.5px; }
  .legal-table th, .legal-table td { padding: 6px 7px; }
}

/* ============ 备考全周期 journey（2026-09-14c v2：白底暖调光晕 + 大数字倒计时，融入玻璃风） ============ */
.jhero {
  position: relative; overflow: hidden;
  background:
    radial-gradient(480px 220px at 97% -20%, rgba(255, 140, 58, .15), transparent 62%),
    radial-gradient(360px 200px at -4% 110%, rgba(244, 81, 30, .07), transparent 60%),
    #FFFFFF;
  border: 1px solid #F3E7DA;
  border-radius: 18px; color: var(--ink); padding: 24px 28px;
  box-shadow: var(--shadow);
}
.jhero-deco {
  position: absolute; right: -46px; top: -64px; width: 200px; height: 200px;
  border-radius: 50%; border: 2px solid rgba(244, 81, 30, .09); pointer-events: none;
}
.jhero-head { display: flex; align-items: center; gap: 16px; position: relative; z-index: 1; }
.jhero-chip {
  flex-shrink: 0; width: 58px; height: 58px; border-radius: 16px;
  background: linear-gradient(135deg, #FFF5ED, #FFE8D8);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary);
  box-shadow: inset 0 0 0 1px rgba(244, 81, 30, .08), 0 6px 14px rgba(244, 81, 30, .08);
}
.jhero-chip svg { width: 30px; height: 30px; display: block; }
.jhero-main { flex: 1; min-width: 0; }
.jhero-kicker { font-size: 12px; color: var(--ink-3); letter-spacing: 2px; }
.jhero-title { font-size: 22px; font-weight: 800; color: var(--ink); margin-top: 2px; }
.jhero-desc { font-size: 13px; color: var(--ink-2); margin-top: 4px; }
.jhero-days { flex-shrink: 0; text-align: right; }
.jhero-days-cap { font-size: 12px; color: var(--ink-3); }
.jhero-days-num {
  font-size: 38px; font-weight: 800; color: var(--primary);
  line-height: 1.15; font-variant-numeric: tabular-nums;
}
.jhero-days-num span { margin-left: 3px; font-size: 14px; font-weight: 700; opacity: .75; }
.jbar { margin-top: 18px; height: 8px; border-radius: 4px; background: #F3EDE3; overflow: hidden; position: relative; z-index: 1; }
.jbar-in { height: 100%; background: linear-gradient(90deg, #FF8C3A, #F4511E); border-radius: 4px; transition: width .4s ease; }
.jbar-in.goal { background: linear-gradient(90deg, var(--primary), var(--primary-2)); }
.card .jbar { background: #F1EDE6; }
.jhero-meta {
  margin-top: 8px; display: flex; justify-content: space-between;
  font-size: 12px; color: var(--ink-3);
}
.jhero-meta b { color: var(--primary); font-weight: 700; }
.jstreak {
  font-size: 12.5px; color: #C2410C; background: #FFF1E6;
  padding: 5px 14px; border-radius: 999px; font-weight: 700;
}
.jgrid {
  display: grid; grid-template-columns: repeat(14, 1fr); gap: 7px;
  margin: 16px 0;
}
/* 打卡 + 今日目标 一排两列（融合布局） */
.jduo {
  display: grid; grid-template-columns: 1.65fr 1fr; gap: 14px;
  margin-top: 14px; align-items: stretch;
}
.jgoal { display: flex; flex-direction: column; justify-content: center; }
.jgoal-num {
  font-size: 42px; font-weight: 800; color: var(--primary);
  line-height: 1.15; margin: 12px 0 10px; font-variant-numeric: tabular-nums;
}
.jgoal-num span { font-size: 15px; font-weight: 700; margin-left: 2px; opacity: .75; }
@media (max-width: 1060px) { .jduo { grid-template-columns: 1fr; } }
.jcell {
  aspect-ratio: 1; border-radius: 7px; background: #F4EFE7;
  box-shadow: inset 0 0 0 1px rgba(23, 43, 60, .03);
  transition: background .15s;
}
.jcell.on {
  background: linear-gradient(135deg, #FF8C3A, #F4511E);
  box-shadow: 0 2px 6px rgba(244, 81, 30, .28);
}
.jtask {
  display: flex; align-items: center; gap: 8px;
  margin-top: 8px; padding: 11px 14px; border-radius: 10px;
  background: #FAF8F5; border: 1px solid var(--line);
  cursor: pointer; font-size: 13.5px; color: var(--ink); transition: all .15s;
}
.jtask:hover { border-color: #F0B27A; background: #FFF6EF; }
.jtask-go { margin-left: auto; color: var(--ink-3); font-weight: 700; }
.jtl { display: flex; align-items: flex-start; padding: 8px 0 16px; position: relative; }
.jtl:last-child { padding-bottom: 0; }
.jtl::before {
  content: ''; position: absolute; left: 6px; top: 24px; bottom: 0;
  width: 2px; background: var(--line);
}
.jtl:last-child::before { display: none; }
.jdot {
  flex-shrink: 0; width: 13px; height: 13px; border-radius: 50%;
  background: #E3DCD2; margin-right: 12px; margin-top: 4px; position: relative; z-index: 1;
}
.jtl.done .jdot { background: var(--ok); }
.jtl.current .jdot { background: var(--primary); box-shadow: 0 0 0 4px rgba(244,81,30,.15); }
.jtl-name { font-weight: 700; font-size: 15px; display: flex; align-items: center; gap: 7px; }
.jtl-ic { display: inline-flex; flex-shrink: 0; color: var(--primary); }
.jtl-ic svg { width: 17px; height: 17px; display: block; }
.jtl.todo .jtl-ic { color: #C9BFB2; }
.jtl.todo .jtl-name { color: var(--ink-2); }
.jtl-cur { color: var(--primary); font-size: 12px; font-weight: 600; }

/* ---------- 病例情境组合判读 combined（2026-09-14b） ---------- */
.cb-set-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 16px 18px; margin-top: 12px; cursor: pointer; transition: all .15s;
}
.cb-set-card:hover { border-color: var(--primary-2); box-shadow: 0 8px 22px rgba(244,81,30,.12); transform: translateY(-1px); }
.cb-set-title { margin: 8px 0 0; font-size: 15px; font-weight: 700; color: var(--ink); }
.cb-set-meta { margin-top: 10px; color: var(--ink-3); font-size: 12px; }
.cb-set-item { margin-top: 6px; font-size: 12.5px; color: var(--ink-2); }
.cb-media { margin-top: 10px; border-radius: 10px; overflow: hidden; background: #0B1B30; padding: 10px; }
.cb-media img { display: block; width: 100%; border-radius: 6px; }
.cb-media audio { width: 100%; display: block; }
.cb-hint {
  margin-top: 10px; font-size: 12.5px; color: var(--ink-2); line-height: 1.7;
  background: #FAF8F5; border-left: 3px solid #F0B27A; border-radius: 8px; padding: 9px 12px;
}
.cb-guide { margin-top: 8px; font-size: 12.5px; color: var(--ai-azure, #1E6FA8); line-height: 1.7; }
.cb-opt-note { margin-top: 6px; font-size: 12px; color: var(--ink-3); }
.cb-review-card {
  background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 16px 18px; margin-top: 12px;
}
.cb-review-title { margin: 8px 0 0; font-size: 14.5px; font-weight: 700; color: var(--ink); }
.cb-review-sec { margin-top: 8px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.cb-review-body { margin: 4px 0 0 18px; font-size: 12.5px; color: var(--ink-2); line-height: 1.7; }

/* ============ 通用页头（sim / combined / vsp 共用，2026-09-14c） ============ */
/* 2026-09-20 标头胶囊背景：与内容区区分（三端同步） */
.pg-head {
  display: flex; align-items: center; gap: 14px;
  background: #ffffff;
  border: 1px solid rgba(244, 81, 30, .07);
  border-radius: 16px; padding: 14px 18px; margin-bottom: 14px;
}
.pg-ico {
  width: 48px; height: 48px; border-radius: 14px; flex-shrink: 0;
  background: linear-gradient(135deg, #FFF5ED, #FFE8D8);
  display: flex; align-items: center; justify-content: center;
  color: var(--primary);
  box-shadow: inset 0 0 0 1px rgba(244, 81, 30, .08), 0 6px 14px rgba(244, 81, 30, .08);
}
.pg-ico svg { width: 24px; height: 24px; display: block; }
.pg-kicker { font-size: 12px; color: var(--ink-3); letter-spacing: 2px; }
.pg-title { font-size: 20px; font-weight: 800; margin-top: 2px; }
.pg-desc {
  font-size: 13px; color: var(--ink-2); line-height: 1.75;
  background: #ffffff; border: 1px solid rgba(244, 81, 30, .07);
  border-radius: 14px; padding: 12px 16px; margin-top: 12px;
}

/* ---------- 机考仿真 sim ---------- */
.sim-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin: 16px 0 14px; }
.sim-stat {
  background: #FAF8F5; border: 1px solid var(--line); border-radius: 12px;
  padding: 13px 8px; text-align: center;
}
.sim-stat b { display: block; font-size: 20px; font-weight: 800; color: var(--primary); font-variant-numeric: tabular-nums; }
.sim-stat span { display: block; font-size: 12px; color: var(--ink-3); margin-top: 3px; }
.sim-top {
  position: sticky; top: 0; z-index: 8;
  background: rgba(255, 255, 255, .94); backdrop-filter: blur(8px);
  border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow);
  padding: 10px 16px; margin-bottom: 14px;
}
.sim-top .sim-timer { font-size: 22px; }
@media (max-width: 860px) { .sim-stats { grid-template-columns: repeat(2, 1fr); } }

/* ---------- 组合判读 combined ---------- */
.cb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 14px; margin-top: 14px; }
.cb-set-card {
  position: relative;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 16px 18px; cursor: pointer; transition: all .16s ease;
  display: flex; flex-direction: column;
}
.cb-set-card:hover { border-color: #F5B58C; box-shadow: 0 10px 24px rgba(244, 81, 30, .10); transform: translateY(-2px); }
.cb-set-go {
  position: absolute; right: 14px; top: 14px;
  width: 26px; height: 26px; border-radius: 50%;
  background: #FFF1E6; color: var(--primary);
  display: flex; align-items: center; justify-content: center;
  font-size: 15px; font-weight: 700; transition: all .16s;
}
.cb-set-card:hover .cb-set-go { background: var(--primary); color: #fff; }
.cb-set-title { margin: 10px 0 0; padding-right: 30px; font-size: 15px; font-weight: 700; color: var(--ink); line-height: 1.5; }
.cb-set-meta {
  margin-top: auto; padding-top: 12px; border-top: 1px dashed var(--line);
  color: var(--ink-3); font-size: 12px; margin-top: 14px; font-weight: 600;
}

/* ---------- AI 病人 vsp ---------- */
.vsp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; margin-top: 4px; }
.vsp-card {
  display: flex; align-items: center; gap: 13px;
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  padding: 15px 17px; cursor: pointer; transition: all .16s ease;
}
.vsp-card:hover { border-color: #F5B58C; box-shadow: 0 10px 24px rgba(244, 81, 30, .10); transform: translateY(-2px); }
.vsp-avatar {
  flex-shrink: 0; width: 44px; height: 44px; border-radius: 13px;
  background: linear-gradient(135deg, #0E2A33, #17434F); color: #7FD1D4;
  display: flex; align-items: center; justify-content: center;
  font-size: 17px; font-weight: 800;
}
.vsp-card-main { flex: 1; min-width: 0; }
.vsp-card-name { font-size: 14.5px; font-weight: 700; color: var(--ink); }
.vsp-card-sub { font-size: 12px; color: var(--ink-3); margin-top: 3px; }
.vsp-chip {
  flex-shrink: 0; font-size: 11.5px; padding: 3px 10px; border-radius: 999px;
  background: #FFF1E6; color: var(--primary); font-weight: 600;
}
.vsp-log {
  max-height: 52vh; overflow-y: auto;
  border: 1px solid var(--line); border-radius: 14px;
  padding: 16px; background: #F8FAFB;
}
.vsp-row { display: flex; margin-bottom: 12px; }
.vsp-row.me { justify-content: flex-end; }
.vb {
  max-width: 78%; padding: 10px 14px; border-radius: 14px;
  line-height: 1.75; white-space: pre-wrap; font-size: 13.5px;
}
.vb.me { background: linear-gradient(135deg, #FF8C3A, #F4511E); color: #fff; border-bottom-right-radius: 4px; box-shadow: 0 3px 10px rgba(244, 81, 30, .18); }
.vb.ai { background: #fff; border: 1px solid var(--line); color: var(--ink); border-bottom-left-radius: 4px; }
.vb-media { max-width: 78%; padding: 10px; border-radius: 14px; background: #0D1B2A; border: 1px solid #22364C; }
.vb-media img { display: block; width: 100%; border-radius: 8px; background: #000; }
.vb-media audio { display: block; width: 100%; }
.vb-media-cap { color: #9FB3C8; font-size: 12px; margin-bottom: 6px; }
/* 病人说话中：气泡样式 + 橙色呼吸灯边框（0%→50%→100% 渐亮渐暗循环） */
.vsp-typing {
  display: inline-block; background: #fff; border: 1px solid var(--line);
  border-radius: 14px; border-bottom-left-radius: 4px; padding: 10px 14px;
  color: #8A9AAE; font-size: 13px; margin-bottom: 10px;
  animation: vspBreath 1.3s ease-in-out infinite;
}
.vb-speaking { animation: vspBreath 1.3s ease-in-out infinite; }
@keyframes vspBreath {
  0%, 100% { border-color: var(--line); box-shadow: 0 0 0 0 rgba(255, 122, 26, 0); }
  50% { border-color: #ff9a3d; box-shadow: 0 0 10px 2px rgba(255, 122, 26, .35); }
}
.vsp-input {
  flex: 1; border: 1px solid var(--line); border-radius: 12px;
  padding: 10px 14px; font-size: 13.5px; outline: none; font-family: inherit; background: #fff;
}
.vsp-input:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(244, 81, 30, .10); }
.vsp-score-hero {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  padding: 26px 16px 22px;
}
.vsp-score-ring {
  width: 118px; height: 118px; border-radius: 50%;
  background:
    radial-gradient(closest-side, #fff 78%, transparent 79% 100%),
    conic-gradient(var(--primary) 0deg, #FFE3D1 0deg);
  display: flex; align-items: center; justify-content: center;
}
.vsp-score-num { font-size: 40px; font-weight: 900; color: var(--ink); line-height: 1; }
.vsp-score-num small { font-size: 15px; font-weight: 700; color: var(--ink-3); }
.vsp-sec-title {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 700;
  margin: 16px 0 0;
}
.vsp-sec-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.vsp-list { margin: 8px 0 0 4px; line-height: 1.85; font-size: 13px; color: var(--ink-2); }

/* ============ 真金判读 gold / 病例分析 analysis（2026-09-14f） ============ */
.gold-grid { display: grid; grid-template-columns: 1.08fr 1fr; gap: 14px; margin-top: 14px; align-items: start; }
@media (max-width: 980px) { .gold-grid { grid-template-columns: 1fr; } }
.gd-case-card, .gd-write-card, .gd-panel, .gd-gold-card {
  background: #fff; border: 1px solid var(--line); border-radius: 14px;
  box-shadow: var(--shadow); padding: 16px 18px; margin-top: 12px;
}
.gd-case-card { margin-top: 14px; }
.gd-case-head { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.gd-img { display: block; width: 100%; max-height: 460px; object-fit: contain; border-radius: 12px; }
.gd-img.is-strip { max-height: 300px; }
/* 真金判读 · 阅片工具（2026-09-22）：右下角悬浮工具（反色/缩放/明暗），与小程序/H5 同款 */
.gd-imgbox { position: relative; }
.gd-viewport { overflow: auto; height: 460px; border-radius: 12px; background: #0D1B2A; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.35) transparent; }
/* 视口高度锁定（2026-09-22）：无论原图多大、放大多少倍，区域高度恒定，影像只在内部滚动 */
.gd-imgbox.is-strip .gd-viewport { height: 300px; }
/* 放大后可拖拽平移：抓手光标（2026-09-22） */
.gd-viewport.gd-can-pan { cursor: grab; }
.gd-viewport.gd-panning { cursor: grabbing; }
.gd-viewport img { user-select: none; -webkit-user-drag: none; }
.gd-imgbox.is-strip .gd-img { max-height: 300px; }
.gd-fab {
  position: absolute; right: 10px; bottom: 10px; z-index: 5;
  display: flex; gap: 6px;
}
.gd-fab-btn {
  border: 1px solid rgba(255, 255, 255, .35); cursor: pointer;
  background: rgba(13, 27, 42, .78); color: #fff;
  padding: 4px 12px; font-size: 12px; font-weight: 600;
  border-radius: 999px; transition: all .15s;
}
.gd-fab-btn:hover { background: rgba(13, 27, 42, .92); }
.gd-fab-btn.on { background: var(--primary); border-color: var(--primary); }
.gd-adj {
  position: absolute; right: 10px; bottom: 44px; z-index: 6;
  width: 240px; padding: 10px 14px;
  background: rgba(13, 27, 42, .92); border-radius: 10px;
  display: flex; flex-direction: column; gap: 8px;
}
.gd-adj label {
  display: flex; align-items: center; gap: 8px;
  color: #fff; font-size: 12px; white-space: nowrap;
}
.gd-adj input[type=range] { flex: 1; accent-color: var(--primary); }
.gd-hint { margin-top: 10px; font-size: 13px; color: var(--ink-2); line-height: 1.75; }
.gd-write-title { font-size: 15px; font-weight: 800; color: var(--ink); }
.gd-label { display: block; margin: 12px 0 6px; font-size: 12.5px; font-weight: 700; color: var(--ink-2); }
.gd-actions { display: flex; align-items: center; gap: 12px; margin-top: 14px; flex-wrap: wrap; }
.gd-ai-head { display: flex; align-items: center; gap: 10px; }
.gd-ai-badge, .gd-gold-badge {
  display: inline-block; padding: 4px 12px; border-radius: 999px;
  font-size: 12.5px; font-weight: 800; letter-spacing: 1px;
  background: linear-gradient(135deg, #FF8C3A, #F4511E); color: #fff;
  box-shadow: 0 4px 10px rgba(244, 81, 30, .22);
}
.gd-gold-badge { background: linear-gradient(135deg, #1C8A6B, #0E6B52); box-shadow: 0 4px 10px rgba(14, 107, 82, .22); }
.gd-score-row { display: flex; gap: 20px; align-items: center; margin-top: 14px; flex-wrap: wrap; }
.gd-score-side { flex: 1; min-width: 260px; }
.gd-hit { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 700; }
.gd-hit.ok { background: #E7F6EE; color: #1C8A6B; }
.gd-hit.no { background: #FDECEC; color: #C6453D; }
.gd-text { margin: 10px 0 0; font-size: 13px; color: var(--ink-2); line-height: 1.8; }
.gd-tip { margin: 8px 0 0; font-size: 12.5px; color: #B7791F; line-height: 1.7; }
.gd-dims { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-top: 16px; }
.gd-dim { background: #FAF8F5; border: 1px solid var(--line); border-radius: 12px; padding: 11px 13px; }
.gd-dim-top { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--ink); }
.gd-dim-top span { color: var(--ink-3); font-variant-numeric: tabular-nums; }
.gd-dim-bar { height: 6px; border-radius: 3px; background: #F1E9E0; margin-top: 7px; overflow: hidden; }
.gd-dim-bar span { display: block; height: 100%; border-radius: 3px; transition: width .5s ease; }
.gd-dim-cmt { margin-top: 7px; font-size: 12px; color: var(--ink-2); line-height: 1.65; }
.gd-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.gd-chip { padding: 4px 12px; border-radius: 999px; font-size: 12px; background: #F1F5F8; color: var(--ink-2); line-height: 1.6; }
.gd-chip.is-warn { background: #FDF2E9; color: #B4600F; }
.gd-gold-card { border-color: #CDE8DE; }
.gd-gold-head { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.gd-guide { margin-top: 10px; font-size: 12.5px; color: var(--ai-azure, #1E6FA8); line-height: 1.7; }
.gd-list { margin: 8px 0 0 4px; padding-left: 18px; font-size: 13px; color: var(--ink-2); line-height: 1.85; }
.gd-key { color: #E5484D; }
.gd-gold-card .gd-text { font-size: 12.8px; }
.gd-gold-foot { margin-top: 14px; padding-top: 10px; border-top: 1px dashed var(--line); font-size: 11.5px; color: var(--ink-3); }

/* ---------- 病例分析 an ---------- */
.an-vig-card { background: #ffffff; }
/* 卡片间距（2026-10-17 用户三次反馈"间距还是这样"，无头实测定位）：
   ① 描述卡(.pg-desc)与摘要卡原本 gap=0 两张白卡贴拢，各自内边距拼成
      ~30px 白色空洞，视觉像一张卡中间开天窗 → 与本页 pg-head→pg-desc 的
      14px 及其他页（gd-case-card mt:14 / sim-stats / vsp mt:12）保持一致，
      补 margin-top:14px；
   ② 摘要卡与作答卡之间原靠 .gd-write-card 的 margin-top:12px，与描边/投影
      贴太近 → 摘要卡直接给 16px 下外边距（相邻 margin 折叠取大值）。 */
.an-vig-card { margin-top: 14px; margin-bottom: 16px; }
.an-vig-head { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; flex-wrap: nowrap; }
.an-vig-head .tag { white-space: nowrap; flex-shrink: 0; }
.an-vig-head .muted { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.an-vig-text { font-size: 13.5px; color: var(--ink); line-height: 1.9; }
.an-vig-label {
  display: flex; align-items: center; margin: 14px 0 2px;
  font-size: 13px; font-weight: 800; color: var(--ink);
}
.an-vig-label::before {
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: #1E6FA8; margin-right: 6px; flex-shrink: 0;
}
.an-four { display: grid; grid-template-columns: 1fr; gap: 0 16px; }
@media (min-width: 1100px) {
  .an-four { grid-template-columns: 1fr 1fr; }
  .an-four > div:nth-child(1) { grid-column: 1 / -1; }
}

/* ============ 动线收敛：侧边栏分组 + 今日任务卡（2026-09-14g） ============ */
.nav-group { margin: 12px 0 4px; padding: 0 14px; font-size: 11px; font-weight: 700; letter-spacing: 2px; color: var(--ink-3, #9AA6B2); }
.nav-group:first-child { margin-top: 2px; }
.exam-tasks { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
@media (max-width: 760px) { .exam-tasks { grid-template-columns: 1fr; } }
.exam-task { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); text-decoration: none; transition: transform .15s ease; }
.exam-task:hover { transform: translateY(-1px); }
.et-chk { flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--line); display: flex; align-items: center; justify-content: center; font-size: 13px; font-weight: 700; color: #fff; background: #fff; }
.exam-task.done .et-chk { background: #2E9E5B; border-color: #2E9E5B; }
.et-tx { display: flex; flex-direction: column; min-width: 0; }
.et-tx b { font-size: 13.5px; color: var(--ink); font-weight: 800; }
.et-tx i { font-style: normal; font-size: 12px; color: var(--ink-3, #9AA6B2); margin-top: 2px; }

/* ============ 训练台数据区 v2（2026-09-15b）：今日任务合一卡 + 双栏数据面板 ============ */
.exam-wrap { padding: 16px 18px 14px; margin-bottom: 14px; }
.exam-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.exam-wrap .exam-tasks { margin-top: 12px; }
.home-duo { display: grid; grid-template-columns: 1fr 1.25fr; gap: 14px; margin-bottom: 20px; align-items: stretch; }
@media (max-width: 980px) { .home-duo { grid-template-columns: 1fr; } }
.home-duo .panel { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px 18px; min-width: 0; }
.panel-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 12px; }
.panel-head b { font-size: 14.5px; color: var(--ink); }
.panel-head span { font-size: 12px; color: var(--ink-3); }
.hstat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.hstat { background: #FAF8F5; border: 1px solid var(--line); border-radius: 12px; padding: 13px 15px; }
.hstat-num { font-size: 24px; font-weight: 800; color: var(--primary); font-variant-numeric: tabular-nums; line-height: 1.15; }
.hstat-label { font-size: 12px; color: var(--ink-3); margin-top: 3px; }
.pool-card .pool-board { margin-bottom: 0; }
.pool-card .pool-empty { margin-bottom: 0; }
.pool-card .pool-foot { margin: 12px 0 0; padding-top: 10px; border-top: 1px dashed var(--line); }
@media (max-width: 980px) { .pool-row { grid-template-columns: 92px 1fr 56px; } }

/* ============ ① 继续复习错题行动卡（2026-09-15c） ============ */
.hstat-link { background: #FDF7F2; border: 1px dashed #EBC6AE; transition: all .15s ease; }
.hstat-link .hstat-num { color: var(--ink-2, #5A6B7A); }
.hstat-link .hstat-label { color: var(--ink-3, #9AA6B2); }
.hstat-link:hover { transform: translateY(-1px); border-style: solid; }
.hstat-link.has-wrong { background: linear-gradient(135deg, #FFF6EF, #FDEFE3); border: 1px solid #F2C49A; }
.hstat-link.has-wrong .hstat-num { color: #E85D3F; }
.hstat-link.has-wrong .hstat-label { color: #C05A24; font-weight: 700; }

/* ============ ② 左侧导航：去滚动条 + 紧凑化 ============ */
.nav { scrollbar-width: none; -ms-overflow-style: none; }
.nav::-webkit-scrollbar { display: none; width: 0; }
.brand { padding: 16px 20px 10px; }
.nav-item { padding: 9px 14px; font-size: 13.5px; }
.nav-group { margin: 9px 0 3px; padding: 0 14px; font-size: 10.5px; letter-spacing: 2px; color: #7E93B5; }
.nav-group:first-child { margin-top: 2px; }
.sidebar-foot { padding: 10px 20px 12px; line-height: 1.6; }

/* ============ ③ 自由练习工具区：紧凑 + 等高 ============ */
.blind-note { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; padding: 8px 14px; font-size: 12.5px; }
/* 2026-09-20：🎯 图标移除，文字左移 */
.filter-bar { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; margin-bottom: 14px; }
.filter-bar .seg { align-items: center; }
/* 2026-10-12b：搜索框/总数/刷新统一 40px 高；搜索条弹性伸缩（用户反馈融合感）。
   seg/总数/刷新 flex-shrink:0 防文字竖排，宽度不足时由搜索框独自收缩（min 190）。 */
.filter-bar .seg { flex-shrink: 0; }
.filter-bar .seg button { padding: 0 16px; height: 32px; display: inline-flex; align-items: center; white-space: nowrap; }
.filter-bar .search-input { flex: 1 1 320px; min-width: 190px; width: auto; max-width: 520px; height: 40px; padding: 0 14px; box-sizing: border-box; }
.filter-bar .btn { height: 40px; display: inline-flex; align-items: center; white-space: nowrap; flex-shrink: 0; }
.filter-bar .pool-count { flex-shrink: 0; white-space: nowrap; }
.filter-bar .pool-count { display: inline-flex; align-items: center; height: 40px; padding: 0 14px; font-size: 13px; color: #64748b; background: #f1f5f9; border: 1px solid #e2e8f0; border-radius: 10px; white-space: nowrap; font-variant-numeric: tabular-nums; box-sizing: border-box; }

/* ---------- 我的页：按使用顺序纵向布局（2026-09-19 晚） ---------- */
.profile-wrap {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.profile-wrap .card { margin-top: 0 !important; }
.profile-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: stretch;
}
.profile-cols .card { display: flex; flex-direction: column; }
.profile-cols .card > :last-child { margin-bottom: 0; }
.profile-stack { display: flex; flex-direction: column; gap: 14px; }
.profile-stack .card { margin-top: 0 !important; }

/* 我的页卡片标题：竖条 + 分隔线，与内容区区分 */
.profile-wrap .card-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  letter-spacing: 1px;
  color: #1e3a5f;
  padding-bottom: 10px;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(30, 64, 175, 0.12);
}
.profile-wrap .card-title::before {
  content: "";
  flex: 0 0 4px;
  width: 4px;
  height: 15px;
  border-radius: 2px;
  background: linear-gradient(180deg, #3b82f6, #93c5fd);
}
.profile-wrap .card-title b { font-size: inherit; letter-spacing: inherit; color: inherit; }
@media (max-width: 900px) {
  .profile-cols { grid-template-columns: 1fr; }
}

/* ---------- 像素判读冒险（2026-10-14，与小程序 pages/game 同构；浅色融合 + GBA 战斗屏） ---------- */
.game-wrap { max-width: 880px; margin: 0 auto; }
.train-hero-links { display: flex; gap: 10px; }
/* 标题横幅（暗色游戏标题屏 + 鎏金 + 内嵌商店入口） */
.game-banner { background: linear-gradient(160deg, #1B3D56 0%, #0E2233 72%); border: 1px solid #2E5878; border-radius: 14px; padding: 20px 22px 18px; margin-bottom: 16px; position: relative; overflow: hidden; text-align: left; }
.game-banner::after { content: ''; position: absolute; right: -24px; top: -24px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, rgba(245,215,122,.14) 0, transparent 70%); }
.gb-row { display: flex; align-items: center; justify-content: space-between; }
.gb-title { font-size: 20px; font-weight: 800; color: #F5D77A; letter-spacing: 1px; }
.gb-points { font-size: 14px; font-weight: 800; color: #F5D77A; background: rgba(224,166,60,.16); border: 1px solid rgba(224,166,60,.45); border-radius: 999px; padding: 4px 14px; }
.gb-desc { font-size: 12.5px; color: #9DB8CC; margin-top: 8px; line-height: 1.7; }
.gb-shop { margin-top: 10px; display: flex; align-items: center; justify-content: space-between; background: rgba(245,215,122,.10); border: 1px solid rgba(245,215,122,.35); border-radius: 9px; padding: 9px 14px; cursor: pointer; }
.gb-shop:hover { background: rgba(245,215,122,.18); }
.gb-shop-l { font-size: 13.5px; font-weight: 700; color: #F5D77A; }
.gb-shop-r { font-size: 12.5px; color: #C9B87A; }
/* 关卡地图（浅色三态） */
.stage-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.stage-cell { border-radius: 10px; padding: 14px 8px; text-align: center; background: #F7F8FA; border: 1px solid #E4E9F0; cursor: pointer; transition: all .15s; }
.stage-cell.done { background: #E7F6EF; border-color: #BFE5D2; }
.stage-cell.done .stage-no { color: #1C8A6B; }
.stage-cell.done .stage-state { color: #4FA97F; }
.stage-cell.lock { background: #F4F6F9; border: 1px dashed #D8DEE8; opacity: .75; cursor: not-allowed; }
.stage-cell.next { background: linear-gradient(160deg, #FFF7E0, #FFEDC4); border-color: #E0A63C; animation: stagePulsePc 1.6s ease-in-out infinite; }
@keyframes stagePulsePc { 0%,100% { box-shadow: 0 0 0 0 rgba(224,166,60,0), 0 3px 8px rgba(224,166,60,.12); } 50% { box-shadow: 0 0 0 7px rgba(224,166,60,.10), 0 4px 10px rgba(224,166,60,.30); } }
.stage-no { font-size: 14.5px; font-weight: 800; color: var(--ink); }
.stage-state { font-size: 11.5px; color: var(--ink-3); margin-top: 4px; }
.stage-cell.next .stage-state { color: #B07818; font-weight: 800; }
/* 像素风按钮 */
.game-go { margin-top: 16px; display: block; width: 100%; background: linear-gradient(180deg, #F5C463, #E0A63C); color: #3A2410; border: none; border-radius: 10px; font-size: 15.5px; font-weight: 800; letter-spacing: 1px; padding: 12px; cursor: pointer; box-shadow: 0 4px 0 #A66F14; transition: transform .08s, box-shadow .08s; }
.game-go:active { transform: translateY(3px); box-shadow: 0 1px 0 #A66F14; }
.ch-back { margin-top: 10px; display: block; width: 100%; background: #F5F6F8; color: var(--ink-2); border: none; border-radius: 10px; font-size: 14px; font-weight: 600; padding: 11px; cursor: pointer; box-shadow: 0 3px 0 #E2E6EC; transition: transform .08s, box-shadow .08s; }
.ch-back:active { transform: translateY(2px); box-shadow: 0 1px 0 #E2E6EC; }
/* 战斗双栏：左 GBA 屏右答题卡 */
.battle-row { display: flex; gap: 18px; align-items: flex-start; }
.gba-col { flex: 0 0 420px; }
.q-col { flex: 1 1 auto; min-width: 0; }
@media (max-width: 960px) { .battle-row { flex-direction: column; } .gba-col { flex: none; width: 100%; } }
.gba-screen { background: #1B1B1F; border-radius: 16px; padding: 8px; border: 1px solid #2E4256; box-shadow: 0 10px 24px rgba(20,40,60,.22); }
/* 2026-10-17：像素战斗背景图（assets/cast/pxbg_battle.png，464×330 = 场景 1:1，
   image-rendering:pixelated 保住硬像素边；底层渐变仅作图片加载中的兜底） */
.gba-scene { position: relative; height: 330px; border-radius: 10px; overflow: hidden; background: url('/assets/cast/pxbg_battle.png?v=3') center/100% 100% no-repeat, linear-gradient(180deg, #6BB6D6 0, #A8DCE8 66px, #8FD07A 66px, #6AB35C 100%); image-rendering: pixelated; }
.gba-enemy-box { position: absolute; top: 14px; left: 14px; z-index: 5; background: #C9C9CE; border: 3px solid #55555C; border-radius: 9px; padding: 8px 12px 9px; min-width: 210px; box-shadow: 3px 3px 0 #2E2E33; }
.geb-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.geb-name { font-size: 15px; font-weight: 800; color: #23232B; }
.geb-lv { font-size: 12px; font-weight: 700; color: #45454C; }
.geb-hp-row { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.geb-hp-tag { font-size: 10px; font-weight: 800; color: #fff; background: #55555C; border-radius: 4px; padding: 1px 6px; letter-spacing: 1px; }
.geb-hp-track { width: 130px; height: 9px; background: #4A4A50; border-radius: 3px; overflow: hidden; border: 1px solid #3A3A3F; display: inline-block; }
.geb-hp-fill { display: block; height: 100%; background: #58D68D; border-radius: 2px; transition: width .3s; }
.geb-hp-fill.mid { background: #F5D76E; }
.geb-hp-fill.low { background: #EC7063; }
/* 2026-10-17 晚：落脚椭圆彻底去掉（用户要求），pad 仅作定位容器 */
.gba-mon-pad { position: absolute; top: 118px; right: 26px; z-index: 3; width: 210px; height: 98px; background: none; border-radius: 50%; display: flex; align-items: flex-end; justify-content: center; }
.gba-hero-pad { position: absolute; bottom: 12px; left: 20px; z-index: 3; width: 180px; height: 82px; background: none; border-radius: 50%; display: flex; align-items: flex-end; justify-content: center; }
.px-sprite { position: relative; }
.px-cell { position: absolute; top: 0; left: 0; background: transparent; }
/* 三十三轮（血泪）：移除 filter —— filter 会创建合成层，导致立绘 PNG 完全不渲染 */
.gba-hero, .gba-mon { display: inline-block; }
/* 三十三轮：改 opacity 脉冲（filter 会卡住图片解码） */
.hit-flash { animation: hitPulsePc .18s ease-out; }
@keyframes hitPulsePc { 0% { opacity: 1; } 40% { opacity: .35; } 100% { opacity: 1; } }
.atk-move { animation: lungePc .3s; }
@keyframes lungePc { 0% { transform: translateY(0); } 45% { transform: translateY(-16px); } 100% { transform: translateY(0); } }
.gba-dialog { position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 6; background: #16303C; border: 3px solid #2FBF8F; border-radius: 10px; box-shadow: inset 0 0 0 3px #0F2430; color: #EAF6F6; font-size: 14px; font-weight: 600; padding: 12px 16px; min-height: 56px; display: flex; align-items: center; }
/* 答题卡 */
.gq-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.gq-idx { font-size: 12px; color: var(--ink-3); margin-bottom: 8px; }
.gq-img { width: 100%; height: 260px; border-radius: 10px; background: #0B1B21; object-fit: contain; display: block; }
.gq-ecg { display: flex; align-items: center; justify-content: center; color: #7FD1D4; font-size: 16px; font-weight: 700; background: linear-gradient(135deg, #0E2A33, #17434F); }
.gq-stem { font-size: 14.5px; color: var(--ink); margin: 12px 0; font-weight: 600; line-height: 1.6; }
.gq-opts { display: flex; flex-direction: column; gap: 10px; }
.gq-opt { display: flex; align-items: center; gap: 12px; border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; background: #FAFBFC; cursor: pointer; transition: all .12s; font-size: 14px; color: var(--ink); text-align: left; width: 100%; }
.gq-opt:hover { border-color: #E0A63C; }
.gq-opt.disabled { pointer-events: none; }
.gq-opt-key { flex-shrink: 0; width: 26px; height: 26px; border-radius: 6px; background: #E9EFF1; color: var(--ink-2); font-size: 13px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.gq-opt.right { background: #E7F6EF; border-color: #1C8A6B; }
.gq-opt.right .gq-opt-key { background: #1C8A6B; color: #fff; }
.gq-opt.wrong { background: #FDECEC; border-color: #d9534f; }
.gq-opt.wrong .gq-opt-key { background: #d9534f; color: #fff; }
/* 结算 */
.over-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 34px 26px; text-align: center; box-shadow: var(--shadow); }
.over-title { font-size: 22px; font-weight: 800; color: #E0A63C; }
.over-title.lose { color: var(--ink-2); }
.over-desc { font-size: 14px; color: var(--ink-2); line-height: 1.8; margin: 12px 0 6px; }
.over-points { font-size: 16px; font-weight: 800; color: #B07818; }
/* 皮肤商店弹层 */
.shop-mask { position: fixed; inset: 0; background: rgba(15,23,32,.5); z-index: 300; display: flex; align-items: center; justify-content: center; }
.shop-panel { width: 560px; max-width: 92vw; max-height: 80vh; overflow-y: auto; background: #fff; border-radius: 16px; padding: 22px; }
.shop-head { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.shop-title { font-size: 18px; font-weight: 800; color: var(--ink); flex: 1; }
.shop-points { font-size: 14px; font-weight: 700; color: #B07818; background: #FCF1DA; border-radius: 999px; padding: 4px 12px; }
.shop-close { font-size: 20px; color: var(--ink-3); cursor: pointer; padding: 0 8px; }
.shop-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.shop-item { background: #F7F8FA; border: 1px solid #EDF0F4; border-radius: 12px; padding: 14px 10px; text-align: center; display: flex; flex-direction: column; }
/* 三十三轮：去掉黑色底（用户要求），立绘透出卡片底色 */
.shop-sprite { background: none; border-radius: 8px; padding: 12px 0; display: flex; align-items: center; justify-content: center; }
.shop-name { font-size: 14px; font-weight: 700; color: var(--ink); margin-top: 8px; }
.shop-desc { font-size: 11.5px; color: var(--ink-3); margin-top: 2px; }
.shop-act { margin-top: auto; padding-top: 10px; }   /* 贴底对齐：卡片等高后所有按钮同一水平线 */
.shop-using { font-size: 12px; color: #1C8A6B; font-weight: 700; }
.shop-btn { font-size: 12.5px; padding: 6px 14px; border-radius: 8px; cursor: pointer; border: none; }
.shop-btn.buy { background: linear-gradient(180deg, #F5C463, #E0A63C); color: #3A2410; font-weight: 800; box-shadow: 0 2px 0 #A66F14; }
.shop-btn.use { background: #fff; color: #B07818; border: 1px solid #E0C878; }
/* 结算按钮组：一排两枚、等高、颜色区分（2026-10-14 与移动端同构） */
.over-btns { display: flex; gap: 12px; margin-top: 18px; }
.over-btns button { flex: 1; width: auto; margin-top: 0; height: 46px; padding: 0; display: flex; align-items: center; justify-content: center; font-size: 15px; }
/* ---- 五轮精修（2026-10-14 与移动端同构）：横幅底排等高胶囊 + 线型锁 + 深蓝鎏金按钮 ---- */
.gb-title { display: flex; align-items: center; }
.gb-foot { margin-top: 10px; display: flex; align-items: center; justify-content: space-between; }
.gb-shop-chip { display: flex; align-items: center; justify-content: center; height: 32px; padding: 0 16px; background: rgba(245,215,122,.12); border: 1px solid rgba(245,215,122,.4); border-radius: 999px; font-size: 13.5px; font-weight: 700; color: #F5D77A; cursor: pointer; }
.gb-foot .gb-points { display: flex; align-items: center; justify-content: center; height: 32px; padding: 0 14px; background: rgba(224,166,60,.16); border: 1px solid rgba(224,166,60,.45); border-radius: 999px; font-size: 14px; font-weight: 800; color: #F5D77A; }
.stage-no { min-height: 20px; display: flex; align-items: center; justify-content: center; }
.lock-ico { position: relative; width: 14px; height: 11px; border: 1.5px solid #A9B6C4; border-radius: 3px; }
.lock-ico::before { content: ''; position: absolute; top: -7px; left: 50%; transform: translateX(-50%); width: 8px; height: 7px; border: 1.5px solid #A9B6C4; border-bottom: none; border-radius: 5px 5px 0 0; }
.lock-ico::after { content: ''; position: absolute; left: 50%; top: 3px; transform: translateX(-50%); width: 1.5px; height: 4px; background: #A9B6C4; border-radius: 1px; }
.game-go, .over-btns .game-go { background: linear-gradient(180deg, #23486A 0%, #16304A 100%); color: #F5D77A; border: 1.5px solid rgba(245,215,122,.55); border-radius: 11px; box-shadow: 0 6px 16px rgba(21,48,74,.28); }
.game-go:active { transform: translateY(2px); box-shadow: 0 3px 8px rgba(21,48,74,.24); }
/* ---- 六轮：积分文案化 + 像素皇冠标题徽标 + 底排紧靠（2026-10-14 与移动端同构） ---- */
.gb-title { gap: 8px; }
.gb-ti { flex-shrink: 0; }
.gb-foot { justify-content: flex-start; gap: 10px; }
/* ---- 七轮：PC 布局充实重排（2026-10-14）——地图双栏 / 战斗加宽 / 结算立绘+数据胶囊 ---- */
.game-wrap { max-width: 1060px; }
.gm-card { padding: 18px; }
/* 地图双栏：左关卡栅格，右进度/皮肤/出发按钮 */
.map-cols { display: flex; gap: 18px; align-items: stretch; }
.map-main { flex: 1 1 auto; min-width: 0; }
.map-side { flex: 0 0 272px; display: flex; flex-direction: column; gap: 12px; }
.side-box { background: #F7F8FA; border: 1px solid #EDF0F4; border-radius: 12px; padding: 14px 16px; }
.side-label { font-size: 12px; color: var(--ink-3); }
.side-value { font-size: 20px; font-weight: 800; color: var(--ink); margin-top: 2px; }
.side-value i { font-style: normal; font-size: 13px; font-weight: 600; color: var(--ink-3); }
.side-value.sm { font-size: 15px; }
.prog-track { height: 8px; background: #ECEEF2; border-radius: 4px; overflow: hidden; margin-top: 10px; }
.prog-fill { height: 100%; background: linear-gradient(90deg, #F5C463, #E0A63C); border-radius: 4px; transition: width .3s; }
/* ---- 2026-10-17 重做：像素风皮肤卡（用户反馈原布局空旷不融合）----
   复古双线框 + 像素斜纹底 + 立绘舞台 + 名称 + 使用中胶囊；整卡可点开商店 */
.skin-box {
  position: relative; display: flex; align-items: center; gap: 14px;
  padding: 14px 16px; cursor: pointer; overflow: hidden;
  background: linear-gradient(135deg, #FFFDF4 0%, #FFF7E6 100%);
  border: 1.5px solid #EAD9AE; border-radius: 12px;
  box-shadow: inset 0 0 0 3px #FFFDF4, 0 4px 12px rgba(176, 120, 24, .08);
  transition: transform .12s, box-shadow .12s, border-color .12s;
}
/* 像素斜纹底纹（低透明度，只做肌理） */
.skin-box::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background-image: repeating-linear-gradient(45deg, rgba(224, 166, 60, .07) 0 3px, transparent 3px 9px);
}
.skin-box:hover { border-color: #E0A63C; box-shadow: inset 0 0 0 3px #FFFDF4, 0 7px 16px rgba(176, 120, 24, .16); transform: translateY(-1px); }
.skin-box:active { transform: translateY(0); }
/* 立绘舞台：暖色径向光 + 细框，萝卜像站在展示台上 */
.skin-sprite-mini {
  position: relative; width: 84px; height: 84px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: radial-gradient(circle at 50% 60%, #FFFFFF 0 40%, #FDF3DC 40% 70%, #F6E4BC 70% 100%);
  border: 1.5px solid #EAD9AE; border-radius: 10px;
}
.skin-sprite-mini img { position: relative; z-index: 1; }
.skin-meta { position: relative; min-width: 0; }
.skin-meta .side-label { color: #B07818; font-weight: 700; letter-spacing: 1.5px; }
.skin-name { font-size: 17px; font-weight: 800; color: var(--ink); margin-top: 3px; line-height: 1.25; }
.skin-using {
  display: inline-flex; align-items: center; gap: 5px; margin-top: 8px;
  font-size: 11px; font-weight: 700; color: #1C8A6B;
  background: #E7F6EF; border: 1px solid #B8E2D0; border-radius: 999px; padding: 2px 10px;
}
/* 像素小绿点（方形，不用圆） */
.skin-using::before { content: ''; width: 6px; height: 6px; background: #1C8A6B; border-radius: 1px; }
.map-side .game-go { margin-top: auto; }
@media (max-width: 960px) { .map-cols { flex-direction: column; } .map-side { flex: none; width: 100%; } .map-side .game-go { margin-top: 4px; } }
/* 战斗页加宽 */
.gba-col { flex: 0 0 480px; }
.gba-scene { height: 360px; }
.gq-img { height: 300px; }
/* 结算：皮肤立绘 + 数据胶囊 */
.over-hero { display: flex; justify-content: center; margin-bottom: 8px; }
.over-stats { display: flex; gap: 10px; justify-content: center; margin: 12px 0 6px; flex-wrap: wrap; }
.ov-pill { background: #F7F8FA; border: 1px solid #EDF0F4; border-radius: 999px; padding: 6px 16px; font-size: 13px; font-weight: 700; color: var(--ink-2); }
.ov-pill.gold { background: #FCF1DA; border-color: #F0E4C0; color: #B07818; }
/* ---- 八轮：PC 关卡改游戏地图式蛇形棋盘（2026-10-14 三端同步） ---- */
.snake-board { display: grid; grid-template-columns: repeat(3, 1fr); column-gap: 56px; row-gap: 44px; padding: 6px 4px 2px; }
.snode { display: flex; flex-direction: column; align-items: center; position: relative; }
.snode-circle { width: 92px; height: 92px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #F7F8FA; border: 2px solid #E4E9F0; box-sizing: border-box; }
.snode.done .snode-circle { background: #E7F6EF; border-color: #2FBF8F; }
.snode.next .snode-circle { background: linear-gradient(160deg, #FFF7E0, #FFEDC4); border-color: #E0A63C; animation: stagePulsePc 1.6s ease-in-out infinite; }
.snode.lock .snode-circle { background: #F4F6F9; border: 2px dashed #D8DEE8; opacity: .85; }
.snum { font-size: 26px; font-weight: 800; color: var(--ink); line-height: 1; }
.snode.done .snum { color: #1C8A6B; }
.snode.next .snum { color: #B07818; }
.snode-state { margin-top: 8px; font-size: 12.5px; color: var(--ink-3); }
.snode.next .snode-state { color: #B07818; font-weight: 800; }
/* 虚线连接：行内右向 / 蛇形回程左向 / 行尾拐弯 */
.snode.h-right::after { content: ''; position: absolute; top: 45px; right: -56px; width: 56px; border-top: 3px dashed #C9D4E0; }
.snode.h-left::after { content: ''; position: absolute; top: 45px; left: -56px; width: 56px; border-top: 3px dashed #C9D4E0; }
.snode.elbow::before { content: ''; position: absolute; left: 50%; margin-left: -1.5px; bottom: -44px; height: 44px; border-left: 3px dashed #C9D4E0; }
/* ---- 九轮：PC 关卡改游戏风草地场景 + 蜿蜒沙路（2026-10-14 三端同步，参考消除类游戏地图） ---- */
.map-land { position: relative; height: 720px; border-radius: 16px; overflow: hidden; background: linear-gradient(180deg, #EAF6DE 0%, #D2EBC4 48%, #BFE0B0 100%); border: 1px solid #C4DFB8; }
.land-deco { position: absolute; z-index: 0; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #ABDB90, #82C16E 72%); box-shadow: inset -4px -6px 0 rgba(94,152,82,.30); }
.land-deco.d1 { width: 70px; height: 62px; left: 30%; top: 110px; }
.land-deco.d2 { width: 52px; height: 48px; left: 57%; top: 195px; }
.land-deco.d3 { width: 80px; height: 70px; left: 29%; top: 420px; }
.land-deco.d4 { width: 62px; height: 56px; left: 8%; top: 560px; }
.land-deco.pond { width: 100px; height: 70px; left: 57%; top: 580px; border-radius: 46% 54% 52% 48%; background: radial-gradient(circle at 40% 35%, #C4E7F7, #8FC9E8 72%); box-shadow: inset -3px -5px 0 rgba(110,165,205,.4); }
.road-seg { position: absolute; z-index: 1; height: 22px; background: #E7C989; border-radius: 11px; box-shadow: inset 0 -4px 0 rgba(172,128,62,.35); }
.road-seg::after { content: ''; position: absolute; left: 6px; right: 6px; top: 50%; height: 0; border-top: 2px dashed rgba(255,255,255,.8); transform: translateY(-50%); }
.land-node { position: absolute; z-index: 2; width: 140px; display: flex; flex-direction: column; align-items: center; }
.gnode { width: 92px; height: 92px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #F7F8FA; border: 4px solid #fff; box-shadow: 0 6px 14px rgba(60,90,50,.22); box-sizing: border-box; }
.gnode.done { background: linear-gradient(160deg, #4CC08E, #2FA371); }
.gnode.next { background: linear-gradient(160deg, #F5C463, #E0A63C); animation: stagePulsePc 1.6s ease-in-out infinite; }
.gnode.lock { background: #AEBAC6; }
.gnum { font-size: 26px; font-weight: 800; color: #fff; line-height: 1; text-shadow: 0 2px 0 rgba(0,0,0,.15); }
.gnode.lock .lock-ico { border-color: #F7FAFC; }
.gnode.lock .lock-ico::before { border-color: #F7FAFC; }
.gnode.lock .lock-ico::after { background: #F7FAFC; }
.gstate { margin-top: 8px; background: rgba(255,255,255,.92); border-radius: 999px; padding: 3px 12px; font-size: 12px; color: #5E7D5E; box-shadow: 0 2px 6px rgba(60,90,50,.12); }
.gstate.hot { color: #B07818; font-weight: 800; }

/* ---- 十四轮：像素冒险样式精修（2026-10-14 三端同步，格子弹窗版基线上做融合打磨） ---- */
.game-banner { background: linear-gradient(160deg, #1E4260 0%, #10273C 72%); border-color: rgba(255,255,255,.10); border-radius: 14px; box-shadow: 0 10px 22px rgba(16,39,60,.25); }
.game-banner::before { content: ''; position: absolute; left: 18px; right: 18px; bottom: 0; height: 2px; background: linear-gradient(90deg, transparent, rgba(245,215,122,.65), transparent); }
.gb-shop-chip { transition: background .15s; }
.gb-shop-chip:hover { background: rgba(245,215,122,.22); }
.gb-points { transition: background .15s; }
.stage-grid { gap: 12px; }
.stage-cell { border-radius: 12px; padding: 16px 6px 14px; background: linear-gradient(180deg, #FBFCFD, #F4F6F9); border-color: #E7EBF1; box-shadow: 0 3px 8px rgba(35,45,60,.06); transition: all .15s; }
.stage-cell:hover { transform: translateY(-2px); box-shadow: 0 6px 14px rgba(35,45,60,.10); }
.stage-cell:active { transform: translateY(1px); }
.stage-cell.done { background: linear-gradient(180deg, #EAF9F1, #DFF3E9); border-color: #B5E0CB; box-shadow: 0 3px 8px rgba(28,138,107,.10); }
.stage-cell.next { background: linear-gradient(160deg, #FFF7E0, #FFEFC8); }
.stage-cell.next .stage-no { color: #8A5A2B; }
.stage-no { font-size: 15px; min-height: 22px; gap: 6px; }
.stage-state { font-size: 12px; }
.side-box { border-radius: 12px; box-shadow: 0 3px 8px rgba(35,45,60,.05); }
.game-go:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(21,48,74,.34); }

/* ---- 十六轮：PC 选关格拉高与右栏对齐（2026-10-15） ---- */
.map-main { display: flex; flex-direction: column; }
.map-main .stage-grid { flex: 1; grid-template-rows: repeat(3, 1fr); }
.stage-cell { min-height: 84px; display: flex; flex-direction: column; align-items: center; justify-content: center; }

/* ---- 十七轮：战斗场景真实游戏感（与小程序 pages/game 同构，2026-10-15） ---- */
.gba-cloud { position: absolute; z-index: 1; height: 10px; border-radius: 999px; background: rgba(255,255,255,.9); box-shadow: inset -3px -2px 0 rgba(190,225,240,.9); }
.gba-cloud.c1 { width: 60px; left: 8%; top: 15px; animation: cloudDriftPc 24s ease-in-out infinite alternate; }
.gba-cloud.c2 { width: 42px; left: 58%; top: 28px; animation: cloudDriftPc 32s ease-in-out infinite alternate-reverse; }
@keyframes cloudDriftPc { from { transform: translateX(-12px); } to { transform: translateX(18px); } }
.gba-bush { position: absolute; z-index: 1; width: 38px; height: 19px; border-radius: 50% 50% 42% 42%; background: #5FA84E; box-shadow: inset -4px -5px 0 rgba(74,130,62,.55); }
.gba-bush.b1 { left: 5%; top: 76px; }
.gba-bush.b2 { right: 30%; top: 48px; width: 28px; height: 15px; }
.gba-flower { position: absolute; z-index: 1; width: 8px; height: 8px; border-radius: 50%; background: #F5D77A; box-shadow: 11px 4px 0 #F08A8A, -9px 6px 0 #fff; }
.gba-flower.f1 { right: 7%; bottom: 64px; }
.gba-hero { animation: heroBobPc 2.4s ease-in-out infinite; }
@keyframes heroBobPc { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.gba-mon { animation: monBobPc 2.8s ease-in-out infinite; }
@keyframes monBobPc { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
.gba-hero.atk-move { animation: lungePc .3s ease; }
.gba-mon-pad.mon-hit { animation: monHitPc .28s ease; }
/* V80：删除受击白色斜切条（用户反馈的最大白块，rgba(255,255,255,.95) 的 .95 白） */
@keyframes monHitPc { 0%,100% { transform: translateX(0); } 30% { transform: translateX(-5px); } 60% { transform: translateX(4px); } }
.gba-screen.shake { animation: screenShakePc .28s ease; }
@keyframes screenShakePc { 0%,100% { transform: translate(0,0); } 25% { transform: translate(-2px,1px); } 50% { transform: translate(2px,-1px); } 75% { transform: translate(-1px,1px); } }
.gba-dialog::after { content: '▼'; position: absolute; right: 9px; bottom: 3px; color: #2FBF8F; font-size: 10px; animation: dlgBlinkPc 1.1s steps(2,start) infinite; }
@keyframes dlgBlinkPc { 50% { opacity: 0; } }

/* ---- 十九轮：战斗画面现代游戏化（与小程序 pages/game 同构，2026-10-15） ---- */
/* ---- 2026-10-17：战斗背景换像素场景图（用户要求美化+像素化感；462×400=场景 1:1，image-rendering:pixelated 保硬像素边；渐变仅作加载兜底） ---- */
.gba-scene { background: url('/assets/cast/pxbg_battle.png?v=3') center/100% 100% no-repeat, linear-gradient(180deg, #6BB8E4 0%, #9BD6EE 26%, #CDEEF7 40%, #CDEEF7 40.5%, #86CC72 40.5%, #6DB65F 72%, #57A24E 100%); image-rendering: pixelated; }
.gba-scene::after { content: ''; position: absolute; inset: 0; z-index: 9; pointer-events: none; background: radial-gradient(ellipse at center, rgba(0,0,0,0) 52%, rgba(10,32,22,.30) 100%); }
.gba-sun { position: absolute; z-index: 0; right: 8%; top: 6px; width: 75px; height: 75px; border-radius: 50%; background: radial-gradient(circle, rgba(255,246,200,.95) 0 22%, rgba(255,240,170,.35) 45%, transparent 70%); }
.gba-hill { position: absolute; z-index: 0; border-radius: 50% 50% 0 0; }
.gba-hill.h1 { left: -12%; bottom: 46%; width: 62%; height: 48px; background: #63A854; opacity: .9; }
.gba-hill.h2 { right: -16%; bottom: 46%; width: 70%; height: 39px; background: #6FB35E; opacity: .75; }
.gba-enemy-box { background: rgba(14,32,46,.55); border: 1px solid rgba(255,255,255,.20); border-radius: 10px; box-shadow: 0 6px 14px rgba(8,28,20,.30); padding: 7px 10px 8px; }
.geb-name { color: #F2F8FF; font-size: 15px; }
.geb-lv { color: #FFE08A; background: rgba(255,224,138,.16); border-radius: 999px; padding: 1px 7px; font-size: 12px; }
.geb-hp-track { position: relative; width: 130px; height: 9px; background: rgba(0,0,0,.38); border: none; border-radius: 999px; box-shadow: inset 0 1px 2px rgba(0,0,0,.35); overflow: hidden; display: inline-block; }
.geb-hp-ghost { position: absolute; left: 0; top: 0; height: 100%; background: rgba(255,255,255,.35); border-radius: 999px; transition: width .45s ease .32s; }
.geb-hp-fill { position: absolute; left: 0; top: 0; height: 100%; background: linear-gradient(90deg, #6BE8A0, #2FBF7F); border-radius: 999px; transition: width .28s ease; box-shadow: 0 0 6px rgba(111,232,160,.5); }
.geb-hp-fill.mid { background: linear-gradient(90deg, #FFE08A, #F5B942); box-shadow: 0 0 6px rgba(245,185,66,.5); }
.geb-hp-fill.low { background: linear-gradient(90deg, #FF9E8A, #EC7063); box-shadow: 0 0 6px rgba(236,112,99,.55); animation: hpPulsePc .9s ease-in-out infinite; }
@keyframes hpPulsePc { 0%,100% { opacity: 1; } 50% { opacity: .65; } }
.gba-slash { position: absolute; z-index: 7; left: 20%; top: 36%; width: 90px; height: 13px; border-radius: 999px; opacity: 0; pointer-events: none; background: linear-gradient(90deg, transparent, rgba(255,255,255,.95) 42%, rgba(255,255,255,.95) 60%, transparent); transform: rotate(-16deg) scaleX(.2); filter: drop-shadow(0 0 5px rgba(255,255,255,.8)); }
.gba-slash.on { animation: slashFlyPc .34s ease-out; }
@keyframes slashFlyPc { 0% { opacity: 0; transform: rotate(-16deg) scaleX(.2) translateX(0); } 35% { opacity: 1; transform: rotate(-16deg) scaleX(1) translateX(85px); } 100% { opacity: 0; transform: rotate(-16deg) scaleX(.55) translateX(170px); } }
.gba-float { position: absolute; z-index: 8; left: 50%; top: 20%; opacity: 0; pointer-events: none; transform: translateX(-50%); font-size: 21px; font-weight: 800; color: #FFE08A; text-shadow: 0 2px 0 rgba(12,30,22,.35); }
.gba-float.on { animation: floatUpPc .9s ease-out; }
@keyframes floatUpPc { 0% { opacity: 0; transform: translate(-50%, 8px) scale(.8); } 30% { opacity: 1; transform: translate(-50%, 0) scale(1.12); } 100% { opacity: 0; transform: translate(-50%, -26px) scale(1); } }
.gba-mon-pad.mon-die .gba-mon { animation: monDiePc .55s ease-in forwards; }
@keyframes monDiePc { 0% { transform: scale(1) rotate(0); opacity: 1; } 45% { transform: scale(1.18) rotate(0); opacity: 1; } 100% { transform: scale(.15) rotate(28deg); opacity: 0; } }

/* ---- 二十轮：答题区游戏化（深色 HUD 面板 + 倒计时 + 粒子 + 反击，与小程序同构 2026-10-15） ---- */
.gq-card { background: linear-gradient(180deg, #14283A 0%, #0E1E2C 100%); border: 1px solid rgba(245,215,122,.28); border-radius: 14px; box-shadow: 0 12px 26px rgba(8,24,36,.30); }
.gq-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.gq-idx { margin-bottom: 0; color: #9DB8CC; }
.gq-time { font-size: 13px; font-weight: 800; color: #FFE08A; background: rgba(245,215,122,.12); border: 1px solid rgba(245,215,122,.40); border-radius: 999px; padding: 3px 12px; }
.gq-time.warn { color: #fff; background: rgba(236,112,99,.85); border-color: rgba(255,255,255,.5); animation: hpPulsePc .6s ease-in-out infinite; }
.gq-timebar { height: 5px; background: rgba(255,255,255,.10); border-radius: 999px; margin-bottom: 12px; overflow: hidden; }
.gq-timefill { display: block; height: 100%; background: linear-gradient(90deg, #F5D77A, #E0A63C); border-radius: 999px; transition: width .25s linear; }
.gq-img { border: 1px solid rgba(255,255,255,.14); border-radius: 10px; box-shadow: inset 0 0 0 3px rgba(0,0,0,.25); }
.gq-stem { color: #EAF4FB; }
.gq-opt { background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03)); border: 1px solid rgba(255,255,255,.16); color: #E8F2F8; border-radius: 12px; padding: 14px 16px; }
.gq-opt:hover { border-color: rgba(245,215,122,.55); background: rgba(255,255,255,.09); }
.gq-opt:active { transform: translateY(2px); }
.gq-opt-key { background: linear-gradient(180deg, #F7D98D, #E0A63C); color: #3A2410; font-weight: 800; border-radius: 8px; box-shadow: 0 2px 0 #A66F14; }
.gq-opt.right { background: linear-gradient(180deg, rgba(47,191,127,.35), rgba(47,191,127,.18)); border: 2px solid #2FBF7F; box-shadow: 0 0 14px rgba(47,191,127,.35); }
.gq-opt.right .gq-opt-key { background: linear-gradient(180deg, #6BE8A0, #2FBF7F); color: #07301F; }
.gq-opt.wrong { background: linear-gradient(180deg, rgba(236,112,99,.32), rgba(236,112,99,.16)); border: 2px solid #EC7063; box-shadow: 0 0 14px rgba(236,112,99,.32); }
.gq-opt.wrong .gq-opt-key { background: linear-gradient(180deg, #FF9E8A, #EC7063); color: #3A0F0A; }
.gba-sparks { position: absolute; inset: 0; z-index: 8; pointer-events: none; }
.gba-sparks .spark { position: absolute; left: 64%; top: 24%; width: 5px; height: 5px; border-radius: 50%; background: #FFE08A; opacity: 0; box-shadow: 0 0 6px rgba(255,224,138,.95); }
.gba-sparks .s2 { left: 58%; top: 18%; width: 4px; height: 4px; }
.gba-sparks .s3 { left: 70%; top: 18%; width: 4px; height: 4px; }
.gba-sparks .s4 { left: 60%; top: 32%; width: 4px; height: 4px; }
.gba-sparks .s5 { left: 70%; top: 32%; width: 6px; height: 6px; }
.gba-sparks .s6 { left: 64%; top: 38%; width: 4px; height: 4px; }
.gba-sparks.on .spark { animation: sparkFlyPc .5s ease-out forwards; }
.gba-sparks.on .s2 { animation-name: sparkFly2Pc; animation-delay: .04s; }
.gba-sparks.on .s3 { animation-name: sparkFly3Pc; animation-delay: .08s; }
.gba-sparks.on .s4 { animation-name: sparkFly4Pc; animation-delay: .02s; }
.gba-sparks.on .s5 { animation-name: sparkFly5Pc; animation-delay: .06s; }
.gba-sparks.on .s6 { animation-name: sparkFly6Pc; animation-delay: .1s; }
@keyframes sparkFlyPc { 0% { opacity: 1; transform: translate(0,0) scale(1); } 100% { opacity: 0; transform: translate(34px,-40px) scale(.3); } }
@keyframes sparkFly2Pc { 0% { opacity: 1; transform: translate(0,0) scale(1); } 100% { opacity: 0; transform: translate(-28px,-48px) scale(.3); } }
@keyframes sparkFly3Pc { 0% { opacity: 1; transform: translate(0,0) scale(1); } 100% { opacity: 0; transform: translate(50px,-42px) scale(.3); } }
@keyframes sparkFly4Pc { 0% { opacity: 1; transform: translate(0,0) scale(1); } 100% { opacity: 0; transform: translate(-44px,-22px) scale(.3); } }
@keyframes sparkFly5Pc { 0% { opacity: 1; transform: translate(0,0) scale(1.2); } 100% { opacity: 0; transform: translate(42px,-18px) scale(.3); } }
@keyframes sparkFly6Pc { 0% { opacity: 1; transform: translate(0,0) scale(1); } 100% { opacity: 0; transform: translate(-10px,-56px) scale(.3); } }
.gba-mon-pad.mon-taunt .gba-mon { animation: monTauntPc .5s ease; }
@keyframes monTauntPc { 0% { transform: translate(0,0); } 40% { transform: translate(-34px,-10px) rotate(-8deg); } 70% { transform: translate(-18px,-4px) rotate(-4deg); } 100% { transform: translate(0,0); } }
.gba-screen.mon-soft { animation: screenSoftPc .3s ease; }
@keyframes screenSoftPc { 0%,100% { transform: translate(0,0); } 30% { transform: translate(-2px,1px); } 60% { transform: translate(2px,-1px); } }

/* ---- 二十一轮 P0：角色精修配套（帧切换 / 10 格血条 / 前景草丛 / 音效开关） ---- */
/* 精灵必须显式清背景：.px-sprite 曾误命中全局 .main（主内容区米色暖背景 + fixed），
   导致每个角色背后出现米色方块；帧类名也已从 main/alt 改为 f-idle/f-atk 防再撞 */
.px-sprite { background: none; }
.gba-hero .px-sprite.f-atk, .gba-mon .px-sprite.f-atk { display: none; }
.gba-hero.atk-frame .px-sprite.f-atk, .gba-mon.atk-frame .px-sprite.f-atk { display: block; }
.gba-hero.atk-frame .px-sprite.f-idle, .gba-mon.atk-frame .px-sprite.f-idle { display: none; }
/* 三十二轮：PNG 精灵（24x24@3x）必须像素化渲染，否则浏览器双线性插值会糊成"颗粒失真" */
.px-sprite.png-sprite {
  background: none;
  /* 三十三轮：去掉 image-rendering: pixelated —— 那是给像素画用的，
     3D 卡通立绘必须用默认平滑插值，否则整体被马士克化。 */
  -webkit-image-rendering: auto;
  image-rendering: auto;
}
/* 三十三轮（血泪）：**绝对不要给立绘或其祖先加 filter**。
   实锤 —— filter 会为元素创建独立合成层，立绘 PNG 在合成层内拿不到解码结果，
   表现为战斗页只有空草地圆环、图片完全不显示。
   逐项排除实测：移除 filter 的同一步 naturalWidth 立刻从 0 变为正常值。
   接地感由场景内 .gba-*-pad 草地圆环承担，不需要 drop-shadow。 */
.hp-segs { display: inline-flex; gap: 2px; }
.hp-segs .hp-seg { width: 7px; height: 9px; border-radius: 2px; background: rgba(255,255,255,.16); box-shadow: inset 0 1px 1px rgba(0,0,0,.3); }
.hp-segs .hp-seg.on { background: linear-gradient(180deg, #6BE8A0, #2FBF7F); box-shadow: 0 0 5px rgba(111,232,160,.45); }
.hp-segs.mid .hp-seg.on { background: linear-gradient(180deg, #FFE08A, #F5B942); box-shadow: 0 0 5px rgba(245,185,66,.45); }
.hp-segs.low .hp-seg.on { background: linear-gradient(180deg, #FF9E8A, #EC7063); box-shadow: 0 0 5px rgba(236,112,99,.5); animation: hpPulsePc .9s ease-in-out infinite; }
.gba-tuft { position: absolute; z-index: 2; bottom: 4px; width: 56px; height: 20px; pointer-events: none; background: radial-gradient(ellipse at 50% 100%, rgba(46,96,52,.55) 0 60%, transparent 72%); }
.gba-tuft.t1 { left: -6px; }
.gba-tuft.t2 { right: -6px; }
.gb-sfx { display: inline-flex; align-items: center; height: 32px; padding: 0 14px; background: rgba(157,184,204,.16); border: 1px solid rgba(157,184,204,.42); border-radius: 999px; font-size: 12.5px; color: #CFE3F0; cursor: pointer; }
.gb-sfx:hover { background: rgba(157,184,204,.26); }

/* ---- 二十二轮 P1：双血条对砍（主角心格 / 受击演出 / 星级结算） ---- */
.gba-hero-box {
  /* z-index 必须高于怪兽精灵(3/4)与 .gba-sparks(8)：否则被压住看不见 */
  position: absolute; top: 14px; right: 14px; z-index: 10;
  background: rgba(14, 32, 46, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.20);
  border-radius: 10px;
  box-shadow: 0 10px 24px rgba(8, 28, 20, 0.30);
  padding: 9px 13px 11px;
  min-width: 158px;
}
.ghb-row { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.ghb-name { color: #FFD9A8; font-size: 14px; font-weight: 800; }
.ghb-lv { color: #FFE08A; background: rgba(255, 224, 138, 0.16); border-radius: 999px; padding: 1px 8px; font-size: 11.5px; }
.gba-hero-box.hurt { animation: ghbShakePc .34s ease; border-color: rgba(255, 120, 110, 0.75); }
@keyframes ghbShakePc { 0%,100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 55% { transform: translateX(5px); } 80% { transform: translateX(-2px); } }
/* 心格：红橙配色，与怪兽绿蓝血格一眼区分敌我 */
.hp-segs.hero { margin-top: 8px; gap: 6px; }
.hp-segs.hero .hp-seg {
  width: 26px; height: 19px;
  border-radius: 6px 6px 9px 9px;
  background: rgba(255, 255, 255, 0.13);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.30);
}
.hp-segs.hero .hp-seg.on { background: linear-gradient(180deg, #FF9E6B, #E8452F); box-shadow: 0 0 9px rgba(232, 69, 47, 0.55); }
.hp-segs.hero.low .hp-seg.on { background: linear-gradient(180deg, #FF6B5A, #C81E1E); animation: hpPulsePc .7s ease-in-out infinite; }
/* 主角受击：闪白 + 后仰 */
/* 三十三轮：改 opacity 脉冲 */
.gba-hero.hurt-flash { animation: hurtPulsePc .22s ease-out; }
@keyframes hurtPulsePc { 0% { opacity: 1; } 35% { opacity: .3; } 100% { opacity: 1; } }
.gba-hero-pad.hero-hurt .gba-hero { animation: heroHurtPc .38s ease; }
@keyframes heroHurtPc {
  0% { transform: translate(0, 0); }
  30% { transform: translate(-8px, 5px) rotate(-4deg); }
  60% { transform: translate(5px, -2px) rotate(3deg); }
  100% { transform: translate(0, 0); }
}
.gba-hero-pad.hero-die .gba-hero { animation: heroDiePc .6s ease-in forwards; }
@keyframes heroDiePc {
  0% { transform: rotate(0) scale(1); opacity: 1; }
  40% { transform: rotate(-14deg) scale(.92); opacity: .9; }
  100% { transform: rotate(-72deg) scale(.5) translateY(24px); opacity: .25; }
}
/* 结算星级 */
.ov-stars { display: flex; justify-content: center; gap: 10px; margin: 4px 0 6px; }
.ov-star { font-size: 42px; line-height: 1; color: rgba(31, 41, 55, 0.16); }
.ov-star.on { color: #FFD34E; text-shadow: 0 3px 10px rgba(255, 190, 40, 0.55); }
.over-title.lose { color: #C0392B; }

/* ---- 二十三轮 P1技能/P2强化卡/P3街机 ---- */
.gba-skills { /* 右对齐：主角在左、怪兽精灵在其上方，右下角是唯一空位 */ position: absolute; right: 12px; bottom: 96px; z-index: 2; display: flex; align-items: center; gap: 8px; }
.sk-pts { background: rgba(14,32,46,.72); color: #FFE08A; border: 1px solid rgba(255,224,138,.45); border-radius: 999px; font-size: 12px; font-weight: 800; padding: 4px 12px; }
.sk-btn { background: rgba(14,32,46,.72); color: #CFE3F0; border: 1px solid rgba(255,255,255,.28); border-radius: 999px; font-size: 12.5px; font-weight: 800; padding: 4px 14px; cursor: pointer; }
.sk-btn.on { background: linear-gradient(135deg, #FFB44D, #F5813C); color: #fff; border-color: #FFE08A; box-shadow: 0 0 10px rgba(255,170,60,.6); }
.sk-btn.off { opacity: .42; cursor: default; }
/* 结算构筑行 */
.ov-buff { margin-top: 8px; text-align: center; color: #FFD9A8; font-size: 13px; background: rgba(255,217,168,.1); border-radius: 999px; padding: 6px 18px; }
/* P2 强化卡弹层（PC 用 shop-mask 承载） */
.buff-panel-pc { max-width: 420px; }
.buff-title-pc { text-align: center; color: #FFE08A; font-size: 16px; font-weight: 800; margin-bottom: 14px; }
.buff-grid-pc { display: flex; flex-direction: column; gap: 10px; }
.buff-card-pc { display: flex; align-items: center; gap: 14px; text-align: left; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.16); border-radius: 12px; padding: 12px 16px; cursor: pointer; color: #fff; }
.buff-card-pc:hover { border-color: #FFE08A; transform: scale(1.01); }
.buff-card-pc b { display: block; font-size: 14.5px; }
.buff-card-pc i { display: block; font-style: normal; font-size: 12px; color: rgba(255,255,255,.62); margin-top: 2px; }
.bc-icon-pc { font-size: 26px; width: 34px; text-align: center; }
.buff-skip-pc { margin: 14px auto 0; display: block; background: transparent; border: none; color: rgba(255,255,255,.55); font-size: 12.5px; cursor: pointer; }
/* P3 街机 */
.arcade-go { margin-top: 10px; width: 100%; background: linear-gradient(135deg, #2A4A66, #1B3550); color: #CFE3F0; border: 1px solid rgba(157,184,204,.45); border-radius: 10px; font-size: 14px; font-weight: 700; padding: 12px; cursor: pointer; }
.arcade-go:hover { filter: brightness(1.15); }
.ar-card { max-width: 760px; margin: 0 auto; }
.ar-score-row { display: flex; align-items: baseline; justify-content: space-between; margin: 10px 2px 4px; }
.ar-score { color: #FFE08A; font-size: 30px; font-weight: 800; }
.ar-score i { font-style: normal; font-size: 13px; margin-left: 4px; color: rgba(255,224,138,.7); }
.ar-combo { color: #CFE3F0; font-size: 14px; font-weight: 700; }
.ar-combo.x15 { color: #FFD34E; }
.ar-combo.x2 { color: #FF9E6B; text-shadow: 0 0 10px rgba(255,158,107,.5); }
.gq-time.warn { color: #FF6B5A; }
.gq-timefill.warn { background: linear-gradient(90deg, #FF9E8A, #EC7063); }
.ar-best { text-align: center; color: #CFE3F0; font-size: 14px; margin-bottom: 10px; }
.ar-best.new { color: #FFD34E; font-weight: 800; }

/* ============================================================
   二十五轮 回退（用户令）：人物回归像素画、游戏背景回归草地场景。
   二十四轮「暗影竞技场」深色沉浸风试用后用户不满意 → 本段用恢复声明
   把场景/站位/HUD 覆盖回十九~二十二轮观感（明亮草地 + 玻璃拟态 HUD）。
   角色像素化：game-svg.js MedGameSvg.enabled=false（views/game.js scale 已回退）。
   ============================================================ */
/* ---- 1. 场景回归：天空渐变 → 草地渐变（十九轮观感） ---- */
.gba-screen { background: #1B1B1F; border: 1px solid #2E4256; border-radius: 16px; padding: 8px; box-shadow: 0 10px 24px rgba(20,40,60,.22); }
.gba-scene { position: relative; height: 400px; border-radius: 10px; overflow: hidden; box-shadow: none;
  background: url('/assets/cast/pxbg_battle.png?v=3') center/100% 100% no-repeat, linear-gradient(180deg, #6BB8E4 0%, #9BD6EE 26%, #CDEEF7 40%, #CDEEF7 40.5%, #86CC72 40.5%, #6DB65F 72%, #57A24E 100%); }
.gba-scene::after { content: ''; position: absolute; inset: 0; top: auto; bottom: auto; left: 0; right: 0; height: auto;
  background: radial-gradient(ellipse at center, rgba(0,0,0,0) 52%, rgba(10,32,22,.30) 100%);
  transform: none; pointer-events: none; }
/* ---- 2. 装饰回归：太阳光晕 / 圆顶远山 / 白云 / 灌木 / 小花 / 前景草丛 ---- */
.gba-sun { position: absolute; z-index: 0; right: 8%; top: 6px; width: 75px; height: 75px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,246,200,.95) 0 22%, rgba(255,240,170,.35) 45%, transparent 70%);
  clip-path: none; filter: none; animation: none; }
.gba-sun::after { content: none; }
.gba-hill { position: absolute; z-index: 0; border-radius: 50% 50% 0 0; background: #63A854; clip-path: none; opacity: .9; }
.gba-hill.h1 { left: -12%; bottom: 46%; width: 62%; height: 48px; }
.gba-hill.h2 { right: -16%; bottom: 46%; width: 70%; height: 39px; background: #6FB35E; opacity: .75; }
.gba-cloud { position: absolute; z-index: 1; width: 60px; height: 10px; border-radius: 999px;
  background: rgba(255,255,255,.9); box-shadow: inset -3px -2px 0 rgba(190,225,240,.9); animation: cloudDriftPc 24s ease-in-out infinite alternate; }
.gba-cloud.c1 { left: 8%; top: 15px; }
.gba-cloud.c2 { left: 58%; top: 28px; animation-duration: 32s; animation-direction: alternate-reverse; }
.gba-bush { position: absolute; z-index: 1; width: 38px; height: 19px; border-radius: 50% 50% 42% 42%;
  background: #5FA84E; box-shadow: inset -4px -5px 0 rgba(74,130,62,.55); animation: none; }
.gba-bush.b1 { left: 5%; top: 76px; }
.gba-bush.b2 { right: 30%; top: 48px; width: 28px; height: 15px; }
.gba-flower { position: absolute; z-index: 1; width: 8px; height: 8px; border-radius: 50%;
  background: #F5D77A; box-shadow: 11px 4px 0 #F08A8A, -9px 6px 0 #fff; animation: none; }
.gba-flower.f1 { right: 7%; bottom: 64px; top: auto; }
.gba-tuft { position: absolute; z-index: 2; bottom: 4px; width: 56px; height: 20px; pointer-events: none;
  background: radial-gradient(ellipse at 50% 100%, rgba(46,96,52,.55) 0 60%, transparent 72%); }
.gba-tuft.t1 { left: -6px; } .gba-tuft.t2 { right: -6px; }
/* ---- 3. 站位回归（2026-10-17 晚再改）：草地圆环去掉（用户要求），pad 只当定位锚 ---- */
.gba-mon-pad, .gba-hero-pad { background: none; }
/* 三十三轮补漏（3D 立绘配平）：场景加高 332→400。旧几何下脚底线 y=196 是
   像素小人时代定的，3D 立绘高 200~258px，头顶必然越过场景顶被 overflow:hidden 裁掉
   （实锤：细菌君/萝卜头顶被平切）。现：怪兽脚 250 / 主角脚 330，头顶均有富余，
   且都避开 HP 卡（12~44）与技能条（bottom:76 → 284~324）。 */
.gba-mon-pad { top: 194px; right: 48px; width: 190px; height: 88px; z-index: 3; }
.gba-hero-pad { bottom: 118px; left: 48px; width: 190px; height: 76px; z-index: 3; background: none; }
.gba-hero-pad-ring, .gba-mon-pad-ring { display: none; }
/* 三十三轮：移除 filter（同上，会让立绘不渲染） */
/* ---- 4. HUD 回归：玻璃拟态深色卡（二十二轮观感） ---- */
/* ---- 4. HUD：双血量卡严格同高同宽（二十六轮：用户反馈两张卡高度不一致显乱） ---- */
/* 二十七轮：名字+血量同一排（单行卡），主角卡在左、怪兽卡在右，各在自己角色上方 */
.gba-enemy-box, .gba-hero-box { background: rgba(14,32,46,.55); border: 1px solid rgba(255,255,255,.20);
  border-radius: 10px; box-shadow: 0 8px 22px rgba(8,28,20,.30); backdrop-filter: none;
  height: 32px; width: 206px; padding: 0 10px; box-sizing: border-box;
  display: flex; flex-direction: row; align-items: center; gap: 8px; }
.gba-enemy-box { top: 12px; right: 12px; left: auto; z-index: 5; }   /* 怪兽（NPC）在右侧；left:auto 必须显式，否则旧定义的 left 优先导致两卡重叠 */
.gba-hero-box { top: 12px; left: 12px; right: auto; z-index: 5; }     /* 主角在左侧 */
.geb-row, .ghb-row { display: flex; align-items: baseline; gap: 8px; flex-shrink: 0; }
.geb-name { color: #F2F8FF; font-size: 14px; font-weight: 800; letter-spacing: 0; }
.geb-lv { color: #FFE08A; background: rgba(255,224,138,.16); border: none; border-radius: 999px; padding: 1px 9px; font-size: 11px; }
.geb-hp-row { display: flex; align-items: center; gap: 7px; margin-top: 0; flex-shrink: 0; }
.geb-hp-tag, .ghb-hp-tag { display: inline-block; background: rgba(255,255,255,.14); color: #CFE3F0; border-radius: 4px; font-size: 9px; font-weight: 800; letter-spacing: 1px; padding: 2px 5px; flex-shrink: 0; }   /* 二十七轮：单行卡去掉 HP 文字标签，血条颜色已表意 */
.ghb-name { color: #FFD9A8; font-size: 14px; font-weight: 800; letter-spacing: 0; }
.ghb-lv { color: #FFE08A; background: rgba(255,224,138,.16); border: none; border-radius: 999px; padding: 1px 9px; font-size: 11px; }
.hp-seg { width: 8px; height: 12px; border-radius: 3px; background: rgba(255,255,255,.16); box-shadow: inset 0 1px 1px rgba(0,0,0,.3); }
.hp-seg.on { background: linear-gradient(180deg, #6BE8A0, #2FBF7F); box-shadow: 0 0 5px rgba(111,232,160,.45); }
.hp-segs.mid .hp-seg.on { background: linear-gradient(180deg, #FFE08A, #F5B942); box-shadow: 0 0 5px rgba(245,185,66,.45); }
.hp-segs.low .hp-seg.on { background: linear-gradient(180deg, #FF9E8A, #EC7063); box-shadow: 0 0 5px rgba(236,112,99,.5); }
/* 心格与怪兽血条第二行同基线（都贴卡底） */
.hp-segs.hero { gap: 4px; margin-top: 0; align-items: center; flex-shrink: 0; }
.hp-segs.hero .hp-seg { width: 16px; height: 11px; border-radius: 4px 4px 6px 6px; }
.hp-segs.hero .hp-seg.on { background: linear-gradient(180deg, #FF9E6B, #E8452F); box-shadow: 0 0 9px rgba(232,69,47,.55); }
.hp-segs.hero.low .hp-seg.on { background: linear-gradient(180deg, #FF6B5A, #C81E1E); }
/* ---- 5. 对话框 + 技能条（二十六轮：场景压低、技能栏收窄为底部居中条） ---- */
.gba-dialog { left: 50%; right: auto; transform: translateX(-50%); bottom: 10px; width: calc(100% - 24px); max-width: 420px;
  background: #16303C; border: 3px solid #2FBF8F; border-radius: 10px; box-shadow: inset 0 0 0 3px #0F2430;
  color: #EAF6F6; font-size: 14px; font-weight: 600; line-height: 1.5; padding: 12px 16px; min-height: 56px;
  display: flex; align-items: center; text-align: center; backdrop-filter: none; }
/* 技能栏：底部居中的一条（不再悬场景中间），技能点前置为徽章 */
.gba-skills { position: absolute; left: 50%; transform: translateX(-50%); bottom: 76px; right: auto; z-index: 2;
  display: flex; align-items: center; gap: 6px; backdrop-filter: none;
  background: rgba(14,32,46,.55); border: 1px solid rgba(255,255,255,.18); border-radius: 999px; padding: 4px 6px 4px 4px; }
.sk-pts { background: rgba(255,224,138,.18); color: #FFE08A; border: none; border-radius: 999px; font-size: 12px; font-weight: 800; padding: 4px 12px; backdrop-filter: none; white-space: nowrap; flex-shrink: 0; }
.sk-btn { background: rgba(255,255,255,.07); color: #CFE3F0; border: 1px solid rgba(255,255,255,.16); border-radius: 999px; font-size: 12px; font-weight: 700; padding: 4px 16px; backdrop-filter: none; white-space: nowrap; flex-shrink: 0; }
.sk-btn.on { background: linear-gradient(135deg, #FFB44D, #F5813C); border-color: #FFE08A; color: #fff; }
/* ---- 6. 题卡/结算/街机回归二十二轮深色 HUD ---- */
.gq-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 18px; box-shadow: var(--shadow); }
.gq-idx { color: var(--ink-3); font-size: 12px; font-weight: 400; letter-spacing: 0; }
.gq-img { border: 1px solid var(--line); box-shadow: none; background: #0B1B21; }
.gq-stem { color: var(--ink); }
.gq-opt { background: #FAFBFC; border: 1px solid var(--line); color: var(--ink); }
.gq-opt:hover { border-color: #E0A63C; background: #FAFBFC; }
.gq-opt-key { background: #E9EFF1; color: var(--ink-2); border: none; }
.gq-opt.right { background: #E7F6EF; border-color: #1C8A6B; }
.gq-opt.right .gq-opt-key { background: #1C8A6B; color: #fff; }
.gq-opt.wrong { background: #FDECEC; border-color: #d9534f; }
.gq-opt.wrong .gq-opt-key { background: #d9534f; color: #fff; }
.gq-time { color: var(--ink-2); }
.gq-timebar { background: #E9EFF1; }
.gq-timefill { background: linear-gradient(90deg, #F5C463, #E0A63C); }
.over-card, .ar-card { background: var(--card); border: 1px solid var(--line); color: var(--ink); box-shadow: var(--shadow); }
.over-title { color: var(--ink); }
.over-desc { color: var(--ink-2); }
.ov-pill { background: #FAF8F5; border: 1px solid var(--line); color: var(--ink-2); }
.ov-pill.gold { color: #B07818; border-color: rgba(224,166,60,.4); }
.ar-score { color: var(--ink); }
.ar-combo { color: var(--ink-2); }
.ov-star { color: rgba(31,41,55,.16); }

/* 二十五轮回退补充：角色层不吃点击，避免贴地技能条被角色遮挡的区域点不到 */
.gba-mon-pad, .gba-hero-pad, .gba-mon, .gba-hero, .gba-hero-pad-ring, .gba-mon-pad-ring { pointer-events: none; }

/* 二十八轮：双血条不互压（卡宽收窄）+ 角色色 accent 边增强归属 */
.gba-enemy-box { border-left: 3px solid rgba(94,214,190,.75); }
.gba-hero-box { border-left: 3px solid rgba(255,158,107,.85); }
.hp-seg { width: 6px; height: 11px; border-radius: 3px; }

/* 三十轮：主角卡 HP 行（与怪兽 geb-hp-row 对称，卡继续压矮） */
.ghb-hp-row { display: flex; align-items: center; gap: 8px; margin-top: 0; min-width: 0; }

/* ---------- 体验官徽章（三十三轮） ---------- */
.reviewer-badge {
  display: inline-block; margin-left: 6px; padding: 2px 9px;
  font-size: 11px; line-height: 17px; font-weight: 700; color: #7A3A00;
  background: linear-gradient(135deg, #FFD98A, #FFB35C);
  border-radius: 999px; vertical-align: middle;
  box-shadow: 0 1px 4px rgba(255, 160, 60, 0.35);
}

/* ---------- 体验官能力清单（内测中心） ---------- */
.ability-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.ability-item {
  flex: 1 1 46%; display: flex; align-items: center; gap: 8px;
  background: #FFF7EC; border: 1px solid #FFE3B8; border-radius: 10px;
  padding: 10px 12px; font-size: 13px; color: #7A3A00; font-weight: 600;
}

/* ============ DNA 双螺旋加载（三十四轮·三端统一） ============ */
.dna-helix { display: flex; gap: 6px; align-items: center; height: 48px; }
.dna-helix span {
  width: 8px; height: 8px; border-radius: 50%;
  animation: dna-bounce 1.2s ease-in-out infinite;
}
.dna-helix span:nth-child(odd)  { background: #6c63ff; }
.dna-helix span:nth-child(even) { background: #e879f9; animation-name: dna-bounce-inv; }
@keyframes dna-bounce {
  0%, 100% { transform: translateY(-12px) scale(.7); }
  50%      { transform: translateY(12px) scale(1); }
}
@keyframes dna-bounce-inv {
  0%, 100% { transform: translateY(12px) scale(1); }
  50%      { transform: translateY(-12px) scale(.7); }
}
.dna-spin-wrap { display: flex; flex-direction: column; align-items: center; padding: 20px 0; }
.dna-spin-label { font-size: 12px; color: var(--ink-3); margin-top: 4px; }

/* ============================================================
   特效 V2（2026-10-17 晚）：战斗演出极致化 —— 用户要求"当游戏来做"
   编排：主角蓄势→疾冲→(命中帧)月牙斩+星闪+像素碎屑+伤害数字+怪兽击退+震屏→弹回
   入场：怪兽空降+主角滑入；死亡：白闪→弹起→旋转坠地+尘土；答错：怪兽扑击+爪痕
   约束：全部 transform/opacity（filter 会让立绘 PNG 不渲染，见 1509 行血泪）；
        本段追加在文件末尾，覆盖上文同名规则（atk-move/mon-hit/shake/mon-taunt/mon-die）
   ============================================================ */
/* -- 主角待机呼吸（活体感；攻击时被 atk-move 覆盖） -- */
.gba-hero { animation: heroBobPc 2.6s ease-in-out infinite; }
@keyframes heroBobPc { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
/* -- 主角攻击序列：蓄势下蹲 → 疾冲 → 出拳定帧 → 弹回 -- */
.gba-hero.atk-move { animation: heroAtkPc .46s cubic-bezier(.3,.6,.4,1); }
@keyframes heroAtkPc {
  0%   { transform: translate(0,0) scale(1,1); }
  14%  { transform: translate(-5px,3px) scale(1.08,.9); }
  32%  { transform: translate(102px,0) scale(.92,1.1); }
  40%  { transform: translate(97px,-3px) scale(1.05,1.03); }
  62%  { transform: translate(92px,0) scale(1,1); }
  100% { transform: translate(0,0) scale(1,1); }
}
/* 冲刺残影线（主角身后拉出 3 条速度线） */
.gba-dashline { position: absolute; z-index: 6; left: 4%; top: 52%; width: 130px; height: 22px; opacity: 0; pointer-events: none; }
.gba-dashline::before, .gba-dashline::after, .gba-dashline i {
  content: ''; position: absolute; left: 0; height: 4px; border-radius: 999px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.9));
}
.gba-dashline::before { top: 0; width: 100%; }
.gba-dashline i { top: 9px; width: 72%; opacity: .8; }
.gba-dashline::after { top: 18px; width: 52%; opacity: .6; }
.gba-dashline.on { animation: dashlinePc .34s ease-out; }
@keyframes dashlinePc { 0% { opacity: 0; transform: scaleX(.3); } 30% { opacity: .95; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1.5) translateX(36px); } }
/* -- 月牙斩（命中位：双层弧Gold+白核，旋转收尾） -- */
.gba-slash2 { position: absolute; z-index: 9; left: 69%; top: 59.5%; width: 124px; height: 124px; margin: -62px 0 0 -62px; opacity: 0; pointer-events: none; }
.gba-slash2::before { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 8px solid transparent; border-right-color: #FFD86B; border-bottom-color: #FFE9B0; transform: rotate(-42deg); }
.gba-slash2::after { content: ''; position: absolute; inset: 11px; border-radius: 50%; border: 6px solid transparent; border-right-color: #fff; border-bottom-color: #fff; transform: rotate(-42deg); }
.gba-slash2.on { animation: slashArcPc .32s ease-out; }
@keyframes slashArcPc { 0% { opacity: 0; transform: scale(.35) rotate(-50deg); } 30% { opacity: 1; transform: scale(1.05) rotate(-8deg); } 100% { opacity: 0; transform: scale(1.22) rotate(26deg); } }
/* -- 命中星闪（4 角星，先白后金双层） -- */
.gba-impact { position: absolute; z-index: 9; left: 69%; top: 59.5%; width: 66px; height: 66px; margin: -33px 0 0 -33px; opacity: 0; pointer-events: none; }
.gba-impact::before { content: ''; position: absolute; inset: 0; background: #FFD86B; clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); }
.gba-impact::after { content: ''; position: absolute; inset: 13px; background: #fff; clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%); }
.gba-impact.on { animation: impactPopPc .26s ease-out; }
@keyframes impactPopPc { 0% { opacity: 0; transform: scale(.2) rotate(0); } 32% { opacity: 1; transform: scale(1.12) rotate(20deg); } 100% { opacity: 0; transform: scale(.55) rotate(42deg); } }
/* -- 像素碎屑（10 枚方形屑，径向炸开；CSS 变量定向） -- */
.gba-debris { position: absolute; z-index: 9; left: 69%; top: 59.5%; width: 0; height: 0; pointer-events: none; }
.gba-debris .d { position: absolute; left: 0; top: 0; width: 7px; height: 7px; opacity: 0; }
.gba-debris .d:nth-child(odd) { background: #FFE08A; }
.gba-debris .d:nth-child(3n) { background: #fff; }
.gba-debris .d:nth-child(3n+2) { background: #F5A623; }
.gba-debris .d1 { --dx: 52px;  --dy: -64px; --rot: 220deg; }
.gba-debris .d2 { --dx: -40px; --dy: -70px; --rot: -180deg; }
.gba-debris .d3 { --dx: 74px;  --dy: -18px; --rot: 300deg; }
.gba-debris .d4 { --dx: -66px; --dy: -30px; --rot: -240deg; }
.gba-debris .d5 { --dx: 30px;  --dy: -88px; --rot: 160deg; }
.gba-debris .d6 { --dx: -22px; --dy: -92px; --rot: -200deg; }
.gba-debris .d7 { --dx: 60px;  --dy: 26px;  --rot: 260deg; }
.gba-debris .d8 { --dx: -58px; --dy: 18px;  --rot: -260deg; }
.gba-debris .d9 { --dx: 6px;   --dy: -100px; --rot: 190deg; }
.gba-debris .d10 { --dx: -84px; --dy: -8px; --rot: -300deg; }
.gba-debris.on .d { animation: debrisPc .62s cubic-bezier(.12,.62,.4,1) forwards; }
.gba-debris.on .d:nth-child(even) { animation-delay: .04s; }
@keyframes debrisPc {
  0% { opacity: 0; transform: translate(0,0) rotate(0) scale(1); }
  12% { opacity: 1; }
  100% { opacity: 0; transform: translate(var(--dx), var(--dy)) rotate(var(--rot)) scale(.55); }
}
/* -- 伤害数字（像素描边大字，上飘） -- */
.gba-dmg { position: absolute; z-index: 9; left: 69%; top: 38%; width: 90px; margin-left: -45px; text-align: center; font-size: 30px; font-weight: 900; font-style: italic; color: #fff; opacity: 0; pointer-events: none; text-shadow: 0 3px 0 #B3541E, 0 0 14px rgba(255,180,60,.7); -webkit-text-stroke: 1.5px #8A3A12; }
.gba-dmg.on { animation: dmgPopPc .8s ease-out; }
@keyframes dmgPopPc { 0% { opacity: 0; transform: translateY(8px) scale(.4); } 16% { opacity: 1; transform: translateY(-7px) scale(1.3); } 36% { transform: translateY(-3px) scale(1); } 62% { opacity: 1; transform: translateY(-16px) scale(1); } 100% { opacity: 0; transform: translateY(-42px) scale(.94); } }
/* -- 怪兽被击退（位移+微旋+回弹，取代原 mon-hit 左右抖） -- */
.gba-mon-pad.mon-hit { animation: monKbPc .4s cubic-bezier(.2,.7,.4,1); }
@keyframes monKbPc { 0% { transform: translate(0,0) rotate(0); } 22% { transform: translate(26px,-7px) rotate(4deg); } 50% { transform: translate(13px,2px) rotate(-2deg); } 76% { transform: translate(-3px,0) rotate(0); } 100% { transform: translate(0,0); } }
/* -- 震屏升级：带 zoom punch -- */
.gba-screen.shake { animation: screenShakePc .32s ease; }
@keyframes screenShakePc { 0% { transform: translate(0,0) scale(1); } 16% { transform: translate(-5px,4px) scale(1.016); } 38% { transform: translate(5px,-3px) scale(1.009); } 64% { transform: translate(-3px,2px) scale(1); } 100% { transform: translate(0,0) scale(1); } }
/* -- 怪兽扑击（答错：左扑咬向主角，取代原 taunt 小跳） -- */
.gba-mon-pad.mon-taunt { animation: monAtkPc .52s cubic-bezier(.25,.6,.35,1); }
@keyframes monAtkPc { 0% { transform: translate(0,0); } 30% { transform: translate(-128px,6px) scale(1.05); } 44% { transform: translate(-116px,2px); } 100% { transform: translate(0,0); } }
/* 爪痕（主角位：三道红痕闪现） */
.gba-claw { position: absolute; z-index: 9; left: 31%; top: 59.5%; width: 84px; height: 84px; margin: -42px 0 0 -42px; opacity: 0; pointer-events: none; }
.gba-claw::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(115deg, transparent 0 13px, rgba(232,69,47,.95) 13px 21px, transparent 21px 34px); clip-path: polygon(0 14%, 100% 0, 82% 86%, 8% 100%); }
.gba-claw.on { animation: clawPc .4s ease-out; }
@keyframes clawPc { 0% { opacity: 0; transform: scale(.6) translateX(34px); } 28% { opacity: 1; transform: scale(1) translateX(0); } 100% { opacity: 0; transform: scale(1.08) translateX(-16px); } }
/* 主角受击后退（答错） */
.gba-hero.hero-kb { animation: heroKbPc .4s ease-out; }
@keyframes heroKbPc { 0% { transform: translate(0,0) rotate(0); } 26% { transform: translate(-20px,2px) rotate(-5deg); } 60% { transform: translate(-8px,0) rotate(-2deg); } 100% { transform: translate(0,0) rotate(0); } }
/* -- 入场演出：怪兽空降弹跳 / 主角左侧滑入 -- */
.gba-mon-pad.enter-mon { animation: monEnterPc .56s cubic-bezier(.2,.75,.35,1.1); }
@keyframes monEnterPc { 0% { transform: translateY(-300px); opacity: 0; } 55% { transform: translateY(0); opacity: 1; } 74% { transform: translateY(-16px); } 100% { transform: translateY(0); } }
.gba-hero-pad.enter-hero { animation: heroEnterPc .56s cubic-bezier(.2,.75,.35,1.1) .1s backwards; }
@keyframes heroEnterPc { 0% { transform: translateX(-260px); opacity: 0; } 58% { transform: translateX(0); opacity: 1; } 78% { transform: translateX(-12px); } 100% { transform: translateX(0); } }
/* -- 死亡演出：白闪定帧 → 弹起 → 旋转坠地 -- */
.gba-mon-pad.mon-die .gba-mon { animation: monDiePc .8s ease-in forwards; }
@keyframes monDiePc {
  0% { transform: scale(1) rotate(0); opacity: 1; }
  16% { transform: scale(1.18) rotate(0); opacity: 1; }
  30% { transform: scale(1.18) rotate(0); opacity: .35; }
  42% { transform: scale(1.18) rotate(0); opacity: 1; }
  58% { transform: translateY(-34px) rotate(-12deg); opacity: 1; }
  100% { transform: translateY(52px) rotate(-88deg) scale(.86); opacity: 0; }
}
/* 尘土（死亡落点） */
.gba-dust { position: absolute; z-index: 8; left: 69%; top: 70.5%; width: 150px; height: 34px; margin: -17px 0 0 -75px; opacity: 0; pointer-events: none; }
.gba-dust::before, .gba-dust::after { content: ''; position: absolute; bottom: 0; width: 46px; height: 16px; border-radius: 50%; background: rgba(222,232,210,.85); }
.gba-dust::before { left: 8px; }
.gba-dust::after { right: 8px; width: 34px; height: 12px; opacity: .75; }
.gba-dust.on { animation: dustPc .6s ease-out forwards; }
@keyframes dustPc { 0% { opacity: 0; transform: scale(.3); } 30% { opacity: .95; transform: scale(1.1); } 100% { opacity: 0; transform: scale(1.5) translateY(-6px); } }
/* -- 场景光尘（3 缕微光上浮，常驻循环） -- */
.gba-mote { position: absolute; z-index: 2; width: 5px; height: 5px; background: rgba(255,244,200,.9); border-radius: 1px; opacity: 0; pointer-events: none; box-shadow: 0 0 6px rgba(255,240,180,.8); }
.gba-mote.m1 { left: 22%; bottom: 20%; animation: motePc 7s ease-in-out 1s infinite; }
.gba-mote.m2 { left: 55%; bottom: 12%; width: 4px; height: 4px; animation: motePc 8.5s ease-in-out 3.4s infinite; }
.gba-mote.m3 { left: 78%; bottom: 26%; animation: motePc 9.5s ease-in-out 5.2s infinite; }
@keyframes motePc {
  0% { opacity: 0; transform: translate(0,0) rotate(0); }
  18% { opacity: .9; }
  55% { opacity: .5; transform: translate(16px,-120px) rotate(160deg); }
  100% { opacity: 0; transform: translate(-8px,-230px) rotate(320deg); }
}
/* -- 连击飘字升级（弹跳感更强） -- */
.gba-float.on { animation: floatUpPc .8s cubic-bezier(.2,.8,.3,1.2); }
@keyframes floatUpPc {
  0% { opacity: 0; transform: translateX(-50%) translateY(10px) scale(.5) rotate(-4deg); }
  24% { opacity: 1; transform: translateX(-50%) translateY(-2px) scale(1.28) rotate(2deg); }
  46% { transform: translateX(-50%) translateY(0) scale(1) rotate(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(-42px) scale(1); }
}

/* ============================================================
   游戏 HUD V3（2026-10-17 晚）：答题区/结算全面游戏化 —— "我们在打游戏，不是在学习"
   对齐小程序 ch-q-card 深色 HUD（深海军蓝+鎏金描边+游戏按键选项）；
   本段在文件末尾，覆盖 1690-1711 行「二十五轮回退」的浅色题卡
   ============================================================ */
.gq-card { background: linear-gradient(180deg, #14283A 0%, #0E1E2C 100%); border: 1.5px solid rgba(245,215,122,.28); border-radius: 16px; padding: 16px 18px 18px; box-shadow: 0 14px 30px rgba(8,24,36,.30); }
.gq-idx { color: #9DB8CC; font-size: 12.5px; font-weight: 700; letter-spacing: .5px; }
.gq-time { color: #FFE08A; background: rgba(245,215,122,.12); border: 1px solid rgba(245,215,122,.40); }
.gq-time.warn { color: #fff; background: rgba(236,112,99,.85); border-color: rgba(255,255,255,.5); animation: hpPulsePc .6s ease-in-out infinite; }
.gq-timebar { background: rgba(255,255,255,.10); }
.gq-timefill { background: linear-gradient(90deg, #F5D77A, #E0A63C); }
.gq-timefill.warn { background: linear-gradient(90deg, #FF9E8A, #E8452F); animation: timebarWarnPc .5s ease-in-out infinite; }
@keyframes timebarWarnPc { 0%, 100% { opacity: 1; } 50% { opacity: .55; } }
.gq-img { border: 1px solid rgba(255,255,255,.14); box-shadow: inset 0 0 0 3px rgba(0,0,0,.25); background: #0B1B21; }
.gq-stem { color: #EAF4FB; }
/* 选项 = 游戏按键（深色面 + 鎏金键帽 + 悬停浮起 + 按压位移） */
.gq-opt { background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03)); border: 1px solid rgba(255,255,255,.16); color: #EAF4FB; border-radius: 11px; transition: transform .08s, border-color .12s, background .12s; }
.gq-opt:hover { border-color: rgba(245,215,122,.65); background: linear-gradient(180deg, rgba(245,215,122,.10), rgba(245,215,122,.04)); transform: translateY(-1px); }
.gq-opt:active { transform: translateY(1px) scale(.995); }
.gq-opt-key { background: linear-gradient(180deg, #F5C463, #E0A63C); color: #3A2410; border: none; box-shadow: 0 2px 0 #A66F14; font-weight: 800; }
.gq-opt.right { background: linear-gradient(180deg, rgba(47,191,127,.22), rgba(47,191,127,.10)); border-color: #2FBF7F; animation: optRightPc .4s ease; }
.gq-opt.right .gq-opt-key { background: linear-gradient(180deg, #6BE8A0, #2FBF7F); color: #fff; box-shadow: none; }
.gq-opt.wrong { background: linear-gradient(180deg, rgba(236,112,99,.20), rgba(236,112,99,.08)); border-color: #EC7063; animation: optWrongPc .34s ease; }
.gq-opt.wrong .gq-opt-key { background: #EC7063; color: #fff; box-shadow: none; }
@keyframes optRightPc { 0% { transform: scale(1); } 35% { transform: scale(1.015); } 100% { transform: scale(1); } }
@keyframes optWrongPc { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 55% { transform: translateX(4px); } 80% { transform: translateX(-2px); } }
/* 结算/街机：深色 HUD 卡 */
.over-card, .ar-card { background: linear-gradient(180deg, #14283A 0%, #0E1E2C 100%); border: 1.5px solid rgba(245,215,122,.28); color: #EAF4FB; box-shadow: 0 14px 30px rgba(8,24,36,.30); }
.over-title { color: #FFE08A; }
.over-title.lose { color: #CFE3F0; }
.over-desc { color: #B9CFDE; }
.over-points { color: #FFE08A; }
.ov-pill { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.18); color: #CFE3F0; }
.ov-pill.gold { color: #FFE08A; border-color: rgba(245,215,122,.45); background: rgba(245,215,122,.10); }
.ar-score { color: #FFE08A; }
.ar-combo { color: #9DB8CC; }
/* 星级逐颗弹跳点亮 */
.ov-star { color: rgba(255,255,255,.18); }
.ov-star.on { color: #FFD34E; text-shadow: 0 0 14px rgba(255,211,78,.55); animation: starPopPc .45s cubic-bezier(.2,.8,.3,1.4) backwards; }
.ov-star.on:nth-child(2) { animation-delay: .16s; }
.ov-star.on:nth-child(3) { animation-delay: .32s; }
@keyframes starPopPc { 0% { transform: scale(0) rotate(-30deg); } 62% { transform: scale(1.35) rotate(8deg); } 100% { transform: scale(1) rotate(0); } }
/* -- 连击氛围火：场景金光随连击档位点亮（≥3 一档 / ≥6 二档） -- */
.gba-combofire { position: absolute; inset: 0; z-index: 9; pointer-events: none; }
.gba-combofire::before { content: ''; position: absolute; inset: 0; opacity: 0; transition: opacity .35s; box-shadow: inset 0 0 70px 12px rgba(255,180,60,.30); }
.gba-combofire.t1::before { opacity: 1; animation: firePulsePc 1.5s ease-in-out infinite; }
.gba-combofire.t2::before { opacity: 1; box-shadow: inset 0 0 95px 22px rgba(255,120,50,.42); animation: firePulsePc .9s ease-in-out infinite; }
@keyframes firePulsePc { 0%, 100% { opacity: .5; } 50% { opacity: 1; } }

/* ============================================================
   游戏感 V4（2026-10-17 晚）：奖励反馈 + 地图成长感 + 出题节奏 + 答案揭晓
   ============================================================ */
/* -- 像素金币：答对从怪兽身上蹦出 4 枚（抛物线+旋转+落地消失） -- */
.gba-coins { position: absolute; z-index: 9; left: 69%; top: 48%; width: 0; height: 0; pointer-events: none; }
.gba-coins .c { position: absolute; left: -7px; top: -7px; width: 13px; height: 13px; border-radius: 50%; opacity: 0;
  background: radial-gradient(circle at 35% 30%, #FFF3C4, #FFD34E 55%, #D99A1F);
  box-shadow: inset -2px -2px 0 rgba(160,100,10,.55), 0 0 6px rgba(255,210,90,.6); }
.gba-coins.on .c1 { animation: coin1Pc .6s cubic-bezier(.2,.6,.5,1) forwards; }
.gba-coins.on .c2 { animation: coin2Pc .6s cubic-bezier(.2,.6,.5,1) .05s forwards; }
.gba-coins.on .c3 { animation: coin3Pc .6s cubic-bezier(.2,.6,.5,1) .1s forwards; }
.gba-coins.on .c4 { animation: coin4Pc .6s cubic-bezier(.2,.6,.5,1) .15s forwards; }
@keyframes coin1Pc { 0% { opacity: 0; transform: translate(0,0) scale(.4) rotate(0); } 12% { opacity: 1; } 52% { transform: translate(34px,-54px) rotate(200deg); } 100% { opacity: 0; transform: translate(56px,4px) rotate(400deg) scale(.85); } }
@keyframes coin2Pc { 0% { opacity: 0; transform: translate(0,0) scale(.4) rotate(0); } 12% { opacity: 1; } 52% { transform: translate(-26px,-62px) rotate(-220deg); } 100% { opacity: 0; transform: translate(-44px,6px) rotate(-420deg) scale(.85); } }
@keyframes coin3Pc { 0% { opacity: 0; transform: translate(0,0) scale(.4) rotate(0); } 12% { opacity: 1; } 52% { transform: translate(52px,-26px) rotate(240deg); } 100% { opacity: 0; transform: translate(74px,18px) rotate(440deg) scale(.85); } }
@keyframes coin4Pc { 0% { opacity: 0; transform: translate(0,0) scale(.4) rotate(0); } 12% { opacity: 1; } 52% { transform: translate(-8px,-70px) rotate(-200deg); } 100% { opacity: 0; transform: translate(-14px,2px) rotate(-400deg) scale(.85); } }
/* -- 选项依次弹入（每题重新渲染自动重放；街机同享） -- */
.gq-opt { animation: optInPc .26s cubic-bezier(.2,.8,.3,1.2) backwards; }
.gq-opt:nth-child(2) { animation-delay: .05s; }
.gq-opt:nth-child(3) { animation-delay: .1s; }
.gq-opt:nth-child(4) { animation-delay: .15s; }
@keyframes optInPc { 0% { opacity: 0; transform: translateX(26px) scale(.96); } 100% { opacity: 1; transform: translateX(0) scale(1); } }
/* -- 答错揭示正确答案（绿框 + ✓ 正确 章） -- */
.gq-opt.reveal { position: relative; border-color: #2FBF7F; background: linear-gradient(180deg, rgba(47,191,127,.14), rgba(47,191,127,.05)); }
.gq-opt.reveal::after { content: '✓ 正确'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%); font-size: 12px; font-weight: 800; color: #1C8A6B; background: #E7F6EF; border: 1px solid #B8E2D0; padding: 2px 8px; border-radius: 999px; }
/* -- 地图节点：GO! 跳动 + Boss 皇冠红底 -- */
.stage-cell.next .stage-state { display: inline-block; animation: goBouncePc 1s ease-in-out infinite; }
@keyframes goBouncePc { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
.stage-cell.boss { background: linear-gradient(160deg, #FFF1E4, #FFE2C4); border-color: #E8A34B; }
.stage-cell.boss .stage-no { color: #B3541E; }
.stage-cell.boss .stage-state { color: #C0392B; font-weight: 800; }
.stage-cell.boss.done { background: linear-gradient(180deg, #EAF9F1, #DFF3E9); border-color: #B5E0CB; }
.stage-cell.boss.done .stage-no, .stage-cell.boss.done .stage-state { color: #1C8A6B; }
.boss-crown { display: inline-block; margin-right: 3px; font-size: 12px; animation: crownFloatPc 2.2s ease-in-out infinite; }
@keyframes crownFloatPc { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }

/* ============================================================
   游戏感 V5（2026-10-17 晚）：时间压迫 + 胜利庆祝 + 受击红闪
   ============================================================ */
/* 受击红闪（答错：整个游戏屏蒙一层红，瞬间痛感） */
.gba-screen.dmg-flash::after { content: ''; position: absolute; inset: 0; border-radius: 16px; background: rgba(232, 69, 47, .20); animation: dmgFlashPc .34s ease-out forwards; pointer-events: none; z-index: 20; }
@keyframes dmgFlashPc { 0% { opacity: 1; } 100% { opacity: 0; } }
/* 胜利结算：金币雨 + 胜利立绘弹跳登场 */
.over-card { position: relative; overflow: hidden; }
.over-hero.win { animation: winBouncePc .62s cubic-bezier(.2, .8, .3, 1.4); }
@keyframes winBouncePc { 0% { transform: scale(.3) rotate(-10deg); opacity: 0; } 55% { transform: scale(1.14) rotate(4deg); opacity: 1; } 100% { transform: scale(1) rotate(0); } }
.over-coins { position: absolute; top: -14px; left: 0; right: 0; height: 0; pointer-events: none; }
.over-coins i { position: absolute; top: 0; width: 13px; height: 13px; border-radius: 50%; opacity: 0;
  background: radial-gradient(circle at 35% 30%, #FFF3C4, #FFD34E 55%, #D99A1F);
  box-shadow: inset -2px -2px 0 rgba(160,100,10,.55), 0 0 6px rgba(255,210,90,.6); }
.over-coins i:nth-child(1) { left: 6%;  animation: coinRainPc 1s ease-in .1s forwards; }
.over-coins i:nth-child(2) { left: 18%; animation: coinRainPc 1.1s ease-in .28s forwards; }
.over-coins i:nth-child(3) { left: 31%; animation: coinRainPc .95s ease-in .16s forwards; }
.over-coins i:nth-child(4) { left: 44%; animation: coinRainPc 1.15s ease-in .4s forwards; }
.over-coins i:nth-child(5) { left: 57%; animation: coinRainPc 1s ease-in .22s forwards; }
.over-coins i:nth-child(6) { left: 69%; animation: coinRainPc 1.12s ease-in .46s forwards; }
.over-coins i:nth-child(7) { left: 81%; animation: coinRainPc .98s ease-in .34s forwards; }
.over-coins i:nth-child(8) { left: 92%; animation: coinRainPc 1.08s ease-in .52s forwards; }
@keyframes coinRainPc { 0% { opacity: 0; transform: translateY(0) rotate(0); } 14% { opacity: 1; } 100% { opacity: 0; transform: translateY(430px) rotate(520deg); } }

/* ============================================================
   游戏感 V6（2026-10-17 晚）：画面纵深 + 主机质感
   背景"活"起来（云漂移/前景草摇摆）+ CRT 扫描线 + 进战斗淡入转场
   ============================================================ */
/* -- 漂移云层：半透明白云在背景图之上、角色之后缓慢移动（z1 < pads z3） -- */
.gba-cloud { position: absolute; z-index: 1; height: 9px; border-radius: 999px; pointer-events: none;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(228,244,252,.72));
  box-shadow: inset -3px -2px 0 rgba(180,220,240,.5); }
/* V7：场景改为叙事舞台（房+地牢门），天空只剩顶部条带——云挪进天空带 */
.gba-cloud.c1 { width: 64px; left: 14%; top: 2.5%; animation: cloudDriftV6 46s ease-in-out infinite alternate; }
.gba-cloud.c2 { width: 44px; left: 52%; top: 5.5%; height: 7px; animation: cloudDriftV6 62s ease-in-out infinite alternate-reverse; }
.gba-cloud.c3 { width: 34px; left: 76%; top: 2%; height: 6px; opacity: .8; animation: cloudDriftV6 54s ease-in-out 6s infinite alternate; }
@keyframes cloudDriftV6 { from { transform: translateX(-30px); } to { transform: translateX(46px); } }
/* -- 前景草丛：底部两团深绿近景，在角色之前（z5），轻轻摇摆 -- */
.gba-fgrass { position: absolute; z-index: 5; bottom: -7px; width: 96px; height: 27px; pointer-events: none;
  background: radial-gradient(ellipse at 50% 100%, #3E7A34 0 52%, rgba(46,96,52,.85) 70%, transparent 74%);
  transform-origin: 50% 100%; }
.gba-fgrass.g1 { left: -16px; animation: grassSwayPc 3.4s ease-in-out infinite; }
.gba-fgrass.g2 { right: -20px; width: 118px; height: 31px; animation: grassSwayPc 4.1s ease-in-out .6s infinite reverse; }
@keyframes grassSwayPc { 0%, 100% { transform: rotate(-1.6deg); } 50% { transform: rotate(1.9deg); } }
/* -- CRT 扫描线：掌机屏幕质感（极淡横纹覆盖整个游戏屏） -- */
.gba-screen::before { content: ''; position: absolute; inset: 0; z-index: 30; pointer-events: none; border-radius: 16px;
  background: repeating-linear-gradient(180deg, rgba(4,10,8,.10) 0 1px, transparent 1px 3px); opacity: .42; }
/* -- 进战斗淡入转场（配合入场演出） -- */
.gba-scene.enter { animation: sceneInPc .45s ease-out; }
@keyframes sceneInPc { 0% { opacity: 0; transform: scale(1.035); } 100% { opacity: 1; transform: scale(1); } }

/* ============================================================
   打击感 V8（2026-10-17 晚）：人物"火"起来 + 攻击去假
   ① 活体待机：弹跳+挤压拉伸+微旋（1.15s，肉眼可见的呼吸感）
   ② hit-stop 顿帧：命中瞬间全场冻结 75ms 再释放（打击感之魂）
   ③ 冲刺残影：克隆立绘沿冲刺方向漂移消散
   ④ 攻击形变：冲刺前倾 / 怪兽受击压扁 / 扑击腾空 / 受击后仰
   本段在文件末尾，覆盖 V2/V5 的同名关键帧
   ============================================================ */
/* -- 活体待机 -- */
.gba-hero { animation: heroIdleV8 1.15s ease-in-out infinite; }
@keyframes heroIdleV8 {
  0%, 100% { transform: translateY(0) scale(1, 1) rotate(0); }
  30% { transform: translateY(-4px) scale(.99, 1.03) rotate(-1.4deg); }
  62% { transform: translateY(0) scale(1.02, .98) rotate(.9deg); }
}
.gba-mon { animation: monIdleV8 1.32s ease-in-out infinite; }
@keyframes monIdleV8 {
  0%, 100% { transform: translateY(0) scale(1, 1) rotate(0); }
  35% { transform: translateY(-5px) scale(1.02, .98) rotate(1.5deg); }
  70% { transform: translateY(-1px) scale(.99, 1.02) rotate(-1.1deg); }
}
/* -- hit-stop 顿帧 -- */
.gba-scene.hitstop * { animation-play-state: paused !important; }
/* -- 冲刺残影（JS 克隆立绘注入场景） -- */
.gba-scene .dash-ghost { position: absolute; z-index: 5; opacity: .5; pointer-events: none; margin: 0;
  animation: ghostFadePc .32s ease-out forwards; }
@keyframes ghostFadePc { 0% { opacity: .5; transform: translateX(0); } 100% { opacity: 0; transform: translateX(var(--gx, 40px)); } }
/* -- 主角攻击：后仰蓄势 → 前倾疾冲 → 出拳定帧 → 弹回（覆盖 V2） -- */
.gba-hero.atk-move { animation: heroAtkPc .46s cubic-bezier(.3, .6, .4, 1); }
@keyframes heroAtkPc {
  0%   { transform: translate(0, 0) scale(1, 1) rotate(0); }
  14%  { transform: translate(-5px, 3px) scale(1.08, .9) rotate(-5deg); }
  32%  { transform: translate(102px, 0) scale(.92, 1.1) rotate(10deg); }
  40%  { transform: translate(97px, -3px) scale(1.05, 1.03) rotate(5deg); }
  62%  { transform: translate(92px, 0) scale(1, 1) rotate(0); }
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); }
}
/* -- 怪兽受击：压扁 → 回弹（覆盖 V2 monKbPc） -- */
.gba-mon-pad.mon-hit { animation: monKbPc .42s cubic-bezier(.2, .7, .4, 1); }
@keyframes monKbPc {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  20% { transform: translate(24px, -6px) rotate(4deg) scale(1.12, .8); }
  48% { transform: translate(13px, 3px) rotate(-2deg) scale(.95, 1.06); }
  76% { transform: translate(-3px, 0) rotate(0) scale(1, 1); }
  100% { transform: translate(0, 0) scale(1, 1); }
}
/* -- 怪兽扑击：腾空扑咬弧线（覆盖 V5 monAtkPc） -- */
.gba-mon-pad.mon-taunt { animation: monAtkPc .52s cubic-bezier(.25, .6, .35, 1); }
@keyframes monAtkPc {
  0% { transform: translate(0, 0) rotate(0) scale(1); }
  30% { transform: translate(-128px, -14px) rotate(-8deg) scale(1.08); }
  46% { transform: translate(-118px, 6px) rotate(-3deg) scale(1.02); }
  100% { transform: translate(0, 0) rotate(0) scale(1); }
}
/* -- 主角受击：后仰压扁（覆盖 V5 heroKbPc） -- */
.gba-hero.hero-kb { animation: heroKbPc .42s ease-out; }
@keyframes heroKbPc {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  24% { transform: translate(-22px, 3px) rotate(-8deg) scale(1.08, .88); }
  58% { transform: translate(-9px, 0) rotate(-3deg) scale(.98, 1.03); }
  100% { transform: translate(0, 0) rotate(0) scale(1, 1); }
}
/* -- 受击闪烁升级：三连快闪（覆盖 V2 hitPulsePc） -- */
.gba-mon.hit-flash { animation: hitFlickerPc .3s linear; }
@keyframes hitFlickerPc { 0%, 28%, 60%, 100% { opacity: 1; } 14%, 44% { opacity: .12; } }
/* -- 逼近步伐带惯性（每秒一格平滑滑入） -- */
.gba-mon-pad { transition: transform .32s cubic-bezier(.3, .7, .4, 1.35); }

/* ============================================================
   美化 V9（2026-10-17 晚）：战斗内声音开关 + 接地影 + 待机/攻击姿态收敛（与 mini 同构）
   ============================================================ */
/* -- 战斗内声音开关（题卡头部 ♪ 芯片，与计时器同排） -- */
.gq-head-right { display: inline-flex; align-items: center; gap: 8px; }
.gq-sfx { width: 30px; height: 24px; border-radius: 7px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 800; color: #FFE08A; cursor: pointer;
  background: rgba(245, 215, 122, .12); border: 1px solid rgba(245, 215, 122, .40); padding: 0; }
.gq-sfx:hover { background: rgba(245, 215, 122, .22); }
.gq-sfx.off { color: rgba(157, 184, 204, .55); background: rgba(255, 255, 255, .05); border-color: rgba(255, 255, 255, .14); text-decoration: line-through; }
/* -- 接地影：随待机浮动的软阴影（人物起→影缩，融合感） -- */
.gba-ground-shadow { position: absolute; left: 50%; bottom: 3px; width: 76px; height: 13px; margin-left: -38px;
  border-radius: 50%; pointer-events: none;
  background: radial-gradient(ellipse, rgba(16, 42, 24, .32), rgba(16, 42, 24, .12) 58%, transparent 76%); }
.gba-mon-pad .gba-ground-shadow { animation: shadowPulseMonPc 1.32s ease-in-out infinite; }
.gba-hero-pad .gba-ground-shadow { width: 64px; height: 11px; margin-left: -32px; animation: shadowPulseHeroPc 1.15s ease-in-out infinite; }
@keyframes shadowPulseMonPc { 0%, 100% { transform: scale(1); opacity: 1; } 35% { transform: scale(.8); opacity: .55; } }
@keyframes shadowPulseHeroPc { 0%, 100% { transform: scale(1); opacity: 1; } 30% { transform: scale(.8); opacity: .55; } }
/* -- 待机去旋转（旋转像要倒下）：弹跳+挤压拉伸，节奏放软（覆盖 V8） -- */
.gba-hero { animation: heroIdleV9 1.5s ease-in-out infinite; }
@keyframes heroIdleV9 { 0%, 100% { transform: translateY(0) scale(1.012, .988); } 50% { transform: translateY(-3.5px) scale(.988, 1.014); } }
.gba-mon { animation: monIdleV9 1.7s ease-in-out infinite; }
@keyframes monIdleV9 { 0%, 100% { transform: translateY(0) scale(1.015, .985); } 50% { transform: translateY(-4px) scale(.985, 1.018); } }
/* -- 攻击姿态收敛：旋转 ±10°→±6°，冲刺加长到怪兽跟前（ fist 接到命中点） -- */
.gba-hero.atk-move { animation: heroAtkPcV9 .46s cubic-bezier(.3, .6, .4, 1); }
@keyframes heroAtkPcV9 {
  0%   { transform: translate(0, 0) scale(1, 1) rotate(0); }
  14%  { transform: translate(-5px, 3px) scale(1.08, .9) rotate(-3deg); }
  32%  { transform: translate(150px, 0) scale(.92, 1.1) rotate(6deg); }
  40%  { transform: translate(145px, -3px) scale(1.05, 1.03) rotate(3deg); }
  62%  { transform: translate(140px, 0) scale(1, 1) rotate(0); }
  100% { transform: translate(0, 0) scale(1, 1) rotate(0); }
}
.gba-mon-pad.mon-hit { animation: monKbPcV9 .42s cubic-bezier(.2, .7, .4, 1); }
@keyframes monKbPcV9 {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  20% { transform: translate(24px, -6px) rotate(3deg) scale(1.12, .8); }
  48% { transform: translate(13px, 3px) rotate(-2deg) scale(.95, 1.06); }
  100% { transform: translate(0, 0) rotate(0) scale(1, 1); }
}
.gba-mon-pad.mon-taunt { animation: monAtkPcV9 .52s cubic-bezier(.25, .6, .35, 1); }
@keyframes monAtkPcV9 {
  0% { transform: translate(0, 0) rotate(0) scale(1); }
  30% { transform: translate(-128px, -12px) rotate(-5deg) scale(1.08); }
  46% { transform: translate(-118px, 5px) rotate(-2deg) scale(1.02); }
  100% { transform: translate(0, 0) rotate(0) scale(1); }
}
.gba-hero.hero-kb { animation: heroKbPcV9 .42s ease-out; }
@keyframes heroKbPcV9 {
  0% { transform: translate(0, 0) rotate(0) scale(1, 1); }
  24% { transform: translate(-22px, 3px) rotate(-5deg) scale(1.08, .88); }
  58% { transform: translate(-9px, 0) rotate(-2deg) scale(.98, 1.03); }
  100% { transform: translate(0, 0) rotate(0) scale(1, 1); }
}

/* ============================================================
   打磨 V10（2026-10-17 晚）：白闪断裂修复 + 结算按钮收敛 + 地图弹入 + 细节
   ============================================================ */
/* -- 受击闪烁修复：透明度最深 0.12 会"看穿"身体，背景透出像被切碎——最浅收到 0.5 -- */
.gba-mon.hit-flash { animation: hitFlickerPcV10 .3s linear; }
@keyframes hitFlickerPcV10 { 0%, 30%, 62%, 100% { opacity: 1; } 15%, 46% { opacity: .5; } }
/* -- 结算按钮：胶囊收敛为内容宽度、居中（不再拉满整行） -- */
.over-btns { justify-content: center; }
.over-btns button { flex: 0 0 auto; padding: 0 36px; }
.over-btns button:hover { transform: translateY(-1px); }
/* -- 地图关卡节点：入场逐格弹跳（next 节点保留原有脉冲） -- */
.stage-cell { animation: cellPopPc .32s cubic-bezier(.2, .8, .3, 1.3) backwards; }
.stage-cell:nth-child(2) { animation-delay: .04s; }
.stage-cell:nth-child(3) { animation-delay: .08s; }
.stage-cell:nth-child(4) { animation-delay: .12s; }
.stage-cell:nth-child(5) { animation-delay: .16s; }
.stage-cell:nth-child(6) { animation-delay: .2s; }
.stage-cell:nth-child(7) { animation-delay: .24s; }
.stage-cell:nth-child(8) { animation-delay: .28s; }
.stage-cell:nth-child(9) { animation-delay: .32s; }
@keyframes cellPopPc { 0% { opacity: 0; transform: translateY(14px) scale(.85); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
/* -- 天空带太阳光晕（场景右上，暖光焦点） -- */
.gba-sun-glow { position: absolute; z-index: 1; top: -16px; right: 7%; width: 130px; height: 54px; pointer-events: none;
  background: radial-gradient(ellipse at 50% 100%, rgba(255, 236, 170, .48), rgba(255, 236, 170, .16) 55%, transparent 76%);
  animation: sunGlowPc 5s ease-in-out infinite; }
@keyframes sunGlowPc { 0%, 100% { opacity: .85; } 50% { opacity: 1; } }
/* -- 怪兽血条盒受击抖动 -- */
.gba-enemy-box.hurt { animation: ebShakePc .3s ease; }
@keyframes ebShakePc { 0%, 100% { transform: translate(0, 0); } 25% { transform: translate(-3px, 1px); } 55% { transform: translate(3px, -1px); } 80% { transform: translate(-1px, 0); } }

/* ============================================================
   打击感 V11（2026-10-17 晚）：NPC 受击去透明化 + 紧急警报 + 落地尘土 + 按钮等高
   ============================================================ */
/* -- NPC 受击反应：弃用透明度闪烁（半透明=看穿=白光断裂感），改为位置抖动+形变 -- */
.gba-mon.hit-flash { animation: hitShakePcV11 .32s linear; }
@keyframes hitShakePcV11 {
  0%, 100% { transform: translate(0, 0) scale(1, 1); }
  18% { transform: translate(-3px, 1px) scale(1.05, .95); }
  38% { transform: translate(3px, -1px) scale(.98, 1.03); }
  58% { transform: translate(-2px, 0) scale(1.02, .99); }
  78% { transform: translate(2px, 0) scale(.99, 1.01); }
}
/* -- 最后 3 秒紧急红边警报（呼吸脉冲） -- */
.gba-urgent { position: absolute; inset: 0; z-index: 15; pointer-events: none; opacity: 0; transition: opacity .25s;
  box-shadow: inset 0 0 0 3px rgba(232, 69, 47, .5), inset 0 0 46px rgba(232, 69, 47, .22); }
.gba-urgent.on { animation: urgentPulsePc .75s ease-in-out infinite; }
@keyframes urgentPulsePc { 0%, 100% { opacity: .4; } 50% { opacity: 1; } }
/* -- 主角冲刺归位落地尘土（复用 dust，锚在主角脚线，CSS 延迟 420ms） -- */
.gba-dust.hd { left: 31%; top: 70.5%; }
.gba-dust.hd.on { animation-delay: .42s; }
/* -- 结算按钮：两颗强制等高（白颗的硬底影显高，统一软影） -- */
.over-btns .game-go, .over-btns .ch-back { height: 46px; box-sizing: border-box; border-radius: 999px; box-shadow: 0 4px 14px rgba(21, 48, 74, .22); }
.over-btns .ch-back { background: #F5F6F8; }

/* ============================================================
   活体 V12（2026-10-17 晚）：复合待机——立绘层微摆叠在身体弹跳上
   身体（弹跳+挤压）× 立绘（旋转+横移）= 双层异步运动，有机的"活着"
   ============================================================ */
.gba-hero img.px-sprite { animation: heroMicroPc 2.3s ease-in-out infinite; }
@keyframes heroMicroPc { 0%, 100% { transform: rotate(0) translateX(0); } 33% { transform: rotate(.9deg) translateX(1px); } 66% { transform: rotate(-.7deg) translateX(-1px); } }
.gba-mon img.px-sprite { animation: monMicroPc 2.6s ease-in-out infinite; }
@keyframes monMicroPc { 0%, 100% { transform: rotate(0) translateX(0); } 30% { transform: rotate(-1deg) translateX(-1.5px); } 65% { transform: rotate(.8deg) translateX(1px); } }


/* ======= 街机冲分独立页（2026-10-18 三端拆分）======= */
.ar-ready { padding: 48px 40px 40px; text-align: center; }
.ar-logo { font-size: 64px; line-height: 1.2; }
.ar-name { font-size: 30px; font-weight: 900; color: #F5D77A; letter-spacing: 6px; margin: 10px 0 16px; }
.ar-rule { font-size: 15px; color: var(--text-2, #5a5a68); line-height: 1.8; }
.ar-rule-sub { display: block; font-size: 13px; color: var(--text-3, #9a9aa5); margin-top: 4px; }
.ar-best-line { margin: 20px 0 26px; font-size: 17px; font-weight: 800; color: #B07818; }
.ar-start { width: 280px; }


/* ======= 限时挑战 PC 版（2026-10-18，街机资产移植：深色 HUD）======= */
.chc-ready { padding: 48px 40px 40px; text-align: center; }
.chc-logo { font-size: 64px; line-height: 1.2; }
.chc-name { font-size: 30px; font-weight: 900; color: #F5D77A; letter-spacing: 6px; margin: 10px 0 16px; }
.chc-rule { font-size: 15px; color: var(--text-2, #5a5a68); line-height: 1.8; }
.chc-rule-sub { display: block; font-size: 13px; color: var(--text-3, #9a9aa5); margin-top: 4px; }
.chc-best-line { margin: 20px 0 26px; font-size: 17px; color: var(--text-2, #5a5a68); }
.chc-best-line b { font-size: 22px; color: #E0A63C; }
.chc-start { width: 280px; }
/* 倒计时卡（深色 HUD） */
.chc-timer { display: flex; align-items: center; gap: 16px; background: linear-gradient(160deg, #1E4260 0%, #10273C 72%); border: 1px solid rgba(255,255,255,0.12); border-radius: 14px; padding: 14px 22px; }
.chc-timer.urgent { border-color: rgba(236,112,99,0.6); background: linear-gradient(160deg, #4A2430 0%, #2C1620 72%); }
.chc-time-num { font-size: 34px; font-weight: 800; color: #FFE08A; min-width: 64px; font-variant-numeric: tabular-nums; }
.chc-time-num.urgent { color: #FF9E8A; }
.chc-time-track { flex: 1; height: 8px; background: rgba(255,255,255,0.12); border-radius: 999px; overflow: hidden; }
.chc-time-fill { display: block; height: 100%; background: linear-gradient(90deg, #F5D77A, #E0A63C); border-radius: 999px; transition: width 1s linear; }
.chc-time-fill.urgent { background: linear-gradient(90deg, #FF9E8A, #EC7063); }
/* 状态条 */
.chc-status { display: flex; gap: 12px; margin: 12px 0; }
.chc-stat { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; background: linear-gradient(180deg, rgba(30,66,96,0.9), rgba(16,39,60,0.9)); border: 1px solid rgba(255,255,255,0.10); border-radius: 12px; padding: 10px 0; }
.chc-stat.hot { border-color: rgba(245,215,122,0.55); }
.chc-stat b { font-size: 22px; font-weight: 800; color: #EAF4FB; font-variant-numeric: tabular-nums; }
.chc-stat.hot b { color: #F5D77A; }
.chc-stat i { font-style: normal; font-size: 12px; color: rgba(255,255,255,0.45); }
/* 结算 */
.chc-over-score { font-size: 72px; font-weight: 900; color: #E0A63C; line-height: 1.2; margin-top: 8px; font-variant-numeric: tabular-nums; }
.chc-over-label { font-size: 14px; color: var(--text-3, #9a9aa5); margin-top: 4px; }


/* ======= 限时挑战 V16 极致化（2026-10-18）======= */
/* 开始卡：霓虹招牌 */
.chc-ready {
  background: linear-gradient(160deg, #1E4260 0%, #10273C 72%);
  border: 1px solid rgba(245,215,122,0.28);
  box-shadow: 0 18px 40px rgba(6,18,30,0.45), inset 0 0 0 5px rgba(255,255,255,0.035);
  border-radius: 18px; overflow: hidden; position: relative;
}
.chc-ready::after {
  content: ''; position: absolute; right: -28px; top: -28px;
  width: 150px; height: 150px; border-radius: 50%;
  background: radial-gradient(circle, rgba(245,215,122,0.14) 0, transparent 70%);
}
.chc-logo { display: inline-block; animation: chcBolt 1.6s ease-in-out infinite; }
@keyframes chcBolt { 0%,100% { transform: scale(1); } 50% { transform: scale(1.12); } }
.chc-name { color: #F5D77A; text-shadow: 0 0 20px rgba(245,215,122,0.35); }
.chc-rule { color: rgba(255,255,255,0.72); }
.chc-rule-sub { color: rgba(255,255,255,0.45); }
.chc-best-line {
  display: inline-block; background: rgba(245,215,122,0.12);
  border: 1px solid rgba(245,215,122,0.35); border-radius: 999px;
  padding: 8px 26px; color: rgba(255,255,255,0.72);
}
.chc-best-line b { color: #F5D77A; }
.chc-start {
  background: linear-gradient(180deg, #F7D98D, #E0A63C) !important;
  color: #3A2410 !important; font-weight: 800 !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 0 #A66F14, 0 10px 20px rgba(166,111,20,0.35) !important;
}
.chc-start:active { transform: translateY(3px); box-shadow: 0 1px 0 #A66F14 !important; }
/* 答题：urgent 整页红晕 */
.game-wrap.urgent { position: relative; }
.game-wrap.urgent::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 5;
  box-shadow: inset 0 0 90px rgba(236,70,50,0.4);
  animation: chcUrgent 0.9s ease-in-out infinite;
}
@keyframes chcUrgent { 0%,100% { opacity: 0.55; } 50% { opacity: 1; } }
/* 加分飘字 */
.ar-card { position: relative; overflow: visible; }
.chc-float {
  position: absolute; left: 50%; top: 4px; transform: translateX(-50%);
  font-size: 30px; font-weight: 900; z-index: 5; pointer-events: none;
  opacity: 0; animation: chcFloat 0.65s ease-out forwards;
}
.chc-float.gold { color: #F5D77A; text-shadow: 0 0 16px rgba(245,215,122,0.6); }
.chc-float.red { color: #FF9E8A; text-shadow: 0 0 16px rgba(236,112,99,0.6); }
@keyframes chcFloat {
  0% { opacity: 0; transform: translateX(-50%) translateY(14px) scale(0.8); }
  25% { opacity: 1; transform: translateX(-50%) translateY(0) scale(1.1); }
  100% { opacity: 0; transform: translateX(-50%) translateY(-34px) scale(1); }
}
/* 连击火焰 */
.chc-stat.hot { animation: chcHot 1.2s ease-in-out infinite; }
@keyframes chcHot { 0%,100% { box-shadow: 0 0 0 0 rgba(245,215,122,0); } 50% { box-shadow: 0 0 16px 2px rgba(245,215,122,0.35); } }
/* 结算：深色颁奖台 */
.over-card {
  background: linear-gradient(160deg, #1E4260 0%, #10273C 72%);
  border: 1px solid rgba(245,215,122,0.28);
  box-shadow: 0 18px 40px rgba(6,18,30,0.45), inset 0 0 0 5px rgba(255,255,255,0.035);
  border-radius: 18px; overflow: hidden;
}
.over-title { color: #F5D77A; letter-spacing: 3px; text-shadow: 0 0 18px rgba(245,215,122,0.35); }
.chc-over-score { color: #F5D77A; text-shadow: 0 0 30px rgba(245,215,122,0.45); }
.chc-over-label { color: rgba(255,255,255,0.55); }
.chc-stat { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12); }
.over-card .ch-back {
  background: rgba(255,255,255,0.06); color: rgba(255,255,255,0.75);
  border: 1px solid rgba(255,255,255,0.22);
}


/* ======= 限时挑战 V17 三页布局重构（与 mini 同构）======= */
.chc-record { display: flex; align-items: center; justify-content: center; gap: 12px; background: rgba(245,215,122,0.10); border: 1px solid rgba(245,215,122,0.30); border-radius: 14px; padding: 12px 0; margin: 4px 0 20px; }
.chc-record-label { font-size: 13px; color: rgba(255,255,255,0.55); }
.chc-record-num { font-size: 30px; font-weight: 900; color: #F5D77A; text-shadow: 0 0 16px rgba(245,215,122,0.45); }
.chc-record-unit { font-size: 12px; color: rgba(245,215,122,0.7); }
.chc-record-tip { font-size: 13px; color: rgba(255,255,255,0.45); }
.chc-facts { display: flex; gap: 12px; }
.chc-fact { flex: 1; text-align: center; background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10); border-radius: 12px; padding: 14px 4px 10px; }
.chc-fact b { display: block; font-size: 28px; font-weight: 900; color: #F5D77A; line-height: 1.15; }
.chc-fact b i { font-style: normal; font-size: 14px; }
.chc-fact span { font-size: 12px; color: rgba(255,255,255,0.5); }
.chc-rule-line { font-size: 12px; color: rgba(255,255,255,0.45); margin: 16px 0 4px; }
/* 合并 HUD */
.chc-hud { display: flex; align-items: center; gap: 16px; background: linear-gradient(160deg, #1E4260 0%, #10273C 72%); border: 1px solid rgba(255,255,255,0.12); border-radius: 16px; padding: 12px 18px; margin-bottom: 12px; }
.chc-hud.urgent { border-color: rgba(236,112,99,0.6); background: linear-gradient(160deg, #4A2430 0%, #2C1620 72%); }
.chc-hud-time { flex: 1; min-width: 0; }
.chc-hud-top { display: flex; align-items: baseline; gap: 6px; }
.chc-hud-num { font-size: 38px; font-weight: 900; color: #FFE08A; line-height: 1.05; font-variant-numeric: tabular-nums; }
.chc-hud-num.urgent { color: #FF9E8A; }
.chc-hud-top i { font-style: normal; font-size: 13px; color: rgba(255,224,138,0.65); }
.chc-hud-cap { font-size: 12px; color: rgba(255,255,255,0.35); margin-left: auto; }
.chc-hud-track { display: block; height: 6px; background: rgba(255,255,255,0.12); border-radius: 999px; overflow: hidden; margin-top: 6px; }
.chc-hud-fill { display: block; height: 100%; background: linear-gradient(90deg, #F5D77A, #E0A63C); border-radius: 999px; transition: width 1s linear; }
.chc-hud.urgent .chc-hud-fill { background: linear-gradient(90deg, #FF9E8A, #EC7063); }
.chc-hud-stats { display: flex; gap: 8px; flex-shrink: 0; }
.chc-hud-stat { min-width: 62px; text-align: center; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.10); border-radius: 10px; padding: 6px 0; }
.chc-hud-stat.hot { border-color: rgba(245,215,122,0.6); background: rgba(245,215,122,0.14); animation: chcHot 1.2s ease-in-out infinite; }
.chc-hud-stat b { display: block; font-size: 19px; font-weight: 800; color: #EAF4FB; line-height: 1.2; font-variant-numeric: tabular-nums; }
.chc-hud-stat.hot b { color: #F5D77A; }
.chc-hud-stat i { font-style: normal; font-size: 11px; color: rgba(255,255,255,0.4); }
/* 题卡头细时间条 */
.chc-q-head { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; }
.chc-q-track { flex: 1; height: 4px; background: rgba(255,255,255,0.10); border-radius: 999px; overflow: hidden; }
.chc-q-fill { display: block; height: 100%; background: linear-gradient(90deg, #F5D77A, #E0A63C); border-radius: 999px; transition: width 1s linear; }
/* 结算 */
.over-card.new { padding-top: 56px; }
.over-ribbon { position: absolute; left: 0; right: 0; top: 0; background: linear-gradient(90deg, #EF9F27, #F5D77A, #EF9F27); color: #412402; font-size: 13px; font-weight: 800; letter-spacing: 3px; text-align: center; padding: 6px 0; border-radius: 18px 18px 0 0; }
.over-review { margin-top: 16px; padding: 12px 18px; border-radius: 12px; font-size: 13px; }
.over-review.warn { background: rgba(236,112,99,0.12); border: 1px solid rgba(236,112,99,0.35); color: #FFB3A6; }
.over-review.ok { background: rgba(47,191,127,0.12); border: 1px solid rgba(47,191,127,0.35); color: #7FDDB6; }

/* ======= 限时挑战 V18 窄屏适配（≤1100px HUD 收缩，避免挤压时间区）======= */
@media (max-width: 1100px) {
  .chc-hud { gap: 10px; padding: 10px 14px; }
  .chc-hud-num { font-size: 28px; }
  .chc-hud-stat { min-width: 52px; }
  .chc-hud-stat b { font-size: 16px; }
  .chc-hud-stat i { font-size: 10px; }
}

/* ======= 限时挑战 V19（用户反馈六点）======= */
/* 1) 新纪录：光带 → 居中鎏金描边徽章 */
.over-ribbon { display: none; }
.over-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(245,215,122,0.14);
  border: 1px solid rgba(245,215,122,0.55);
  border-radius: 999px; padding: 8px 30px;
  font-size: 15px; font-weight: 800; color: #F5D77A; letter-spacing: 3px;
  margin-bottom: 6px;
}
.over-card.new .over-title { display: none; }
/* 2) 飘字移到题卡视觉中心，加大加投影 */
.chc-float { top: 30%; font-size: 36px; text-shadow: 0 3px 12px rgba(0,0,0,0.55); }
/* 3) 三页内容区投影移除（保留细描边） */
.chc-ready, .chc-hud, .ar-card, .over-card { box-shadow: none !important; }
/* 5) 开始按钮胶囊化 */
.chc-start { width: 260px !important; border-radius: 999px !important; margin-top: 24px; }
/* 6) HUD 与题卡同宽（ar-card 原 760px 限宽导致一宽一窄） */
.game-wrap .chc-hud ~ .ar-card { max-width: 100%; }

/* V20：复盘三态 idle（未作答中性提示） */
.over-review.idle { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.18); color: rgba(255,255,255,0.6); }

/* V22：Boss 关文字标识 */
.stage-boss {
  display: inline-block;
  font-size: 11px; font-weight: 900; letter-spacing: 2px;
  color: #B3541E;
  background: rgba(232,163,75,0.22);
  border: 1px solid rgba(232,163,75,0.55);
  border-radius: 999px; padding: 1px 10px;
  margin-top: 4px;
}
.stage-cell.lock .stage-boss { color: rgba(255,255,255,0.35); background: transparent; border-color: rgba(255,255,255,0.18); }
.stage-cell.boss.done .stage-boss { color: #1C8A6B; background: rgba(28,138,107,0.14); border-color: rgba(96,205,165,0.5); }

/* V23：训练页入口按钮线性图标（替代 emoji，currentColor 随按钮文字色） */
.train-hero-sim .hero-ico { width: 17px; height: 17px; vertical-align: -3.5px; margin-right: 7px; }


/* ======= 限时挑战 V27「进入页精致化」（与 mini 同构：街机开机画面）======= */
.chc-ready.ar-hero {
  min-height: calc(100vh - 130px);
  display: flex; flex-direction: column; justify-content: center;
  padding: 44px 48px 40px;
  background:
    radial-gradient(ellipse 70% 40% at 50% -6%, rgba(96,205,165,0.10) 0, transparent 70%),
    linear-gradient(160deg, #1E4260 0%, #10273C 74%);
  position: relative; overflow: hidden;
}
.ar-corner { position: absolute; width: 16px; height: 16px; pointer-events: none; }
.ar-corner.tl { left: 12px; top: 12px; border-left: 2px solid rgba(245,215,122,.45); border-top: 2px solid rgba(245,215,122,.45); }
.ar-corner.tr { right: 12px; top: 12px; border-right: 2px solid rgba(245,215,122,.45); border-top: 2px solid rgba(245,215,122,.45); }
.ar-corner.bl { left: 12px; bottom: 12px; border-left: 2px solid rgba(245,215,122,.45); border-bottom: 2px solid rgba(245,215,122,.45); }
.ar-corner.br { right: 12px; bottom: 12px; border-right: 2px solid rgba(245,215,122,.45); border-bottom: 2px solid rgba(245,215,122,.45); }
.chc-ready .chc-logo { display: none; }
.chc-ready.ar-hero .chc-name { font-size: 24px; letter-spacing: 8px; margin: 0 0 6px; color: #E8F2F8; text-shadow: none; }
.chc-tag { font-size: 12px; color: rgba(255,255,255,.4); letter-spacing: 5px; text-align: center; margin-bottom: 26px; }
/* 成绩数字 = 第一视觉焦点 */
.chc-ready .chc-record {
  flex-direction: column; gap: 4px;
  background: transparent; border: none; border-top: 1px solid rgba(245,215,122,.18); border-bottom: 1px solid rgba(245,215,122,.18);
  border-radius: 0; padding: 14px 0 18px; margin: 0 0 24px;
}
.chc-record-label { font-size: 13px; color: rgba(255,255,255,.5); letter-spacing: 5px; }
.chc-record-line { display: flex; align-items: baseline; gap: 8px; }
.chc-record-num {
  font-size: 58px; font-weight: 900; line-height: 1.05; font-variant-numeric: tabular-nums;
  background: linear-gradient(180deg, #FBE29A 8%, #F5D77A 40%, #E0A63C 90%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 3px 8px rgba(224,166,60,.35));
}
.chc-record-unit { font-size: 15px; color: rgba(245,215,122,.75); }
.chc-record-tip { font-size: 14px; color: rgba(255,255,255,.5); letter-spacing: 1px; }
/* 参数牌：顶部高光线 */
.chc-facts { gap: 12px; margin-bottom: 18px; }
.chc-fact { position: relative; overflow: hidden; padding: 14px 4px 10px; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.09); border-radius: 10px; }
.chc-fact::before { content: ''; position: absolute; left: 20%; right: 20%; top: 0; height: 1px; background: linear-gradient(90deg, transparent, rgba(245,215,122,.55), transparent); }
.chc-fact b { font-size: 28px; }
.chc-fact span { font-size: 12px; color: rgba(255,255,255,.45); }
.chc-rule-line { margin: 0 0 22px; }
/* CTA 同轴堆叠 */
.chc-btn-wrap { display: flex; flex-direction: column; align-items: center; }
.chc-btn-wrap .chc-start { width: 100% !important; height: 56px; line-height: 54px; font-size: 17px !important; letter-spacing: 6px; margin-top: 0 !important; border-radius: 12px !important; box-shadow: 0 5px 0 #A66F14, 0 12px 22px rgba(166,111,20,.35) !important; }
.chc-btn-wrap .chc-sfx { margin: 16px 0 0; padding: 5px 22px; font-size: 12px; color: rgba(255,255,255,.5); background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.12); border-radius: 999px; cursor: pointer; }
.chc-btn-wrap .chc-sfx.off { color: rgba(255,255,255,.3); text-decoration: line-through; }

/* ======= 限时挑战 V28「进入页精修」（与 mini 同构）======= */
.chc-ready.ar-hero { background-image: radial-gradient(ellipse 90% 30% at 50% 118%, rgba(6,18,30,.55) 0, transparent 62%), linear-gradient(160deg, #1E4260 0%, #10273C 74%); }
.ar-corner { width: 20px; height: 20px; }
.ar-corner.tl, .ar-corner.tr, .ar-corner.bl, .ar-corner.br { border-color: rgba(245,215,122,.55); border-width: 2px; }
.chc-ready.ar-hero .chc-name { color: #F2F8FC; }
.chc-ready.ar-hero .chc-name::after {
  content: ''; display: block; width: 34px; height: 2px; margin: 10px auto 0; border-radius: 999px;
  background: linear-gradient(90deg, transparent, #F5D77A, transparent);
}
.chc-tag { margin-bottom: 24px; color: rgba(255,255,255,.5); }
.chc-ready .chc-record { position: relative; padding: 16px 0 22px; margin-bottom: 22px; border-top: none; border-bottom: none; }
.chc-ready .chc-record.has::before, .chc-ready .chc-record.has::after {
  content: ''; height: 1px; background: linear-gradient(90deg, transparent, rgba(245,215,122,.38), transparent);
}
.chc-record-line { position: relative; }
.chc-record-line::after {
  content: ''; position: absolute; left: 50%; bottom: -10px; transform: translateX(-50%);
  width: 110px; height: 12px; border-radius: 50%;
  background: radial-gradient(ellipse, rgba(245,215,122,.22) 0, transparent 70%);
}
.chc-facts { margin-bottom: 16px; }
.chc-fact { padding: 16px 4px 12px; }
.chc-fact b { font-size: 32px; color: #FBE29A; }
.chc-fact::before { left: 30%; right: 30%; height: 2px; background: linear-gradient(90deg, transparent, rgba(245,215,122,.75), transparent); }
.chc-rule-line { margin-bottom: 22px; color: rgba(255,255,255,.58); font-size: 13px; }
.chc-btn-wrap .chc-start { letter-spacing: 4px !important; }
.chc-btn-wrap .chc-start:active { transform: translateY(3px); }
.chc-btn-wrap .chc-sfx { color: rgba(255,255,255,.6); border-color: rgba(255,255,255,.16); }
/* 内容行宽约束：超宽屏下行不松散 */
.chc-ready.ar-hero > *:not(.ar-corner) { max-width: 820px; width: 100%; margin-left: auto; margin-right: auto; }

/* ======= 限时挑战 V29「左右分栏」（与 mini 同构）======= */
.chc-ready.ar-hero { min-height: 0; justify-content: flex-start; padding: 40px 44px 34px; }
.ar-split { display: flex; align-items: stretch; gap: 30px; }
.ar-left { flex: 0 0 46%; display: flex; flex-direction: column; }
.ar-right { flex: 1; display: flex; flex-direction: column; justify-content: center; border-left: 1px solid rgba(245,215,122,.16); padding-left: 30px; }
.ar-row { display: flex; align-items: baseline; justify-content: space-between; padding: 15px 0; border-bottom: 1px solid rgba(255,255,255,.07); }
.ar-row:last-child { border-bottom: none; }
.ar-row-num { font-size: 32px; font-weight: 900; color: #FBE29A; line-height: 1; }
.ar-row-num i { font-style: normal; font-size: 15px; }
.ar-row-label { font-size: 14px; color: rgba(255,255,255,.5); }
.chc-ready.ar-hero .chc-name { font-size: 22px; letter-spacing: 6px; text-align: left; }
.chc-ready.ar-hero .chc-name::after { margin: 10px 0 0; }
.chc-tag { text-align: left; margin-bottom: 18px; letter-spacing: 4px; }
.chc-ready .chc-record { align-items: flex-start; padding: 14px 0 18px; }
.chc-ready .chc-record.has::before {
  content: ''; display: block; width: 44px; height: 2px; border-radius: 999px; margin-bottom: 12px;
  background: linear-gradient(90deg, #F5D77A, transparent);
}
.chc-ready .chc-record.has::after { display: none; }
.chc-record-label { font-size: 13px; letter-spacing: 3px; }
.chc-record-num { font-size: 60px; }
.chc-record-line { justify-content: flex-start; }
.ar-foot { margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.07); }
.ar-foot .chc-rule-line { margin-bottom: 20px; text-align: center; }
/* 内容行宽约束（分栏下放宽） */
.chc-ready.ar-hero > *:not(.ar-corner) { max-width: 900px; }

/* ======= 限时挑战 V30「充实布局 + 按钮缩小 + 响应式」======= */
.chc-ready.ar-hero { min-height: 520px; justify-content: space-between; padding: 40px 48px 34px; }
.chc-ready .ar-split { flex: 1; }
.chc-ready .ar-left { justify-content: space-between; }
.chc-ready .ar-left .chc-tag { margin-bottom: 0; }
.chc-ready .ar-left .chc-record { margin-top: 16px; }
.chc-ready .ar-right .ar-row { flex: 1; align-items: center; padding: 0; }
.chc-ready .ar-foot { margin-top: 22px; padding-top: 20px; }
.chc-ready .ar-foot .chc-rule-line { margin-bottom: 18px; }
.chc-ready .chc-btn-wrap { flex-direction: row; gap: 14px; }
.chc-ready .chc-btn-wrap .chc-start { width: 280px !important; height: 48px; line-height: 46px; font-size: 16px !important; letter-spacing: 2px !important; border-radius: 10px !important; }
.chc-ready .chc-btn-wrap .chc-sfx { margin: 0; flex-shrink: 0; }
/* 响应式：中等屏压缩高度，窄屏收窄左栏 */
@media (max-width: 1200px) { .chc-ready.ar-hero { min-height: 460px; } }
@media (max-width: 980px) {
  .chc-ready.ar-hero { padding: 32px 34px 28px; }
  .chc-ready.ar-hero > *:not(.ar-corner) { max-width: 100%; }
  .ar-left { flex-basis: 50%; }
}

/* ======= 限时挑战 V30b「左栏修正」：避免拉伸留洞 ======= */
.chc-ready.ar-hero { min-height: 480px; }
.chc-ready .ar-left { justify-content: center; }
.chc-ready .ar-left .chc-tag { margin-bottom: 22px; }
.chc-ready .ar-left .chc-record { margin-top: 0; }

/* ======= 限时挑战 V31「重做」：机台铭牌 / 展示柜 / 仪表排 / 机台按键 ======= */
.chc-ready.ar-hero {
  min-height: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 48px 56px 42px;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.022) 0, rgba(255,255,255,.022) 2px, transparent 2px, transparent 5px),
    radial-gradient(ellipse 60% 36% at 50% 42%, rgba(245,215,122,.12) 0, transparent 68%),
    radial-gradient(ellipse 90% 26% at 50% 118%, rgba(6,18,30,.55) 0, transparent 62%),
    linear-gradient(160deg, #1E4260 0%, #10273C 74%);
  width: 100%; max-width: none !important;
}
.chc-ready.ar-hero > * { max-width: 680px !important; width: 100%; }
.ar-brand { text-align: center; margin-bottom: 30px; }
.ar-brand-title {
  font-size: 42px; font-weight: 900; letter-spacing: 12px; text-indent: 12px;
  background: linear-gradient(180deg, #FDF3D2 0%, #F5D77A 42%, #D9A03C 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 3px 10px rgba(224,166,60,.40));
}
.ar-brand-sub { margin-top: 10px; font-size: 12px; letter-spacing: 6px; color: rgba(255,255,255,.42); position: relative; padding: 0 56px; }
.ar-brand-sub::before, .ar-brand-sub::after {
  content: ''; position: absolute; top: 50%; width: 40px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(245,215,122,.6));
}
.ar-brand-sub::before { left: 0; }
.ar-brand-sub::after { right: 0; transform: scaleX(-1); }
.ar-cabinet {
  min-width: 280px; text-align: center;
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
  border: 1px solid rgba(245,215,122,.28); border-radius: 18px; padding: 18px 40px 20px;
  position: relative; margin-bottom: 32px; box-shadow: inset 0 0 24px rgba(245,215,122,.06);
}
.ar-cabinet-tag {
  display: inline-block; font-size: 12px; letter-spacing: 5px; color: rgba(255,255,255,.55);
  border-bottom: 1px solid rgba(245,215,122,.35); padding-bottom: 6px; margin-bottom: 10px;
}
.ar-cabinet-line { display: flex; align-items: baseline; justify-content: center; gap: 8px; position: relative; }
.ar-cabinet-num {
  font-size: 86px; font-weight: 900; line-height: 1; font-variant-numeric: tabular-nums;
  background: linear-gradient(180deg, #FDF3D2 0%, #F5D77A 45%, #D9A03C 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 4px 12px rgba(224,166,60,.45));
}
.ar-cabinet-line::after {
  content: ''; position: absolute; left: 50%; bottom: -8px; transform: translateX(-50%);
  width: 150px; height: 14px; border-radius: 50%;
  background: radial-gradient(ellipse, rgba(245,215,122,.20) 0, transparent 70%);
}
.ar-cabinet-unit { font-style: normal; font-size: 18px; color: rgba(245,215,122,.8); }
.ar-cabinet-tip { font-size: 15px; color: rgba(255,255,255,.5); padding: 10px 0 4px; }
.ar-gauges { display: flex; gap: 14px; margin-bottom: 26px; }
.ar-gauge {
  flex: 1; text-align: center; padding: 14px 4px 11px; position: relative; overflow: hidden;
  background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.10); border-radius: 12px;
}
.ar-gauge::before {
  content: ''; position: absolute; left: 28%; right: 28%; top: 0; height: 2px;
  background: linear-gradient(90deg, transparent, rgba(245,215,122,.8), transparent);
}
.ar-gauge-num { display: block; font-size: 30px; font-weight: 900; color: #FBE29A; line-height: 1.1; }
.ar-gauge-num i { font-style: normal; font-size: 14px; }
.ar-gauge span { font-size: 12px; color: rgba(255,255,255,.45); }
.chc-rule-line { margin-bottom: 22px; color: rgba(255,255,255,.55); font-size: 13px; text-align: center; }
.chc-btn-wrap { display: flex; align-items: center; justify-content: center; gap: 16px; }
.chc-btn-wrap .chc-start {
  flex: 1; max-width: 300px; height: 58px; line-height: 56px; margin: 0 !important;
  font-size: 18px !important; font-weight: 800; letter-spacing: 5px; border-radius: 999px !important;
  background: linear-gradient(180deg, #FBE29A 0%, #F0C463 45%, #DFA63C 100%) !important;
  color: #3A2410 !important;
  box-shadow: 0 6px 0 #A66F14, 0 12px 22px rgba(166,111,20,.40) !important;
}
.chc-btn-wrap .chc-start:active { transform: translateY(4px); box-shadow: 0 2px 0 #A66F14 !important; }
.ar-toggle {
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0;
  padding: 8px 18px; border-radius: 999px; cursor: pointer;
  background: rgba(255,255,255,.05); border: 1px solid rgba(255,255,255,.14);
  font-size: 13px; color: rgba(255,255,255,.55);
}
.ar-toggle-dot { width: 9px; height: 9px; border-radius: 50%; background: rgba(255,255,255,.25); }
.ar-toggle.on { border-color: rgba(245,215,122,.4); color: rgba(255,255,255,.8); }
.ar-toggle.on .ar-toggle-dot { background: #F5D77A; box-shadow: 0 0 8px rgba(245,215,122,.7); }
.ar-corner { width: 22px; height: 22px; border-width: 3px !important; border-color: rgba(245,215,122,.6) !important; }
@media (max-width: 980px) {
  .ar-brand-title { font-size: 32px; letter-spacing: 8px; }
  .ar-cabinet-num { font-size: 64px; }
}

/* ======= V32「记分卡」：深色记分头 + 浅色主体（与小程序 pages/challenge 同构） =======
   结构：.chb-card > .chb-hero（深） + .chb-body（浅）
   说明：V27-V31 的 .chc-ready.ar-hero / .ar-brand / .ar-cabinet / .ar-gauges 已随结构下线，保留仅供回溯。 */
.chb-wrap {
  display: flex; align-items: center; justify-content: center;
  min-height: calc(100vh - 150px);
  padding: 24px 0 48px; box-sizing: border-box;
}
.chb-card {
  width: 100%; max-width: 660px;
  background: #FFFFFF;
  border: 1px solid rgba(216, 224, 234, 0.9);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(11, 27, 48, 0.07);
}
/* —— 记分头 —— */
.chb-hero {
  position: relative; overflow: hidden;
  padding: 30px 34px 28px;
  background:
    radial-gradient(ellipse 78% 88% at 86% -12%, rgba(96, 205, 165, 0.20) 0, transparent 62%),
    linear-gradient(148deg, #17456F 0%, #0B2544 78%);
}
.chb-scan {
  position: absolute; left: 0; top: 0; right: 0; bottom: 0; pointer-events: none; opacity: 0.5;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 0, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 3px);
}
.chb-top { position: relative; display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.chb-title { font-size: 17px; font-weight: 800; letter-spacing: 2px; color: #F2F8FC; }
.chb-en { font-size: 10px; font-weight: 600; letter-spacing: 2px; color: rgba(255, 255, 255, 0.34); }
.chb-record {
  position: relative; margin-top: 13px; text-align: center;
  min-height: 85px;   /* 两态等高：云端拉回分数时不跳动 */
  display: flex; flex-direction: column; justify-content: center;
}
.chb-label { display: block; font-size: 11px; letter-spacing: 1px; color: rgba(255, 255, 255, 0.50); }
.chb-line { display: flex; align-items: baseline; justify-content: center; gap: 10px; margin-top: 2px; }
.chb-num {
  font-size: 54px; line-height: 1.02; font-weight: 900; letter-spacing: -1px;
  color: #FFD08A; font-variant-numeric: tabular-nums;
  text-shadow: 0 4px 14px rgba(255, 166, 60, 0.25);
}
.chb-unit { font-size: 14px; font-style: normal; color: rgba(255, 208, 138, 0.72); }
.chb-tip { display: block; margin-top: 4px; font-size: 15px; font-weight: 600; letter-spacing: .5px; color: rgba(255, 255, 255, 0.62); }
/* —— 浅色主体 —— */
.chb-body { padding: 26px 34px 28px; }
.chb-params { display: flex; gap: 10px; }
.chb-param {
  flex: 1; min-width: 0; text-align: center;
  padding: 14px 6px 12px;
  background: #F7F9FC; border: 1px solid #E3E9F2; border-radius: 12px;
}
.chb-param-num { font-size: 22px; font-weight: 800; line-height: 1.15; color: #1E6FA8; font-variant-numeric: tabular-nums; }
.chb-param-num i { font-size: 11px; font-style: normal; font-weight: 700; margin-left: 2px; }
.chb-param-num.t { color: #12A05F; }
.chb-param-num.s { color: #F4511E; }
.chb-param-label { margin-top: 5px; font-size: 12px; color: #8A9AAE; }
.chb-note { margin: 18px 0 20px; text-align: center; font-size: 12.5px; line-height: 1.7; color: #8A9AAE; }
.chb-go {
  display: block; width: 100%; height: 48px;
  border: 0; border-radius: 999px; cursor: pointer;
  font-size: 15px; font-weight: 800; letter-spacing: 1px; color: #FFFFFF;
  background: linear-gradient(90deg, #FF8C3A, #F4511E);
  box-shadow: 0 8px 18px rgba(244, 81, 30, 0.24);
  transition: transform .12s ease, box-shadow .12s ease;
}
.chb-go:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(244, 81, 30, 0.28); }
.chb-go:active { transform: translateY(1px); box-shadow: 0 4px 12px rgba(244, 81, 30, 0.22); }
.chb-sfx {
  display: flex; align-items: center; justify-content: center; gap: 7px;
  margin-top: 14px; font-size: 12px; color: #8A9AAE;
  cursor: pointer; user-select: none;
}
.chb-sfx-dot { width: 7px; height: 7px; border-radius: 50%; background: #C7D0DC; transition: background .15s; }
.chb-sfx-dot.on { background: #12A05F; box-shadow: 0 0 8px rgba(18, 160, 95, 0.5); }
@media (max-width: 640px) {
  .chb-hero { padding: 24px 22px 22px; }
  .chb-body { padding: 20px 22px 24px; }
  .chb-num { font-size: 44px; }
  .chb-wrap { min-height: 0; padding: 8px 0 24px; }
}

/* ======= V33「三页同语言」：答题页 / 结算页 = 深色状态条 + 浅色内容卡 =======
   与小程序的 .ch-hud / .ch-q-card / .ch-result 一一对应；深色只做锚点。 */
.chp-wrap { max-width: 820px; margin: 0 auto; padding: 4px 0 32px; }

/* —— 状态条 —— */
.chp-hud {
  padding: 18px 22px 16px;
  margin-bottom: 14px;
  border-radius: 16px;
  background:
    radial-gradient(ellipse 70% 90% at 92% -20%, rgba(96, 205, 165, 0.16) 0, transparent 62%),
    linear-gradient(148deg, #17456F 0%, #0B2544 78%);
  border: 1px solid rgba(255, 255, 255, 0.10);
}
.chp-hud.urgent {
  background:
    radial-gradient(ellipse 70% 90% at 92% -20%, rgba(255, 120, 80, 0.18) 0, transparent 62%),
    linear-gradient(148deg, #4A2430 0%, #2C1620 78%);
  border-color: rgba(236, 112, 99, 0.45);
}
.chp-hud-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.chp-hud-time { display: flex; align-items: baseline; gap: 6px; min-width: 0; }
.chp-hud-num { font-size: 36px; font-weight: 900; line-height: 1; color: #FFD08A; font-variant-numeric: tabular-nums; }
.chp-hud-num.urgent { color: #FF9E8A; }
.chp-hud-unit { font-style: normal; font-size: 14px; color: rgba(255, 208, 138, 0.7); }
.chp-hud-cap { font-size: 12px; color: rgba(255, 255, 255, 0.38); margin-left: 2px; }
.chp-hud-stats { display: flex; gap: 8px; flex-shrink: 0; }
.chp-hud-stat {
  min-width: 74px; padding: 6px 10px; text-align: center;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 10px;
}
.chp-hud-stat.hot {
  border-color: rgba(255, 208, 138, 0.55);
  background: rgba(255, 208, 138, 0.14);
  animation: chcHot 1.2s ease-in-out infinite;
}
.chp-hud-stat b { display: block; font-size: 18px; font-weight: 800; line-height: 1.2; color: #EAF4FB; font-variant-numeric: tabular-nums; }
.chp-hud-stat.hot b { color: #FFD08A; }
.chp-hud-stat i { font-style: normal; font-size: 11px; color: rgba(255, 255, 255, 0.42); }
.chp-hud-track { display: block; height: 5px; margin-top: 14px; background: rgba(255, 255, 255, 0.12); border-radius: 999px; overflow: hidden; }
.chp-hud-fill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, #FFD08A, #EFAF43); transition: width 1s linear; }
.chp-hud.urgent .chp-hud-fill { background: linear-gradient(90deg, #FF9E8A, #EC7063); }

/* —— 题卡（系统浅色） —— */
.chp-card {
  position: relative;
  padding: 22px 24px 26px;
  background: #FFFFFF;
  border: 1px solid #E3E9F2;
  border-radius: 16px;
}
.chp-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.chp-idx { font-size: 12.5px; color: #8A9AAE; letter-spacing: .5px; }
.chp-tag { flex-shrink: 0; font-size: 11.5px; line-height: 1.6; color: #46576C; background: #F1F4F8; border-radius: 999px; padding: 2px 12px; }
.chp-img { display: block; width: 100%; height: 320px; border-radius: 12px; background: #0B1B21; object-fit: contain; }
.chp-ecg { display: flex; align-items: center; justify-content: center; color: #7FD1D4; font-size: 18px; font-weight: 700; background: linear-gradient(135deg, #0E2A33, #17434F); }
.chp-stem { font-size: 15px; font-weight: 600; line-height: 1.6; color: #0B1B30; margin: 16px 0 14px; }
.chp-opts { display: flex; flex-direction: column; gap: 9px; }
.chp-opt {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 13px 15px;
  background: #FAFBFC; border: 1px solid #E3E9F2; border-radius: 11px;
  font-size: 14.5px; color: #0B1B30; text-align: left; cursor: pointer;
  transition: background .12s, border-color .12s, transform .08s;
}
.chp-opt:hover { border-color: #C9D3E0; background: #F6F8FB; }
.chp-opt:active { transform: scale(.997); }
.chp-opt.disabled { pointer-events: none; }
.chp-opt-key {
  flex-shrink: 0; width: 28px; height: 28px; border-radius: 7px;
  background: #E9EFF1; color: #46576C;
  font-size: 13px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}
.chp-opt.right { background: #E7F6EF; border-color: #1C8A6B; box-shadow: inset 0 0 0 1px rgba(28, 138, 107, .18); }
.chp-opt.right .chp-opt-key { background: #1C8A6B; color: #FFFFFF; }
.chp-opt.wrong { background: #FDECEC; border-color: #D9534F; box-shadow: inset 0 0 0 1px rgba(217, 83, 79, .16); }
.chp-opt.wrong .chp-opt-key { background: #D9534F; color: #FFFFFF; }

/* 飘字：得分绿 / 扣时红 */
.chc-float.gain { color: #2FBF7F; text-shadow: 0 2px 10px rgba(0, 0, 0, .40); }
.chc-float.loss { color: #FF8F80; text-shadow: 0 2px 10px rgba(0, 0, 0, .40); }
/* 浅色页上的红晕收敛 */
.game-wrap.urgent::after { box-shadow: inset 0 0 90px rgba(236, 70, 50, 0.28); }

/* —— 结算：复用进入页记分卡 —— */
.chb-result .chb-hero { text-align: center; }
.chb-result .chb-num { font-size: 62px; }
.chb-eyebrow {
  position: relative;
  display: inline-block;
  font-size: 11.5px; letter-spacing: 3px;
  color: rgba(255, 255, 255, 0.5);
  padding: 3px 14px; border-radius: 999px;
  border: 1px solid transparent;
}
.chb-eyebrow.best { color: #FFD08A; background: rgba(255, 208, 138, .12); border-color: rgba(255, 208, 138, .42); }
.chb-cap { position: relative; margin-top: 6px; font-size: 12px; color: rgba(255, 255, 255, 0.5); }
.chb-stats { display: flex; gap: 9px; }
.chb-stat {
  flex: 1; min-width: 0; text-align: center;
  padding: 13px 4px 11px;
  background: #F7F9FC; border: 1px solid #E3E9F2; border-radius: 11px;
}
.chb-stat b { display: block; font-size: 20px; font-weight: 800; line-height: 1.15; color: #0B1B30; font-variant-numeric: tabular-nums; }
.chb-stat i { display: block; margin-top: 3px; font-style: normal; font-size: 11.5px; color: #8A9AAE; }
.chb-review { margin-top: 14px; padding: 10px 14px; border-radius: 10px; font-size: 12.5px; line-height: 1.6; text-align: center; }
.chb-review.ok { background: #EAF7F0; border: 1px solid #BEE6D2; color: #0F7A4B; }
.chb-review.warn { background: #FFF1ED; border: 1px solid #F7CFC3; color: #B33A1E; }
.chb-review.idle { background: #F1F4F8; border: 1px solid #E3E9F2; color: #8A9AAE; }
.chb-result .chb-go { margin-top: 18px; }
.chb-back { display: block; margin-top: 12px; text-align: center; font-size: 12.5px; color: #8A9AAE; cursor: pointer; }
.chb-back:hover { color: #46576C; }

@media (max-width: 720px) {
  .chp-img { height: 220px; }
  .chp-hud-num { font-size: 30px; }
  .chp-hud-stat { min-width: 62px; }
  .chb-result .chb-num { font-size: 50px; }
}
/* 题卡模块标签为空时不占位（题库偶有无 module 的脏数据） */
.chp-tag:empty { display: none; }

/* ======= V34「回到整块深蓝」：答题页 / 结算页（与小程序同构） =======
   结构与 V33 一致，只把内容区从白色换回深蓝面板。 */
.chp-card {
  background: linear-gradient(180deg, #143A5D 0%, #0C2742 100%);
  border: 1px solid rgba(255, 208, 138, 0.22);
}
.chp-idx { color: #9DB8CC; }
.chp-tag { color: rgba(255, 255, 255, 0.74); background: rgba(255, 255, 255, 0.10); border: 1px solid rgba(255, 255, 255, 0.10); }
.chp-img { border: 1px solid rgba(255, 255, 255, 0.12); }
.chp-stem { color: #EAF4FB; }
.chp-opt {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #EAF4FB;
}
.chp-opt:hover { background: rgba(255, 255, 255, 0.12); border-color: rgba(255, 208, 138, 0.55); }
.chp-opt-key {
  background: linear-gradient(180deg, #F7D98D, #E0A63C);
  color: #3A2410;
  box-shadow: 0 2px 0 #A66F14;
}
.chp-opt.right { background: rgba(47, 191, 127, 0.22); border-color: #2FBF7F; box-shadow: inset 0 0 0 1px rgba(47, 191, 127, 0.22); }
.chp-opt.right .chp-opt-key { background: linear-gradient(180deg, #6BE8A0, #2FBF7F); color: #07301F; box-shadow: none; }
.chp-opt.wrong { background: rgba(236, 112, 99, 0.22); border-color: #EC7063; box-shadow: inset 0 0 0 1px rgba(236, 112, 99, 0.22); }
.chp-opt.wrong .chp-opt-key { background: linear-gradient(180deg, #FF9E8A, #EC7063); color: #3A0F0A; box-shadow: none; }

/* 结算：整卡深蓝 */
.chb-card.chb-result {
  background:
    radial-gradient(ellipse 70% 52% at 50% -8%, rgba(96, 205, 165, 0.14) 0, transparent 62%),
    linear-gradient(160deg, #17456F 0%, #0B2544 78%);
  border-color: rgba(255, 255, 255, 0.10);
}
.chb-result .chb-hero { background: none; }
.chb-result .chb-body { background: transparent; border-top: 1px solid rgba(255, 255, 255, 0.07); padding-top: 22px; }
.chb-result .chb-stat { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.12); }
.chb-result .chb-stat b { color: #EAF4FB; }
.chb-result .chb-stat i { color: rgba(255, 255, 255, 0.45); }
.chb-review.ok { background: rgba(47, 191, 127, 0.14); border-color: rgba(47, 191, 127, 0.38); color: #7FDDB6; }
.chb-review.warn { background: rgba(236, 112, 99, 0.14); border-color: rgba(236, 112, 99, 0.38); color: #FFB3A6; }
.chb-review.idle { background: rgba(255, 255, 255, 0.06); border-color: rgba(255, 255, 255, 0.16); color: rgba(255, 255, 255, 0.62); }
.chb-result .chb-back { color: rgba(255, 255, 255, 0.55); }
.chb-result .chb-back:hover { color: rgba(255, 255, 255, 0.82); }

/* V34b：深底复盘条提亮（与小程序同构） */
.chb-result .chb-review.warn { color: #FFC6BA; border-color: rgba(236, 112, 99, 0.45); background: rgba(236, 112, 99, 0.18); }
.chb-result .chb-review.ok { color: #8FE7C2; border-color: rgba(47, 191, 127, 0.45); background: rgba(47, 191, 127, 0.18); }

/* ======= V35：PC 答题页左右分栏（左影像 / 右题干+选项） =======
   只在宽屏生效；窄屏自动回落成上下堆叠，小程序与 H5 不受影响。 */
@media (min-width: 981px) {
  .chp-wrap { max-width: 920px; }
  .chp-card {
    display: grid;
    grid-template-columns: minmax(0, 1.06fr) minmax(0, 0.94fr);
    grid-template-rows: auto auto 1fr;
    column-gap: 24px;
  }
  .chp-head { grid-column: 1 / -1; grid-row: 1; }
  #chcMedia { grid-column: 1; grid-row: 2 / span 2; align-self: stretch; }
  #chcMedia .chp-img { height: 100%; min-height: 380px; }
  .chp-stem { grid-column: 2; grid-row: 2; margin: 0 0 14px; }
  .chp-opts { grid-column: 2; grid-row: 3; align-content: start; }
  /* 右侧选项在高栏里略微加大呼吸，避免和 380px 高的影像比显得单薄 */
  .chp-opt { padding: 15px 16px; }
  .chp-opts { gap: 10px; }
  /* 窄一点的桌面（981-1120）收一档字距与内边距 */
}
@media (min-width: 981px) and (max-width: 1120px) {
  .chp-card { column-gap: 18px; }
  .chp-opt { padding: 13px 14px; }
  #chcMedia .chp-img { min-height: 340px; }
}

/* V35b：左栏加宽（影像少留黑边）+ 影像固定 360 高并纵向居中 */
@media (min-width: 981px) {
  .chp-card { grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); }
  #chcMedia { align-self: center; }
  #chcMedia .chp-img { height: 360px; min-height: 0; }
}
@media (min-width: 981px) and (max-width: 1120px) {
  #chcMedia .chp-img { height: 320px; }
}

/* ======= V36：影像区做成独立「取景框」 =======
   用户反馈：影像和题干/选项糊在一起。做法：外框描边 + 内衬留白 + 轻投影，
   影像本身再收一道细边 —— 既有明确边界，又和深蓝卡面拉开一层。 */
#chcMedia {
  padding: 8px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: linear-gradient(180deg, rgba(2, 10, 18, 0.42), rgba(2, 10, 18, 0.20));
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.30), 0 10px 26px rgba(2, 10, 20, 0.36);
}
#chcMedia .chp-img {
  height: 300px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  border-radius: 10px;
  box-sizing: border-box;
}
/* 题干与影像区分开呼吸：题头下沿多留 4px */
.chp-head { margin-bottom: 16px; }

@media (min-width: 981px) {
  #chcMedia .chp-img { height: 340px; }
  .chp-card { column-gap: 28px; }
}
@media (min-width: 981px) and (max-width: 1120px) {
  #chcMedia .chp-img { height: 300px; }
}

/* ======= V40「游戏世界」：像素冒险地图页（PC）======
   深色世界底 + 像素场景横幅 + 金属 HUD + 关卡节点 + 街机金键。 */
.gm-world {
  max-width: 1120px;
  padding: 20px;
  border-radius: 22px;
  background: radial-gradient(ellipse 130% 60% at 50% -10%, #16406B 0%, #0A1D33 46%, #040C18 100%);
  box-shadow: 0 24px 60px rgba(4, 12, 24, 0.45);
}
/* —— 世界横幅 —— */
.gm-world .game-banner {
  position: relative; overflow: hidden;
  height: 210px; padding: 0; margin-bottom: 14px;
  border: 2px solid #2A4A6E; border-radius: 16px;
  background: #0A1B2E;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.45);
}
.gm-world .game-banner::after, .gm-world .game-banner::before { display: none; }
.gb-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; }
.gb-scrim {
  position: absolute; left: 0; top: 0; right: 0; bottom: 0;
  background: linear-gradient(180deg, rgba(4, 12, 24, 0.06) 0%, rgba(4, 12, 24, 0.38) 46%, rgba(4, 12, 24, 0.95) 100%);
}
.gb-kicker { position: absolute; left: 26px; bottom: 74px; font-size: 11px; letter-spacing: 6px; color: #FFC85C; }
.gm-world .gb-title {
  position: absolute; left: 26px; bottom: 38px;
  font-size: 38px; font-weight: 900; letter-spacing: 2px; line-height: 1.05;
  color: #FFFFFF; text-shadow: 0 4px 0 #05101F, 0 0 26px rgba(255, 200, 92, 0.32);
}
.gm-world .gb-desc { position: absolute; left: 26px; bottom: 16px; margin: 0; font-size: 12.5px; letter-spacing: .5px; color: rgba(231, 241, 250, 0.62); }

/* —— HUD 条 —— */
.gm-hud { display: flex; gap: 10px; margin-bottom: 14px; }
.gm-hud-item {
  flex: 1; min-width: 0; padding: 8px 14px 10px;
  border-radius: 10px; border: 1px solid #2A4A6E;
  background: linear-gradient(180deg, #15335A, #0C2138);
  box-shadow: 0 4px 0 rgba(0, 0, 0, 0.35), inset 0 1px 0 rgba(255, 255, 255, 0.06);
}
.gm-hud-k { display: block; font-size: 10px; letter-spacing: 2px; color: rgba(231, 241, 250, 0.42); }
.gm-hud-v { display: block; margin-top: 2px; font-size: 20px; font-weight: 800; line-height: 1.1; color: #FFC85C; font-variant-numeric: tabular-nums; }
.gm-hud-sub { font-style: normal; font-size: 12px; color: rgba(255, 200, 92, 0.55); }
.gm-hud-tap { cursor: pointer; }
.gm-hud-tap:active { transform: translateY(3px); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.35); }
.gm-hud-item.off .gm-hud-v { color: rgba(231, 241, 250, 0.32); }

/* —— 地图主体 —— */
.gm-world .map-cols { display: flex; gap: 14px; align-items: stretch; }
.gm-world .map-main { flex: 1 1 auto; min-width: 0; }
.gm-world .map-side { flex: 0 0 264px; display: flex; flex-direction: column; gap: 10px; }
.gm-world .stage-panel {
  background: linear-gradient(180deg, #0F2743 0%, #08182B 100%);
  border: 2px solid #24456A; border-radius: 16px;
  padding: 18px 18px 20px;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.42), inset 0 0 0 1px rgba(255, 255, 255, 0.03);
}
.gm-world .sp-head {
  display: flex; align-items: baseline; justify-content: space-between;
  padding: 0 2px 12px; margin-bottom: 14px;
  border-bottom: 1px dashed rgba(255, 255, 255, 0.10);
}
.gm-world .sp-title { font-size: 12px; font-weight: 800; letter-spacing: 5px; color: #FFC85C; }
.gm-world .sp-sub { font-size: 10.5px; letter-spacing: .5px; color: rgba(231, 241, 250, 0.38); }
.gm-world .stage-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.gm-world .stage-cell {
  position: relative; height: 118px;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  border-radius: 12px; padding: 0;
  background: linear-gradient(180deg, #16375A 0%, #0B2036 100%);
  border: 2px solid #2A4A6E;
  box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  cursor: pointer;
}
.gm-world .stage-cell:hover { border-color: #3E6796; transform: translateY(-1px); }
.gm-world .stage-cell:active { transform: translateY(4px); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.45); }
.sc-num { font-size: 34px; font-weight: 900; line-height: 1; color: #E7F1FA; font-variant-numeric: tabular-nums; text-shadow: 0 3px 0 rgba(0, 0, 0, 0.5); }
.sc-state { margin-top: 6px; font-size: 11px; letter-spacing: .5px; color: rgba(231, 241, 250, 0.45); }
.sc-boss {
  position: absolute; top: -2px; left: 50%; transform: translateX(-50%);
  padding: 1px 10px; border-radius: 0 0 6px 6px;
  font-size: 10px; font-weight: 900; letter-spacing: 2px;
  color: #FFE3D6; background: linear-gradient(180deg, #E8563C, #A82A18);
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.35);
}
.gm-world .stage-cell.done {
  background: linear-gradient(180deg, #0E2E33 0%, #081E23 100%);
  border-color: #2F7F63;
  box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45), inset 0 0 24px rgba(91, 217, 165, 0.08);
}
.gm-world .stage-cell.done .sc-num { color: #5BD9A5; }
.gm-world .stage-cell.done .sc-state { color: rgba(91, 217, 165, 0.72); }
.gm-world .stage-cell.next {
  background: linear-gradient(180deg, #3A2C0F 0%, #241A08 100%);
  border-color: #FFC85C;
  animation: nodePulseV40pc 1.6s ease-in-out infinite;
}
.gm-world .stage-cell.next .sc-num { color: #FFC85C; }
.gm-world .stage-cell.next .sc-state { color: #FFD977; font-weight: 800; }
@keyframes nodePulseV40pc {
  0%, 100% { box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45), 0 0 0 0 rgba(255, 200, 92, 0); }
  50% { box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45), 0 0 0 9px rgba(255, 200, 92, 0.12); }
}
.gm-world .stage-cell.lock {
  background: linear-gradient(180deg, #0E2035 0%, #0A1728 100%);
  border: 2px dashed rgba(255, 255, 255, 0.12);
  box-shadow: none; cursor: not-allowed;
}
.gm-world .stage-cell.lock:hover { transform: none; border-color: rgba(255, 255, 255, 0.12); }
.gm-world .stage-cell.lock .sc-num { color: rgba(231, 241, 250, 0.22); text-shadow: none; }
.gm-world .stage-cell.lock .sc-state { color: rgba(231, 241, 250, 0.24); }
.gm-world .stage-cell .lock-ico { position: absolute; top: 10px; right: 10px; transform: scale(0.85); transform-origin: top right; border-color: rgba(255, 255, 255, 0.28); }
.gm-world .stage-cell .lock-ico::before { border-color: rgba(255, 255, 255, 0.28); }
.gm-world .stage-cell.boss { border-color: rgba(232, 86, 60, 0.65); }
.gm-world .stage-cell.boss .sc-num { color: #FFB08A; }
.gm-world .stage-cell.boss.next { border-color: #FF6B5A; animation: nodeBossPulseV40pc 1.4s ease-in-out infinite; }
.gm-world .stage-cell.boss.next .sc-num { color: #FFD0B8; }
@keyframes nodeBossPulseV40pc {
  0%, 100% { box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45), 0 0 0 0 rgba(255, 107, 90, 0); }
  50% { box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45), 0 0 0 9px rgba(255, 107, 90, 0.16); }
}
.gm-world .stage-cell.boss.done { border-color: rgba(91, 217, 165, 0.55); }

/* —— 侧栏 —— */
.gm-world .side-box {
  padding: 12px 14px 14px; border-radius: 12px;
  background: linear-gradient(180deg, #15335A, #0C2138);
  border: 1px solid #2A4A6E;
  box-shadow: 0 4px 0 rgba(0, 0, 0, 0.35);
}
.gm-world .side-label { font-size: 10px; letter-spacing: 2px; color: rgba(231, 241, 250, 0.42); }
.gm-world .side-value { font-size: 26px; font-weight: 900; color: #FFC85C; line-height: 1.2; font-variant-numeric: tabular-nums; }
.gm-world .side-value i { font-style: normal; font-size: 12px; color: rgba(255, 200, 92, 0.55); }
.gm-world .prog-track { height: 8px; margin-top: 8px; border-radius: 999px; background: rgba(255, 255, 255, 0.10); overflow: hidden; }
.gm-world .prog-fill { height: 100%; border-radius: 999px; background: linear-gradient(90deg, #FFD977, #F0A93C); }
.gm-world .skin-box { display: flex; align-items: center; gap: 12px; cursor: pointer; padding: 12px 14px; }
.gm-world .skin-sprite-mini { flex: none; }
.gm-world .skin-name { font-size: 14px; font-weight: 800; color: #EAF4FB; margin: 2px 0 4px; }
.gm-world .skin-using { display: inline-block; font-size: 10px; letter-spacing: 1px; color: #5BD9A5; border: 1px solid rgba(91, 217, 165, 0.45); border-radius: 999px; padding: 1px 8px; }

/* —— 街机金键 —— */
.gm-world .gm-cta {
  margin-top: auto;
  display: flex; align-items: center; justify-content: center; gap: 10px;
  height: 56px; border-radius: 12px; border: 2px solid #FFE0A0;
  background: linear-gradient(180deg, #FFD977 0%, #F0A93C 100%);
  box-shadow: 0 7px 0 #A2651A, 0 14px 24px rgba(0, 0, 0, 0.4);
  color: #3A2410; font-size: 17px; font-weight: 900; letter-spacing: 2px; cursor: pointer;
}
.gm-world .gm-cta:hover { filter: brightness(1.04); }
.gm-world .gm-cta:active { transform: translateY(5px); box-shadow: 0 2px 0 #A2651A; }
.gm-cta-arrow {
  width: 0; height: 0;
  border-left: 13px solid #3A2410; border-top: 8px solid transparent; border-bottom: 8px solid transparent;
}

/* V40b：PC 横幅改左右分栏（左像素场景 / 右标题文案），并补「下一个对手」卡 */
.gm-world .game-banner { display: flex; height: 192px; }
.gm-world .gb-art {
  position: relative; flex: 0 0 330px; overflow: hidden;
  border-right: 2px solid #2A4A6E; background: #0A1B2E;
}
.gm-world .gb-art .gb-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 42%; }
.gm-world .gb-text {
  position: relative; flex: 1; min-width: 0;
  display: flex; flex-direction: column; justify-content: center;
  padding: 0 30px;
  background:
    radial-gradient(ellipse 60% 120% at 0% 50%, rgba(96, 205, 165, 0.10) 0, transparent 62%),
    linear-gradient(90deg, #0B1F36 0%, #0A1B2E 100%);
}
.gm-world .gb-kicker { position: static; margin-bottom: 10px; font-size: 11px; letter-spacing: 6px; color: #FFC85C; }
.gm-world .gb-title { position: static; font-size: 40px; letter-spacing: 2px; }
.gm-world .gb-desc { position: static; margin-top: 10px; font-size: 12.5px; }

/* 「下一个对手」预告卡 */
.gm-world .foe-box { padding: 12px 14px; }
.gm-world .foe-row { display: flex; align-items: center; gap: 12px; margin-top: 6px; }
.gm-world .foe-sprite { flex: none; width: 56px; height: 56px; display: flex; align-items: flex-end; justify-content: center; }
.gm-world .foe-name { font-size: 14px; font-weight: 800; color: #EAF4FB; }
.gm-world .foe-tag { margin-top: 3px; font-size: 10.5px; color: rgba(255, 150, 120, 0.85); letter-spacing: .5px; }

/* V41：PC 结算页同套像素面板 */
.gm-result .over-card,
.gm-world ~ .over-card,
.over-card {
  background: linear-gradient(180deg, #0F2743 0%, #08182B 100%) !important;
  border: 2px solid #24456A !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 0 rgba(0, 0, 0, 0.45) !important;
}
.over-title { color: #FFC85C; font-size: 30px; font-weight: 900; letter-spacing: 2px; text-shadow: 0 4px 0 #05101F; }
.over-title.lose { color: #FF9E8A; }
.over-desc { color: rgba(231, 241, 250, 0.62) !important; }
.over-stats .pill, .over-stats > span { background: rgba(255, 255, 255, 0.06) !important; border-color: rgba(255, 255, 255, 0.12) !important; color: #EAF4FB !important; }
.over-btns .game-go {
  background: linear-gradient(180deg, #FFD977 0%, #F0A93C 100%) !important;
  color: #3A2410 !important; border: 2px solid #FFE0A0 !important;
  box-shadow: 0 8px 0 #A2651A !important; border-radius: 14px !important;
  font-weight: 900 !important; letter-spacing: 1px;
}
.over-btns .game-go:active { transform: translateY(6px); box-shadow: 0 2px 0 #A2651A !important; }
.over-btns .ch-back {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(231, 241, 250, 0.72) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
  border-radius: 14px !important;
}

/* 结算面板收窄成「游戏结束弹窗」，不要铺满整个内容区 */
.game-wrap > .over-card { max-width: 640px; margin: 36px auto; }

/* V42：六套关卡场景（同构图不同色域）—— 用 class 覆盖 .gba-scene 的背景图层 */
.gba-scene.bg1 { background-image: url('/assets/cast/pxbg1.png?v=1'); }
.gba-scene.bg2 { background-image: url('/assets/cast/pxbg2.png?v=1'); }
.gba-scene.bg3 { background-image: url('/assets/cast/pxbg3.png?v=1'); }
.gba-scene.bg4 { background-image: url('/assets/cast/pxbg4.png?v=1'); }
.gba-scene.bg5 { background-image: url('/assets/cast/pxbg5.png?v=1'); }
.gba-scene.bg6 { background-image: url('/assets/cast/pxbg6.png?v=1'); }
.gba-scene.bg1, .gba-scene.bg2, .gba-scene.bg3,
.gba-scene.bg4, .gba-scene.bg5, .gba-scene.bg6 { background-position: center; background-size: 100% 100%; background-repeat: no-repeat; }

/* ======= V43：PC 战斗右侧改成「指令台」（与小程序同构） ======= */
.battle-deck {
  background: linear-gradient(180deg, #0E2743 0%, #08182B 100%);
  border: 2px solid #1E3E60;
  border-radius: 14px;
  box-shadow: 0 8px 0 rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  padding: 14px 14px 16px;
}
.battle-deck .gq-head { align-items: center; }
.battle-deck .gq-idx { color: rgba(231, 241, 250, 0.45); font-size: 12px; letter-spacing: .5px; }
.battle-deck .gq-time { color: #FFC85C; font-weight: 900; }
.battle-deck .gq-time.warn { color: #FF6B5A; }
.battle-deck .gq-sfx { color: rgba(231, 241, 250, 0.55); border-color: rgba(255, 255, 255, 0.12); }
.battle-deck .gq-timebar { height: 6px; background: rgba(255, 255, 255, 0.08); border-radius: 999px; margin: 8px 0 12px; }
.battle-deck .gq-timefill { background: linear-gradient(90deg, #5BD9A5, #FFC85C); border-radius: 999px; }
.battle-deck .gq-timefill.warn { background: linear-gradient(90deg, #FF9E8A, #EC7063); }
/* 影像情报框 */
#gqMedia {
  position: relative; padding: 6px;
  background: #04101B; border: 2px solid #23445F; border-radius: 10px;
  box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.7);
  background-image: repeating-linear-gradient(0deg, rgba(120, 220, 255, 0.045) 0, rgba(120, 220, 255, 0.045) 1px, transparent 1px, transparent 3px);
}
#gqMedia .gq-img { height: 236px; border: none; border-radius: 6px; background: #04101B; }
#gqMedia .gq-ecg { height: 236px; display: flex; align-items: center; justify-content: center; color: #7FD1D4; font-size: 16px; font-weight: 700; }
.battle-deck .gq-stem { color: #EAF4FB; font-size: 14px; font-weight: 600; margin: 14px 2px 12px; }
/* 2×2 指令键 */
.battle-deck .gq-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.battle-deck .gq-opt {
  min-height: 54px; padding: 10px 12px;
  background: linear-gradient(180deg, #17395E, #0D2238);
  border: 2px solid #2A4A6E; border-radius: 8px;
  color: #EAF4FB; font-size: 13.5px; line-height: 1.35;
  box-shadow: 0 4px 0 rgba(0, 0, 0, 0.5);
  transition: transform .08s, background .12s, border-color .12s;
}
.battle-deck .gq-opt:hover { background: linear-gradient(180deg, #1D446E, #102A45); border-color: #3E6796; }
.battle-deck .gq-opt:active { transform: translateY(3px); box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); }
.battle-deck .gq-opt-key {
  width: 26px; height: 26px; border-radius: 6px;
  background: linear-gradient(180deg, #FFD977, #E0A63C);
  color: #3A2410; font-weight: 900; box-shadow: 0 2px 0 #A2651A;
}
.battle-deck .gq-opt.right { background: rgba(47, 191, 127, 0.26); border-color: #2FBF7F; box-shadow: 0 4px 0 rgba(0, 0, 0, .5), inset 0 0 20px rgba(47, 191, 127, .28); }
.battle-deck .gq-opt.right .gq-opt-key { background: linear-gradient(180deg, #6BE8A0, #2FBF7F); color: #07301F; box-shadow: none; }
.battle-deck .gq-opt.wrong { background: rgba(236, 112, 99, 0.26); border-color: #EC7063; box-shadow: 0 4px 0 rgba(0, 0, 0, .5), inset 0 0 20px rgba(236, 112, 99, .28); }
.battle-deck .gq-opt.wrong .gq-opt-key { background: linear-gradient(180deg, #FF9E8A, #EC7063); color: #3A0F0A; box-shadow: none; }

/* ======= V51：PC 商城收进游戏世界（与小程序同构） ======= */
.shop-mask { background: rgba(3, 9, 16, 0.78); backdrop-filter: blur(2px); }
.shop-panel {
  width: 720px; max-width: 92vw; max-height: 82vh;
  background: linear-gradient(180deg, #0F2743 0%, #08182B 100%);
  border: 2px solid #24456A; border-radius: 18px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.6);
  padding: 20px 22px 24px;
}
.shop-head { border-bottom: 1px dashed rgba(255, 255, 255, 0.10); padding-bottom: 14px; }
.shop-title { color: #FFC85C; letter-spacing: 2px; font-size: 19px; }
.shop-points {
  background: rgba(255, 200, 92, 0.12);
  border: 1px solid rgba(255, 200, 92, 0.40);
  color: #FFD977; font-weight: 800; border-radius: 999px; padding: 4px 12px; font-size: 13px;
}
.shop-close { color: rgba(231, 241, 250, 0.55); cursor: pointer; }
.shop-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 16px; }
.shop-item {
  background: linear-gradient(180deg, #15335A 0%, #0B2036 100%);
  border: 2px solid #2A4A6E; border-radius: 14px;
  padding: 12px 12px 14px; box-shadow: 0 5px 0 rgba(0, 0, 0, 0.45);
}
.shop-sprite {
  height: 150px; border-radius: 10px;
  background:
    radial-gradient(circle at 50% 62%, rgba(255, 200, 92, 0.16) 0%, rgba(255, 200, 92, 0) 68%),
    rgba(0, 0, 0, 0.22);
  border: 1px solid rgba(255, 255, 255, 0.06);
  display: flex; align-items: flex-end; justify-content: center; padding-bottom: 8px;
}
.shop-name { color: #EAF4FB; font-size: 15px; font-weight: 800; margin-top: 10px; }
.shop-desc { color: rgba(231, 241, 250, 0.42); font-size: 12px; line-height: 1.45; min-height: 34px; margin-top: 4px; }
.shop-act { margin-top: 8px; }
.shop-btn {
  width: 100%; height: 38px; border-radius: 9px; border: none;
  font-size: 13.5px; font-weight: 900; letter-spacing: .5px; cursor: pointer;
}
.shop-btn.buy { background: linear-gradient(180deg, #FFD977, #F0A93C); color: #3A2410; box-shadow: 0 4px 0 #A2651A; }
.shop-btn.buy:active { transform: translateY(3px); box-shadow: 0 1px 0 #A2651A; }
.shop-btn.use { background: rgba(255, 255, 255, 0.06); color: rgba(231, 241, 250, 0.78); border: 1px solid rgba(255, 255, 255, 0.18); }
.shop-using {
  display: block; text-align: center; height: 38px; line-height: 36px;
  color: #5BD9A5; font-size: 13px; font-weight: 800; letter-spacing: 1px;
  border: 1px solid rgba(91, 217, 165, 0.45); border-radius: 9px; background: rgba(91, 217, 165, 0.08);
}

/* V52：侧栏补「本关任务」卡 + HUD 中文标题排版 */
.gm-world .gm-hud-k { letter-spacing: 1px; font-size: 10.5px; }
.gm-world .quest-box { padding: 12px 14px 14px; }
.gm-world .quest-row {
  display: flex; align-items: center; gap: 8px;
  margin-top: 9px; font-size: 12.5px; line-height: 1.35;
  color: rgba(231, 241, 250, 0.62);
}
.gm-world .q-dot { width: 6px; height: 6px; flex: none; background: #FFC85C; box-shadow: 0 0 6px rgba(255, 200, 92, .5); }
.gm-world .gm-cta { margin-top: 12px; }

/* V52b：侧栏加卡后整列变高，收一点尺寸让主按钮留在首屏 */
.gm-world .game-banner { height: 176px; }
.gm-world .stage-cell { height: 108px; }

/* V53：PC 结算双按钮同套键帽（金 / 钢蓝） */
.over-btns { display: flex; gap: 10px; align-items: stretch; }
.over-btns .game-go, .over-btns .ch-back {
  flex: 1 1 0; height: 54px; border-radius: 14px !important;
  font-size: 15.5px; font-weight: 900; margin-top: 0;
}
.over-btns .ch-back {
  background: linear-gradient(180deg, #23445F 0%, #16304A 100%) !important;
  color: #E7F1FA !important;
  border: 2px solid #3A6288 !important;
  box-shadow: 0 7px 0 #0B1A2A !important;
}
.over-btns .ch-back:active { transform: translateY(5px); box-shadow: 0 2px 0 #0B1A2A !important; }

/* V54：关卡面板填满 + 图例；标题中文字距归零；按钮投影统一 */
.gm-world .stage-panel { display: flex; flex-direction: column; }
.gm-world .stage-list { flex: 1 1 auto; align-content: space-evenly; }
.gm-world .stage-legend {
  display: flex; align-items: center; gap: 16px;
  margin-top: 14px; padding-top: 12px;
  border-top: 1px dashed rgba(255, 255, 255, 0.10);
  font-size: 11.5px; color: rgba(231, 241, 250, 0.45);
}
.gm-world .stage-legend span { display: flex; align-items: center; gap: 6px; }
.gm-world .stage-legend .lg { width: 8px; height: 8px; flex: none; }
.gm-world .stage-legend .lg.done { background: #2F7F63; }
.gm-world .stage-legend .lg.next { background: #FFC85C; }
.gm-world .stage-legend .lg.lock { background: transparent; border: 1px dashed rgba(255, 255, 255, 0.30); }
.gm-world .stage-legend .lg-hint { margin-left: auto; color: rgba(255, 200, 92, 0.55); }

/* 中文标题不要字距 */
.gm-world .sp-title, .gm-world .gm-hud-k, .shop-title,
.gm-world .side-label, .battle-deck .gq-idx { letter-spacing: 0 !important; }

/* 两颗按钮投影同一强度：硬底边 + 柔和环境影 */
.over-btns .game-go {
  box-shadow: 0 7px 0 #A2651A, 0 14px 22px rgba(0, 0, 0, 0.45) !important;
}
.over-btns .ch-back {
  border-color: #3A6288 !important;
  box-shadow: 0 7px 0 #3A6288, 0 14px 22px rgba(0, 0, 0, 0.45) !important;
}
.over-btns .ch-back:active { box-shadow: 0 2px 0 #3A6288, 0 4px 8px rgba(0, 0, 0, 0.35) !important; }
.over-btns .game-go:active { box-shadow: 0 2px 0 #A2651A, 0 4px 8px rgba(0, 0, 0, 0.35) !important; }

.gm-world .gb-title { letter-spacing: 0 !important; }

.gm-world .gb-kicker, .gm-world .sp-sub { letter-spacing: 1px; }

/* V55：关卡数字收一号，状态文字更突出；进度数字与标题拉开 */
.gm-world .sc-num { font-size: 28px; }
.gm-world .sc-state { font-size: 11.5px; margin-top: 7px; }
.gm-world .side-value { margin-top: 6px; font-size: 24px; line-height: 1.15; }
.gm-world .side-value i { margin-left: 2px; }

/* ======= V56（PC）：特效锚点对齐角色中心 + 斩击重做 =======
   实测：怪兽 (69%, 54.1%)、主角 (31%, 54.4%)；旧锚点 59.5% 偏低 21px。 */
.gba-slash2, .gba-impact, .gba-debris { left: 69%; top: 54%; }
.gba-dmg { left: 69%; top: 36%; }
.gba-claw { left: 31%; top: 54%; }
.gba-slash2 {
  width: 160px; height: 160px; margin: -80px 0 0 -80px;
  background: linear-gradient(128deg, transparent 47.6%, rgba(255, 255, 255, 0.92) 50%, transparent 52.4%);
}
.gba-slash2::before { inset: 0; border: 14px solid transparent; border-top-color: #FFD86B; border-right-color: rgba(255, 216, 107, 0.55); transform: rotate(-40deg); }
.gba-slash2::after { inset: 22px; border: 8px solid transparent; border-top-color: #FFFDF2; transform: rotate(-40deg); }
.gba-slash2.on { animation: slashArcV56pc 0.27s cubic-bezier(0.2, 0.75, 0.3, 1); }
@keyframes slashArcV56pc {
  0%   { opacity: 0; transform: scale(0.5) rotate(-24deg); }
  22%  { opacity: 1; transform: scale(1.02) rotate(-2deg); }
  60%  { opacity: 0.85; transform: scale(1.1) rotate(8deg); }
  100% { opacity: 0; transform: scale(1.2) rotate(20deg); }
}
.gba-impact { width: 104px; height: 104px; margin: -52px 0 0 -52px; }
.gba-hero.atk-move { animation: heroAtkV56pc 0.46s cubic-bezier(0.3, 0.6, 0.4, 1); }
@keyframes heroAtkV56pc {
  0%   { transform: translate(0, 0) scale(1, 1); }
  12%  { transform: translate(-8px, 5px) scale(1.1, 0.9); }
  30%  { transform: translate(82px, -3px) scale(0.94, 1.08); }
  40%  { transform: translate(78px, -5px) scale(1.06, 1.02); }
  64%  { transform: translate(72px, 0) scale(1, 1); }
  100% { transform: translate(0, 0) scale(1, 1); }
}

.gba-claw { left: 31%; top: 54%; width: 104px; height: 104px; margin: -52px 0 0 -52px; }
.gba-claw::before {
  background: repeating-linear-gradient(112deg, transparent 0 18px, rgba(255, 84, 62, 0.92) 18px 23px, transparent 23px 40px);
}

.gba-claw { left: 31%; top: 57%; width: 118px; height: 118px; margin: -59px 0 0 -59px; }
.gba-claw::before {
  background: repeating-linear-gradient(104deg, transparent 0 19px, rgba(255, 92, 70, 0.92) 19px 24px, transparent 24px 42px);
}

.gba-claw { width: 92px; height: 92px; margin: -46px 0 0 -46px; left: 31%; top: 57%; }

.gba-claw { width: 104px; height: 104px; margin: -52px 0 0 -52px; left: 31%; top: 56%; }
.gba-claw::before {
  background: repeating-linear-gradient(104deg, transparent 0 9px, rgba(255, 96, 72, 0.95) 9px 15px, transparent 15px 26px);
}

/* ======= V57（PC）：斩击去白块 ======= */
.gba-slash2 { width: 150px; height: 150px; margin: -75px 0 0 -75px; background: none; }
.gba-slash2::before {
  inset: 0; border: 12px solid transparent;
  border-top-color: rgba(255, 214, 107, 0.95);
  border-right-color: rgba(255, 214, 107, 0.28);
  transform: rotate(-46deg);
}
.gba-slash2::after {
  inset: 11px; border: 4px solid transparent;
  border-top-color: rgba(255, 255, 255, 0.92);
  transform: rotate(-46deg);
}
.gba-slash2.on { animation: slashArcV57pc 0.2s cubic-bezier(0.15, 0.8, 0.25, 1); }
@keyframes slashArcV57pc {
  0%   { opacity: 0; transform: scale(0.62) rotate(-28deg); }
  18%  { opacity: 1; transform: scale(1) rotate(-6deg); }
  55%  { opacity: 0.75; transform: scale(1.06) rotate(6deg); }
  100% { opacity: 0; transform: scale(1.14) rotate(22deg); }
}
.gba-impact { width: 74px; height: 74px; margin: -37px 0 0 -37px; }
.gba-impact.on { animation: impactPopV57pc 0.18s ease-out; }
@keyframes impactPopV57pc {
  0%   { opacity: 0; transform: scale(0.25) rotate(0); }
  30%  { opacity: 1; transform: scale(1.05) rotate(16deg); }
  100% { opacity: 0; transform: scale(0.5) rotate(38deg); }
}

.vfx-layer { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 8; pointer-events: none; }

/* V60：受击白闪层 */
.gba-mon { position: relative; }
.px-white { position: absolute; left: 0; top: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.px-white.on { opacity: 1; }

/* V64：PC 结算评级徽章 */
.over-card { position: relative; }
.over-rank {
  position: absolute; left: 50%; top: -14px; transform: translateX(-50%) rotate(-6deg);
  width: 62px; height: 62px; line-height: 56px; text-align: center;
  font-size: 34px; font-weight: 900; font-style: italic;
  color: #3A2410; border-radius: 12px;
  background: linear-gradient(180deg, #FFF0B8 0%, #FFC85C 55%, #E8A02E 100%);
  border: 3px solid #7A4A12; box-shadow: 0 6px 0 #8A5416, 0 10px 22px rgba(0,0,0,.45);
  animation: rankPopPc .42s cubic-bezier(.2,1.3,.4,1) both; z-index: 3;
}
.over-rank.r-S { background: linear-gradient(180deg, #FFF6D0, #FFD35C 50%, #E8901E); }
.over-rank.r-A { background: linear-gradient(180deg, #F0F7FF, #B9D7F0 50%, #7FA8CC); color: #14283C; }
.over-rank.r-B { background: linear-gradient(180deg, #F6E8D8, #C9A98A 50%, #9A7A5A); color: #2A1A0E; }
.over-rank.r-D { background: linear-gradient(180deg, #E8E8E8, #9AA0A6 50%, #5E646A); color: #10151A; }
@keyframes rankPopPc {
  0%   { opacity: 0; transform: translateX(-50%) rotate(-24deg) scale(.4); }
  60%  { opacity: 1; transform: translateX(-50%) rotate(-2deg) scale(1.12); }
  100% { opacity: 1; transform: translateX(-50%) rotate(-6deg) scale(1); }
}

/* V64b：评级章移到右上角，避免被卡片裁切 */
.over-rank {
  left: auto; right: 18px; top: 14px;
  width: 54px; height: 54px; line-height: 48px; font-size: 29px;
  transform: rotate(-8deg);
  animation: rankPopPc2 .42s cubic-bezier(.2,1.3,.4,1) both;
}
@keyframes rankPopPc2 {
  0%   { opacity: 0; transform: rotate(-30deg) scale(.35); }
  60%  { opacity: 1; transform: rotate(-4deg) scale(1.15); }
  100% { opacity: 1; transform: rotate(-8deg) scale(1); }
}

/* V65：关卡格星级 */
.sc-stars { display: flex; justify-content: center; gap: 1px; margin-top: 1px; }
.sc-stars i { font-style: normal; font-size: 10px; line-height: 1; color: rgba(255,255,255,.16); }
.sc-stars i.on { color: #FFC85C; text-shadow: 0 0 6px rgba(255,200,92,.55); }

/* V69：命中挤压 */
.gba-mon.mon-squash { animation: monSquashPc 0.14s cubic-bezier(0.2, 1.3, 0.4, 1); }
@keyframes monSquashPc {
  0%   { transform: scale(1, 1); }
  35%  { transform: scale(1.22, 0.78) translateY(4px); }
  70%  { transform: scale(0.96, 1.05) translateY(-1px); }
  100% { transform: scale(1, 1); }
}

/* V81：主角阵亡像素碎裂（PC 原来没有 hero-die 样式，补一套） */
.gba-hero-pad.hero-die .gba-hero { animation: heroShatterPc 0.16s steps(1, end) forwards; }
@keyframes heroShatterPc {
  0%   { opacity: 1; transform: scale(1); }
  30%  { opacity: 1; transform: scale(1.07); }
  100% { opacity: 0; transform: scale(1); }
}

/* V83（PC）：组合判读按检查分节 + 题目标签 + 整体判断双图 */
.cb-sec { padding-top: 14px; }
.cb-sec-head { font-size: 14px; margin-bottom: 10px; padding-bottom: 8px; border-bottom: 1px dashed rgba(0,0,0,.08); }
.cb-sec-head.overall { color: #B7791F; font-weight: 700; border-bottom-color: rgba(183,121,31,.25); }
.cb-qcard { margin-top: 14px; padding: 12px 14px; border-radius: 10px; background: rgba(0,0,0,.015); border: 1px solid rgba(0,0,0,.05); }
.cb-scope { display: inline-block; margin-bottom: 8px; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;
  color: #2B6CB0; background: rgba(66,153,225,.12); border: 1px solid rgba(66,153,225,.25); }
.cb-scope.overall { color: #B7791F; background: rgba(214,158,46,.14); border-color: rgba(214,158,46,.35); }
.cb-dual { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 1100px) { .cb-dual { grid-template-columns: 1fr; } }
.cb-dual-cell { min-width: 0; }
.cb-dual .cb-media img { max-height: 320px; object-fit: contain; }

/* V83b：组合判读影像限高，避免一张图占满整屏把题目挤下去 */
.cb-sec .cb-media img { max-height: 46vh; width: auto; max-width: 100%; object-fit: contain; display: block; }
.cb-sec .cb-media { background: #0D1B2A; border-radius: 8px; padding: 6px; }
.cb-sec .cb-media img[src*="/ecg/"] { max-height: 300px; max-width: none; }

/* V83c：影像容器不再铺满整行深色底，改为居中显示 */
.cb-sec .cb-media { background: transparent; padding: 0; text-align: center; }
.cb-sec .cb-media img { margin: 0 auto; border-radius: 8px; background: #0D1B2A; }
.cb-sec .cb-media img[src*="/xray/"], .cb-sec .cb-media img[src*="/ct/"] { max-height: 52vh; }

/* V85：组合判读 PC —— 检查一/检查二 左右并列，整体判断横跨下方 */
.cb-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 12px; align-items: start; }
.cb-cols > .cb-sec { margin-top: 0 !important; }
@media (max-width: 1180px) { .cb-cols { grid-template-columns: 1fr; } }
/* 分栏后单栏更窄：影像限高更小，避免把题目挤到下一屏 */
.cb-cols .cb-media img { max-height: 360px; }
.cb-cols .cb-media img[src*="/xray/"], .cb-cols .cb-media img[src*="/ct/"] { max-height: 380px; }
.cb-cols .cb-media img[src*="/ecg/"] { min-width: 520px; max-height: 240px; }
/* 整体判断横跨整行，双图并排 */
.cb-sec-overall { margin-top: 14px !important; border: 1px solid rgba(214,158,46,.35); }
.cb-sec-overall .cb-media img { max-height: 300px; }

/* V85b：心电图别用深色底，避免两侧出现黑边（用纸白更贴合原图） */
.cb-media img[src*="/ecg/"] { background: #FFFFFF !important; }
/* 分栏内影像统一圆角与内阴影，观感更"嵌进卡片" */
.cb-cols .cb-media { border-radius: 10px; overflow: hidden; }

/* V85c：整体判断里的双图统一高度、垂直居中，避免一高一矮 */
.cb-sec-overall .cb-media img,
.cb-sec-overall .cb-media img[src*="/xray/"],
.cb-sec-overall .cb-media img[src*="/ct/"],
.cb-sec-overall .cb-media img[src*="/ecg/"] { max-height: 280px !important; min-width: 0 !important; width: auto; max-width: 100%; }
.cb-sec-overall .cb-dual-cell .cb-media {
  display: flex; align-items: center; justify-content: center;
  min-height: 280px; padding: 8px; background: #F7F9FC; border-radius: 10px;
}

/* V85d：左右两栏影像统一高度，让下面的题目起点对齐 */
.cb-cols .cb-media {
  display: flex; align-items: center; justify-content: center;
  min-height: 330px; padding: 8px; background: #F7F9FC; border-radius: 10px;
}
.cb-cols .cb-media img,
.cb-cols .cb-media img[src*="/xray/"],
.cb-cols .cb-media img[src*="/ct/"] { max-height: 314px !important; }
.cb-cols .cb-media img[src*="/ecg/"] { max-height: 260px !important; min-width: 0 !important; }

/* V91：组合判读影像区 = 阅片器（深蓝阅片底 + 工具条复用 gd-fab） */
.cb-viewer-wrap { position: relative; }
.cb-viewer {
  background: #0B1F3E; border-radius: 8px; overflow: auto;
  display: flex; align-items: center; justify-content: center;
  min-height: 240px; max-height: 400px;
}
.cb-vimg { max-width: 100%; max-height: 400px; object-fit: contain; display: block; }
.cb-viewer-wrap .gd-fab { position: absolute; right: 10px; bottom: 10px; z-index: 2; }
/* V92：真金判读左右面板等高（报告卡拉伸到与阅片卡一致） */
.gold-grid { align-items: stretch; }
.gold-grid > .card { display: flex; flex-direction: column; }
.gold-grid .gd-write-card .ta:last-of-type { flex: 1 1 auto; min-height: 96px; }

/* V93：cb-viewer 用 margin:auto 居中（放大后可从边缘滚动，flex 居中会裁掉起点） */
.cb-viewer { display: flex; }
.cb-vimg { margin: auto; }

/* V94：阅片器边框 + 拖拽光标；情境卡深蓝 */
.cb-viewer { border: 1px solid #2E5A96; box-shadow: inset 0 0 0 1px rgba(0,0,0,.2); }
.cb-viewer.zoomed { cursor: grab; }
.cb-viewer.panning { cursor: grabbing; }
.cb-scene {
  background: linear-gradient(180deg, #152A45 0%, #0B1F3E 100%);
  border: 1px solid rgba(120, 170, 255, .18);
}
.cb-scene h3 { color: #FFFFFF; }
.cb-scene .q-hint { color: #C8D8EC; }
.cb-scene .q-hint b { color: #FFFFFF; }
.cb-scene .q-hint .muted, .cb-scene .muted { color: #9FB3CC !important; }

/* V95：只有「病情介绍」块是深蓝（卡片本身保持白卡），标题恢复深色 */
.cb-scene-box {
  background: linear-gradient(180deg, #152A45 0%, #0B1F3E 100%);
  border: 1px solid rgba(120, 170, 255, .18);
  border-radius: 10px;
  padding: 14px 16px;
  color: #C8D8EC !important;
  line-height: 1.75;
}
.cb-scene-box b { color: #FFFFFF; }
.cb-scene-box .muted { color: #9FB3CC !important; }

/* V96：阅片器固定高度，未放大时无滚动条 */
.cb-viewer { height: 400px; overflow: hidden; }
.cb-vimg { max-height: 100%; }

/* 2026-10-21 题干（服务端下发 stem） */
.q-stem { margin: 12px 0 2px; font-size: 15px; font-weight: 600; line-height: 1.55; color: var(--ink, #12233A); }

/* 2026-10-21 结构化报告 · 评分标准逐条对照 */
.gd-rubric { display: flex; flex-direction: column; gap: 6px; margin: 10px 0 4px; }
.gd-rb-item { display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px;
  border-radius: 8px; background: #F7F9FC; border: 1px solid #E8EEF6; font-size: 13px; line-height: 1.5; }
.gd-rb-item.ok { background: #F1F9F3; border-color: #CBE7D4; }
.gd-rb-item.no { background: #FDF3F3; border-color: #F3D2D2; }
.gd-rb-mark { flex: none; width: 16px; text-align: center; font-weight: 600; }
.gd-rb-item.ok .gd-rb-mark { color: #2E9E5B; }
.gd-rb-item.no .gd-rb-mark { color: #E5484D; }
.gd-rb-label { flex: 1; color: #12233A; }
.gd-rb-w { flex: none; color: #6B7C90; font-size: 12px; }
.gd-rb-ev { flex-basis: 100%; color: #6B7C90; font-size: 12px; padding-left: 24px; }

/* 2026-10-21 真金判读 · 阅卷中（提交后立刻可见的反馈卡） */
.gd-loading {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 10px; padding: 28px 20px; margin-top: 16px;
  background: #FFFFFF; border: 1px solid #E8EEF6; border-radius: 14px;
  box-shadow: 0 6px 18px rgba(11, 31, 62, .06); color: #12233A;
}
.gd-loading b { font-size: 15px; font-weight: 600; }
.gd-loading-sub { font-size: 13px; color: #6B7C90; }
.gd-loading-dots { display: flex; gap: 6px; }
.gd-loading-dots span {
  width: 8px; height: 8px; border-radius: 50%; background: #F4511E;
  animation: gdBlink 1.1s infinite ease-in-out;
}
.gd-loading-dots span:nth-child(2) { animation-delay: .16s; }
.gd-loading-dots span:nth-child(3) { animation-delay: .32s; }
@keyframes gdBlink {
  0%, 80%, 100% { opacity: .25; transform: translateY(0); }
  40% { opacity: 1; transform: translateY(-3px); }
}