/* ============================================================
 * HALLUCINATION HUNT — 模拟聊天审查界面
 *
 * 设计基调：浅色、AI Chat 产品感（内容窄栏居中、低对比边框、克制蓝 accent、
 * 大面积留白）。Arcade 个性只作为第二层（少量状态色 + 鲸鱼娘 verifier）。
 * 页面外壳变量仍复用 shared/arcade.css。
 *
 * 重要：所有既有元素 id 全部保留，这里只改变它们的呈现与层级。
 * ============================================================ */

:root {
  --hunt-bg: #f5f7fb;
  --hunt-surface: #ffffff;
  --hunt-side: #f8fafc;
  --hunt-line: #e6ebf2;
  --hunt-line-2: #d8e0ea;
  --hunt-ink: #1b2733;
  --hunt-ink-2: #57697c;
  --hunt-ink-3: #8b99a8;
  --hunt-accent: #4d6bfe;
  --hunt-accent-soft: #eef2ff;
  --hunt-ok: #0f9d8f;
  --hunt-bad: #d9534f;
  --hunt-radius: 12px;
  --hunt-content: 720px;      /* 聊天内容最大宽度：窄栏居中，两侧留白 */
}

/* .action-panel 是 flex，优先级高于 UA 的 [hidden]，必须显式声明 */
[hidden] { display: none !important; }

body.hunt-body {
  margin: 0;
  padding: 0;
  display: block;
  background: var(--hunt-bg);
  color: var(--hunt-ink);
}

.hunt-app {
  position: relative;
  display: grid;
  grid-template-columns: 236px minmax(0, 1fr);
  height: 100vh;
  height: 100dvh;
  grid-template-rows: minmax(0, 1fr);   /* 行高必须受容器约束，否则被侧边栏撑破 */
  max-width: 1180px;
  margin: 0 auto;
  background: var(--hunt-surface);
  border-left: 1px solid var(--hunt-line);
  border-right: 1px solid var(--hunt-line);
  overflow: hidden;
  /* 安全区：左右切口区只把内容推进来，背景 / 边框仍然铺满。
     注意 position:fixed 的 .composer / bottom sheet 不吃这里的 padding，
     它们各自在下面补。 */
  padding-left: env(safe-area-inset-left, 0px);
  padding-right: env(safe-area-inset-right, 0px);
}
.layer-backdrop, .layer-fx {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 0; pointer-events: none;
}
.layer-fx { z-index: 6; }

/* ---------------- Sidebar ---------------- */
.hunt-side {
  position: relative; z-index: 3;
  display: flex; flex-direction: column; gap: 14px;
  padding: 16px 14px;
  background: var(--hunt-side);
  border-right: 1px solid var(--hunt-line);
  overflow: auto;
  min-height: 0;                        /* 允许收缩，否则会把整行顶高 */
}
.side-brand { display: flex; align-items: center; gap: 9px; }
.brand-mark { font-size: 20px; line-height: 1; }
.brand-text { display: flex; flex-direction: column; line-height: 1.3; min-width: 0; }
.brand-text b { font-size: 13px; color: var(--hunt-ink); }
.brand-text i { font-style: normal; font-size: 11.5px; color: var(--hunt-ink-3); }
.side-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.tag-chip {
  font-size: 9.5px; letter-spacing: .09em; text-transform: uppercase;
  color: var(--hunt-ink-3); background: #fff;
  border: 1px solid var(--hunt-line); border-radius: 999px; padding: 3px 8px;
}
.side-nav { display: flex; flex-direction: column; gap: 6px; }
.side-item {
  text-align: left; font: inherit; font-size: 13px; color: var(--hunt-ink);
  background: transparent; border: 1px solid transparent; border-radius: 9px;
  padding: 8px 10px; cursor: pointer; min-height: 36px;
}
.side-item:hover { background: #fff; border-color: var(--hunt-line); }
.side-item:focus-visible { outline: 2px solid var(--hunt-accent); outline-offset: 1px; }
.side-stats {
  display: flex; flex-direction: column; gap: 7px;
  padding: 10px; border: 1px solid var(--hunt-line); border-radius: 10px; background: #fff;
}
.stat { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.stat span { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--hunt-ink-3); }
.stat b { font-size: 13px; color: var(--hunt-ink); font-variant-numeric: tabular-nums; }
#hud-lives { color: var(--hunt-bad); }
.side-foot { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; }
.icon-btn {
  font: inherit; font-size: 12px; color: var(--hunt-ink-2);
  background: #fff; border: 1px solid var(--hunt-line); border-radius: 999px;
  padding: 6px 10px; min-height: 32px; cursor: pointer;
}
.icon-btn:hover { border-color: var(--hunt-line-2); color: var(--hunt-ink); }
.icon-btn:focus-visible { outline: 2px solid var(--hunt-accent); outline-offset: 1px; }
.side-back { font-size: 12px; }

/* ---------------- 主聊天区 ---------------- */
.hunt-main {
  position: relative; z-index: 2; min-width: 0; min-height: 0;
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto;
  /* 刻意不设 background：白色由 .hunt-app 提供，
     否则会盖住 z-index:0 的角色 Canvas（鲸鱼娘就看不见了） */
}
.chat-head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 20px; border-bottom: 1px solid var(--hunt-line); position: relative;
}
.chat-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--hunt-accent); }
.chat-model { font-size: 13px; color: var(--hunt-ink); }
.chat-tag {
  font-size: 9.5px; letter-spacing: .09em; color: var(--hunt-ink-3);
  border: 1px solid var(--hunt-line); border-radius: 999px; padding: 2px 7px;
}
.timer-track { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; }
.timer-fill { height: 100%; background: var(--hunt-accent); transition: width .12s linear; }

.chat-scroll { overflow-y: auto; overscroll-behavior: contain; }
.chat-flow {
  max-width: var(--hunt-content); margin: 0 auto;
  padding: 24px 20px 8px;
  display: flex; flex-direction: column; gap: 18px;
}

/* ---------------- 空聊天态（intro） ---------------- */
.welcome { display: none; text-align: center; padding: 7vh 6px 0; }
.hunt-app[data-state="intro"] .welcome { display: block; }
.hunt-app[data-state="intro"] .turn,
.hunt-app[data-state="intro"] .factcard { display: none; }
.factcard { display: none; }

/* 多幻觉轮次：每条幻觉一个分块，漏掉的整块标橙 */
.fc-found { margin: 0 0 4px; font-size: 13px; font-weight: 600; color: var(--hunt-ok); }
.fc-found.bad { color: #ea580c; }
.fc-hall { display: flex; flex-direction: column; gap: 4px; padding: 10px 12px; border-radius: 8px; background: #f4f8f6; border: 1px solid #e2efea; }
.fc-hall.missed { background: #fff8f2; border-color: #fee2ce; }
.fc-hall-k { margin: 0 0 2px; font-size: 10px; letter-spacing: .09em; text-transform: uppercase; color: #0f9d8f; }
.fc-hall.missed .fc-hall-k { color: #ea580c; }
.welcome h1 { margin: 0 0 8px; font-size: 19px; letter-spacing: .06em; color: var(--hunt-ink); }
.welcome-sub { margin: 0 0 10px; font-size: 13.5px; color: var(--hunt-ink-2); }
.welcome-note { margin: 0 auto; max-width: 430px; font-size: 12px; line-height: 1.75; color: var(--hunt-ink-3); }
/* intro 时鲸鱼娘站在这块专属区域里 —— 位于欢迎文案和 composer 之间，
   有真实的布局高度，所以不会被 START HUNT / DAILY HUNT 挡住。 */
.intro-character-stage { height: 88px; margin: 14px 0 4px; }

/* ---------------- 会话轮次 ---------------- */
.turn { display: flex; }
.turn-user { justify-content: flex-end; }
.turn-user .turn-body {
  max-width: 78%;
  background: var(--hunt-accent-soft);
  border: 1px solid #dfe6ff;
  border-radius: 14px 14px 4px 14px;
  padding: 10px 14px;
}
.query-text { margin: 0; font-size: 14px; line-height: 22px; color: var(--hunt-ink); }
.turn-assistant { flex-direction: column; gap: 8px; }
.assistant-meta { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.am-name { font-size: 12.5px; font-weight: 600; color: var(--hunt-ink); }
.am-conf {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 10px; letter-spacing: .05em; text-transform: uppercase; color: var(--hunt-ink-3);
}
.am-conf b { font-size: 12px; text-transform: none; color: var(--hunt-ink-2); font-variant-numeric: tabular-nums; }
.am-sim {
  font-style: normal; font-size: 9px; letter-spacing: .08em;
  border: 1px solid var(--hunt-line); border-radius: 999px; padding: 1px 6px; color: var(--hunt-ink-3);
}
.assistant-body { display: flex; flex-direction: column; gap: 8px; }
.conf-track { height: 3px; background: #eef1f6; border-radius: 999px; overflow: hidden; }
.conf-fill { height: 100%; background: var(--hunt-accent); transition: width .25s ease; }

/* ---------------- Claim：Soft Option Cards ----------------
 * 默认状态就有独立的浅色容器（低对比边框 + 10px 圆角 + 轻阴影），
 * 让玩家无需 hover 就能看出「这几句是彼此独立、可以点选的审查目标」；
 * 但仍然读起来像 AI 回答里的句子，而不是传统蓝色大按钮。
 * 左侧序号只是审计编号，选中/判定都靠中性强调色表达，绝不提前泄露对错。 */
.response { display: flex; flex-direction: column; gap: 10px; }
.claim {
  position: relative;
  display: block; width: 100%; text-align: left;
  font: inherit; font-size: 14px; line-height: 22px; color: var(--hunt-ink);
  background: #fff;
  border: 1px solid var(--hunt-line);
  border-radius: 10px;
  padding: 12px 14px 12px 40px;          /* 左侧留出序号位 */
  cursor: pointer;
  transition: background .13s ease, border-color .13s ease, box-shadow .13s ease, transform .13s ease;
}
.claim-no {
  position: absolute; left: 14px; top: 12px;
  font-size: 11px; line-height: 22px; letter-spacing: .04em;
  color: var(--hunt-ink-3); font-variant-numeric: tabular-nums;
}
.claim:hover:not(:disabled) {
  background: #fcfdff;
  border-color: var(--hunt-line-2);
  box-shadow: 0 1px 3px rgba(27, 39, 51, .07);
  transform: translateY(-1px);
}
.claim:focus-visible { outline: 2px solid var(--hunt-accent); outline-offset: 2px; }
.claim:disabled { cursor: default; }
/* 选中 = DeepSeek Arcade 蓝：浅蓝底 + 蓝边 + 左侧强调条（中性，不泄露对错） */
.claim.selected { background: var(--hunt-accent-soft); border-color: #b9c6ff; box-shadow: inset 3px 0 0 var(--hunt-accent); }
.claim.selected .claim-no { color: var(--hunt-accent); }
/* 判定色只在 result 之后出现 */
.claim.hit { background: #ecfdf7; border-color: #a7f3d0; box-shadow: inset 3px 0 0 var(--hunt-ok); }
.claim.hit .claim-no { color: var(--hunt-ok); }
.claim.ok { border-color: #d6efe6; }
.claim.picked { background: #fef2f2; border-color: #fecaca; box-shadow: inset 3px 0 0 var(--hunt-bad); }
/* 玩家没找出来的幻觉：橙红提示，必须与「找到」明显区分 */
.claim.missed { background: #fff7ed; border-color: #fed7aa; box-shadow: inset 3px 0 0 #ea580c; }
.claim.missed .tag { background: #ffedd5; color: #9a3412; }
.claim.missed .claim-no { color: #ea580c; }
.claim.picked .claim-no { color: var(--hunt-bad); }
.claim .tag {
  display: inline-block; margin-left: 6px; vertical-align: 1px;
  font-size: 9.5px; letter-spacing: .06em; border-radius: 999px; padding: 1px 7px;
}
.claim.hit .tag { background: #d1fae5; color: #065f46; }
.claim.ok .tag { background: #e8f6f1; color: #065f46; }
.claim.picked .tag { background: #fee2e2; color: #991b1b; }

/* 鲸鱼娘 verifier 的专属空间：紧贴回答尾部，读作 assistant 的一部分，
   而不是漂在空白里。高度按角色本身给，不留大段空档。 */
.verifier-stage { height: 54px; margin-top: 2px; }

/* ---------------- 事实核验卡：插在会话流里，不是弹窗 ---------------- */
.factcard {
  display: none;
  border: 1px solid var(--hunt-line); border-radius: var(--hunt-radius);
  background: #fbfcfe; padding: 14px 16px 18px;
}
.factcard[data-show="true"] { display: block; }
.factcard-k { margin: 0 0 6px; font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--hunt-ink-3); }
.factcard-title { margin: 0 0 10px; font-size: 15px; color: var(--hunt-ink); }
.factcard-body { display: flex; flex-direction: column; gap: 6px; font-size: 13px; line-height: 1.75; color: var(--hunt-ink-2); }
.fc-row { display: flex; gap: 10px; }
.fc-k { flex: 0 0 86px; font-size: 11.5px; color: var(--hunt-ink-3); padding-top: 2px; }
.fc-v { flex: 1 1 auto; min-width: 0; word-break: break-word; }
.fc-v code {
  font-family: ui-monospace, monospace; font-size: 11.5px; color: var(--hunt-ink);
  background: #eef1f6; border-radius: 5px; padding: 1px 5px;
}
.fc-v a { color: var(--hunt-accent); text-decoration: none; }
.fc-v a:hover { text-decoration: underline; }
.fc-gain { font-size: 13px; font-weight: 600; color: var(--hunt-ok); }
.fc-gain.bad { color: var(--hunt-bad); }

/* ---------------- Composer：像聊天输入区，承载 Hunt 操作 ---------------- */
.composer {
  border-top: 1px solid var(--hunt-line);
  padding: 12px 20px calc(14px + env(safe-area-inset-bottom, 0px));
  background: var(--hunt-surface);
}
.composer-hint {
  max-width: var(--hunt-content); margin: 0 auto 8px;
  font-size: 12px; color: var(--hunt-ink-3);
}
/* 提示与 NEXT 文案由状态驱动；两个 span 都走 i18n，切换语言自动生效，
   不需要在 JS 里手动重设 textContent */
.hint-result, #btn-next[data-final="false"] .final-label, #btn-next[data-final="true"] .next-label { display: none; }
.hunt-app[data-state="result"] .hint-scan { display: none; }
.hunt-app[data-state="result"] .hint-result { display: inline; }
.action-panel { max-width: var(--hunt-content); margin: 0 auto; display: flex; flex-wrap: wrap; gap: 8px; }
.action-panel .btn { min-width: 0; flex: 1 1 auto; }
#btn-verify[disabled] { opacity: .45; cursor: default; }

.hunt-tips {
  max-width: var(--hunt-content); margin: 10px auto 4px; padding: 12px 20px 0;
  border-top: 1px solid var(--hunt-line);
  font-size: 11.5px; line-height: 1.7; color: var(--hunt-ink-3);
}
.hunt-tips b { color: var(--hunt-ink-2); font-weight: 600; }

/* 屏幕阅读器专用 / 复制回退用的隐藏元素 */
.sr-status {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.share-out { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }

/* ---------------- 暂停提示层 ----------------
 * 只在 data-state="paused" 显示（状态机是唯一真相来源，不额外加 boolean）。
 * 它挂在 .hunt-main 内部，所以永远盖不到 sidebar —— 分数 / 命数 / 轮次 /
 * 语言 / 音效 / 继续 / 返回游戏厅 在暂停时依然可见可点。
 * 浅色半透明 + 轻模糊，聊天内容仍隐约可见，不是街机黑幕。 */
.pause-overlay { display: none; }
.hunt-app[data-state="paused"] .pause-overlay {
  display: flex;
  align-items: center;
  justify-content: center;
}
.pause-overlay {
  position: absolute; inset: 0; z-index: 5;
  padding: 16px;
  background: rgba(255, 255, 255, .74);
  -webkit-backdrop-filter: blur(3px);
  backdrop-filter: blur(3px);
}
/* 不支持 backdrop-filter 也能正常阅读：纯半透明白底已足够 */
@supports not ((backdrop-filter: blur(3px)) or (-webkit-backdrop-filter: blur(3px))) {
  .pause-overlay { background: rgba(255, 255, 255, .88); }
}
.pause-card {
  width: 100%; max-width: 340px;
  background: #fff;
  border: 1px solid var(--hunt-line);
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(27, 39, 51, .10);
  padding: 20px 22px;
  text-align: center;
}
.pause-icon { font-size: 22px; line-height: 1; display: block; margin-bottom: 8px; }
.pause-title { margin: 0 0 6px; font-size: 17px; color: var(--hunt-ink); }
.pause-body { margin: 0 0 10px; font-size: 13px; line-height: 1.7; color: var(--hunt-ink-2); }
.pause-hint { margin: 0 0 14px; font-size: 11.5px; color: var(--hunt-ink-3); }
.hint-kbd { display: inline; }
.hint-tap { display: none; }
/* 触屏不强调键盘：换成纯点击提示 */
@media (hover: none), (pointer: coarse) {
  .hint-kbd { display: none; }
  .hint-tap { display: inline; }
}
.pause-card .btn { width: 100%; min-height: 42px; }
@media (prefers-reduced-motion: reduce) { .pause-overlay { transition: none; } }

/* ---------------- 响应式 ---------------- */
@media (max-width: 1023px) {
  .hunt-app {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    max-width: none; border: 0;
  }
  .hunt-side {
    flex-direction: row; align-items: center; gap: 10px;
    padding: 8px 12px;
    border-right: 0; border-bottom: 1px solid var(--hunt-line);
    overflow-x: auto; overflow-y: hidden;
  }
  .brand-text i, .side-tags { display: none; }
  .side-nav { flex-direction: row; }
  .side-stats { flex-direction: row; gap: 12px; padding: 6px 10px; }
  .stat { flex-direction: column; align-items: flex-start; gap: 0; }
  .side-foot { margin-top: 0; margin-left: auto; }
  .side-back { white-space: nowrap; }
  .hunt-main { grid-row: 2; }
  .chat-head { padding: 10px 14px; }
  /* 触屏下限：claim 是主要交互目标，必须 >=44px 高。
     注意：这里必须继续保留左侧序号区域（padding-left），
     否则正文会从 10px 开始、而 .claim-no 仍在 left:14px，两者重叠。
     竖排 padding 同步缩到 11px，序号 top 也要跟着对齐第一行。 */
  .claim { min-height: 44px; padding: 11px 12px 11px 44px; }
  .claim-no { left: 14px; top: 11px; }
  .icon-btn { min-height: 40px; }
  .chat-flow { padding: 18px 14px 8px; gap: 14px; }
  .composer { padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px)); }
  .hunt-tips { padding: 0 14px; }
  .intro-character-stage { height: 72px; margin: 10px 0 2px; }
}

@media (max-width: 560px) {
  /* 这里刻意不覆盖 .claim 的 padding-left：序号区域必须一路保留到最小屏 */
  .brand-text b { font-size: 12px; }
  .side-stats { gap: 9px; }
  .stat b { font-size: 12px; }
  .turn-user .turn-body { max-width: 88%; }
  .fc-row { flex-direction: column; gap: 2px; }
  .fc-k { flex: none; }
  .action-panel .btn { min-height: 46px; }
  .side-item { min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  .claim, .conf-fill, .timer-fill { transition: none; }
}

/* 横屏矮屏：压缩纵向留白 */
@media (max-height: 560px) and (orientation: landscape) {
  .chat-flow { padding: 12px 16px 6px; gap: 10px; }
  .verifier-stage { height: 40px; }
  .intro-character-stage { height: 64px; margin: 8px 0 2px; }
  .welcome { padding-top: 3vh; }
}

/* ==================================================================
 * MOBILE-FIRST 响应式（<= 767px）
 *
 * 断点约定：
 *   >= 1024px  Desktop —— 现有 sidebar + HUD + scene 布局，完全不变
 *   768~1023px Tablet  —— 沿用上一段的横向紧凑条
 *   <= 767px   Mobile  —— 真正的单列 AI Chat App 布局
 *   <= 430px   Small Mobile
 *   <= 375px   Very Small
 *
 * 手机端不再有左侧 sidebar：同一个 .hunt-side 元素退化为 bottom sheet
 * （零 DOM 搬移、零 id 冲突），控件仍是同一批真 button。
 * ================================================================== */

/* 桌面端不显示移动端专属元素 */
.hunt-bar, .hud-mini, .sheet-scrim, .side-menu-title { display: none; }

@media (max-width: 767px) {
  /* ---------- 外壳：单列、允许自然滚动、不固定整页高度 ---------- */
  .hunt-app {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    height: auto;
    min-height: 100vh;
    min-height: 100dvh;
    max-width: none;
    border: 0;
    overflow: visible;
    padding-top: env(safe-area-inset-top, 0px);
  }
  .hunt-main {
    grid-row: 2;
    display: block;          /* 手机上不做固定三行网格，内容自然增长 */
    padding-bottom: calc(var(--composer-height, 148px) + env(safe-area-inset-bottom, 0px) + 20px);
  }
  .timer-track { position: static; height: 2px; }

  /* ---------- App Bar：紧凑 52~60px ---------- */
  .hunt-bar {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 54px;
    padding: 0 14px;
    background: rgba(255, 255, 255, .92);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid var(--hunt-line);
    position: sticky;
    top: 0;
    z-index: 30;
  }
  .bar-btn {
    font: inherit; font-size: 17px; line-height: 1;
    width: 40px; height: 40px; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    background: transparent; border: 1px solid transparent; border-radius: 10px;
    color: var(--hunt-ink); cursor: pointer;
  }
  .bar-btn:active { background: #f1f4f9; }
  .bar-btn:focus-visible { outline: 2px solid var(--hunt-accent); outline-offset: 1px; }
  .bar-title { flex: 1 1 auto; min-width: 0; font-size: 14.5px; color: var(--hunt-ink);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .bar-load {
    flex: none; font-size: 10.5px; letter-spacing: .06em; color: var(--hunt-ink-2);
    background: #fff; border: 1px solid var(--hunt-line); border-radius: 999px; padding: 4px 10px;
    font-variant-numeric: tabular-nums;
  }

  /* ---------- sidebar -> bottom sheet ---------- */
  .hunt-side {
    position: fixed; left: 0; right: 0; bottom: 0; top: auto;
    z-index: 40;
    flex-direction: column; align-items: stretch; gap: 8px;
    max-height: 78dvh; overflow-y: auto;
    /* fixed bottom sheet：左右也要让开切口区，底部让开 Home Indicator */
    padding: 14px max(16px, env(safe-area-inset-right, 0px)) calc(14px + env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
    background: #fff;
    border-right: 0; border-top: 1px solid var(--hunt-line);
    border-radius: 20px 20px 0 0;
    box-shadow: 0 -10px 34px rgba(27, 39, 51, .16);
    transform: translateY(105%);
    transition: transform .22s ease;
  }
  .hunt-side[data-open="true"] { transform: translateY(0); }
  .side-brand, .side-tags, .side-stats { display: none; }
  .side-menu-title { display: block; margin: 0 0 4px; font-size: 11px; letter-spacing: .1em;
    text-transform: uppercase; color: var(--hunt-ink-3); }
  .side-foot { margin-top: 0; flex-direction: column; gap: 8px; }
  .side-foot .icon-btn, .side-back {
    width: 100%; min-height: 48px; justify-content: flex-start;
    display: inline-flex; align-items: center; gap: 8px;
    border-radius: 12px; font-size: 14px; padding: 0 14px; text-align: left;
  }
  .side-back { border: 1px solid var(--hunt-line); background: #fff; color: var(--hunt-ink-2); }

  .sheet-scrim { display: block; position: fixed; inset: 0; z-index: 35; background: rgba(20, 30, 44, .32); }
  .sheet-scrim[hidden] { display: none !important; }

  /* ---------- HUD：只留一行最关键的 ---------- */
  .hunt-side .side-stats { display: none; }   /* 桌面 HUD 不在手机上以九宫格出现 */
  .hud-mini { display: flex; align-items: baseline; gap: 14px; margin: 0 0 8px;
    max-width: var(--hunt-content); margin-left: auto; margin-right: auto; }
  .hud-mini .hm { display: flex; align-items: baseline; gap: 4px; }
  .hud-mini .hm i { font-style: normal; font-size: 9.5px; letter-spacing: .06em;
    text-transform: uppercase; color: var(--hunt-ink-3); }
  .hud-mini .hm b { font-size: 13px; color: var(--hunt-ink); font-variant-numeric: tabular-nums; }
  #hud-mini-lives { color: var(--hunt-bad); }
  .hud-mini .hm:last-child { margin-left: auto; }

  /* ---------- 头部与内容：真正的单列文档流 ---------- */
  .chat-head { display: none; }               /* App Bar 已经承担 Context Model 一行 */
  .chat-scroll { overflow: visible; }
  .chat-flow { max-width: 100%; padding: 14px 14px 0; gap: 14px; }

  /* ---------- Intro：紧凑 Hero ---------- */
  .welcome { padding: 14px 6px 0; }
  .welcome h1 { font-size: 20px; margin-bottom: 6px; }
  .welcome-sub { margin-bottom: 8px; font-size: 13px; }
  .welcome-note { max-width: 100%; font-size: 12px; }
  .intro-character-stage { height: 88px; margin: 6px 0 2px; }
  .hunt-howto { display: block; text-align: left; max-width: 100%; margin: 10px auto 0;
    border: 1px solid var(--hunt-line); border-radius: 12px; background: #fff; overflow: hidden; }
  .hunt-howto > summary { cursor: pointer; list-style: none; padding: 12px 14px;
    font-size: 13px; color: var(--hunt-ink); min-height: 44px; display: flex; align-items: center; }
  .hunt-howto > summary::-webkit-details-marker { display: none; }
  .hunt-howto > summary::after { content: '⌄'; margin-left: auto; color: var(--hunt-ink-3); }
  .hunt-howto[open] > summary::after { content: '⌃'; }
  .howto-body { padding: 0 14px 14px; font-size: 12px; line-height: 1.75; color: var(--hunt-ink-2); }

  /* ---------- 游戏主体：单列，无固定场景高度 ---------- */
  .assistant-body { gap: 10px; }
  .verifier-stage { height: 56px; }
  .turn-user .turn-body { max-width: 92%; }

  /* ---------- Claim 卡片 ---------- */
  .response { gap: 10px; }
  .claim { min-height: 52px; padding: 12px 14px 12px 44px; border-radius: 12px; }
  .claim-no { left: 14px; top: 12px; }
  /* 手指反馈：明显但不夸张；手机上不能只靠 hover */
  .claim.selected { background: #e8eeff; border-color: var(--hunt-accent); box-shadow: inset 3px 0 0 var(--hunt-accent); }
  .claim .tag { display: inline-block; margin: 2px 0 0 6px; }

  /* ---------- Fact Check：单列，不再用 label/value 双列 ---------- */
  .factcard { padding: 14px 14px 18px; }
  .fc-row { flex-direction: column; gap: 2px; }
  .fc-k { flex: none; padding-top: 0; }
  /* 来源做成好点的按钮 */
  .fc-v a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 2px;
    font-weight: 600; }
  .fc-v a::after { content: ' ↗'; }

  /* ---------- Composer：固定底部 + iPhone Home Indicator ---------- */
  .composer {
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 25;
    /* fixed composer：同上 —— 横屏刘海 + Home Indicator 都要让开 */
    padding: 10px max(14px, env(safe-area-inset-right, 0px)) calc(10px + env(safe-area-inset-bottom, 0px)) max(14px, env(safe-area-inset-left, 0px));
    border-top: 1px solid var(--hunt-line);
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -8px 24px rgba(27, 39, 51, .08);
  }
  .composer-hint { margin-bottom: 8px; font-size: 12px; }
  .action-panel { gap: 8px; }
  .action-panel .btn { min-height: 48px; border-radius: 14px; font-size: 14px; }
  .hunt-tips { max-width: 100%; margin: 4px auto 0; padding: 12px 2px 0; font-size: 11.5px; }

  /* Intro 阶段不显示 MODEL CONFIDENCE —— 游戏还没开始 */
  .hunt-app[data-state="intro"] .am-conf,
  .hunt-app[data-state="intro"] .conf-track { display: none; }
}

/* ---------- Small Mobile ---------- */
@media (max-width: 430px) {
  .chat-flow { padding: 12px 12px 0; gap: 12px; }
  .welcome h1 { font-size: 19px; }
  .action-panel .btn { min-height: 50px; }
  .hud-mini { gap: 10px; }
  .composer {
    padding-left: max(12px, env(safe-area-inset-left, 0px));
    padding-right: max(12px, env(safe-area-inset-right, 0px));
  }
}

/* ---------- Very Small ---------- */
@media (max-width: 375px) {
  .bar-title { font-size: 13.5px; }
  .claim { padding-left: 42px; }
  .claim-no { left: 12px; }
  .hud-mini .hm i { font-size: 9px; }
  .action-panel { flex-direction: column; }
  .action-panel .btn { width: 100%; }
}

/* ---------- 横屏（矮屏）：App Bar 与 Composer 都压在 safe area 内 ---------- */
@media (max-width: 900px) and (orientation: landscape) and (max-height: 520px) {
  .hunt-bar { height: 44px; }
  .intro-character-stage { height: 56px; margin: 2px 0; }
  .verifier-stage { height: 40px; }
  .welcome { padding-top: 6px; }
  .hunt-side { max-height: 88dvh; }
  .composer { padding-top: 8px; padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)); }
}
