@import url("https://fonts.googleapis.com/css2?family=Paytone+One&display=swap");
    * { box-sizing: border-box; margin: 0; padding: 0; }
    /* 禁止移动端（尤其 iOS/安卓）文字自动放大，保证各设备字号一致 */
    html {
      -webkit-text-size-adjust: 100%; text-size-adjust: 100%;
      background: #3e7f56; /* 兜底：body 高度不足视口或内容溢出时，html 露主题背景色而非白色（iOS 背景延伸） */
    }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      /* 经典主题背景：纯色（与 html 兜底 #3e7f56 同色），去掉渐变。
         便于背景色向下无限延伸：下拉刷新 / iOS 滚动溢出区域不露白、且无渐变边界（与无尽模式一致） */
      background: #3e7f56;
      min-height: 100vh;        /* 短页面也铺满视口，避免底部露白 */
      min-height: 100dvh;       /* 优先动态视口高度，规避 iOS 地址栏导致的 100vh 偏差 */
      color: #e8f0e8;
      touch-action: manipulation; /* 禁用双击缩放（保留滚动/捏合），提升触屏体验 */
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      padding:
        max(14px, env(safe-area-inset-top))
        max(16px, env(safe-area-inset-right))
        max(14px, env(safe-area-inset-bottom))
        max(16px, env(safe-area-inset-left));
      /* safe-area：配合 viewport-fit=cover，背景色铺到全面屏边缘（刘海/底部按键条）无浅色缝；
         内容保留 ≥14/16px 内缩避免贴边 */
    }
    .card {
      position: relative;
      /* 纵向微渐变（去掉顶部高光，避免圆角顶部产生弧形亮线） */
      background:
        linear-gradient(180deg, rgba(43, 86, 59, 0.97), rgba(29, 58, 41, 0.97));
      border-radius: 20px;
      /* 双层投影：近景投影 + 远景大气投影，强化层级 */
      box-shadow:
        0 10px 26px rgba(0,0,0,0.26),
        0 28px 64px rgba(0,0,0,0.20);
      width: 100%;
      max-width: 420px;
      margin: 0 auto; /* 双重保险：body flex + margin auto 确保居中 */
      padding: 20px 24px 8px; /* 顶部 28px → 20px；底部内边距较顶部收窄，使 result 区更贴近卡片底（index/series/endless 三页共用） */
    }
    h1 {
      font-family: "Paytone One", system-ui, sans-serif;
      font-size: 30px;
      letter-spacing: -0.5px;
      margin-bottom: 8px;
      color: #fff;
      /* 立体标题：双层投影增强层次 */
      text-shadow: 0 1px 0 rgba(255,255,255,0.18), 2px 2px 0 #1a3a26, 4px 4px 10px rgba(0,0,0,0.25);
      text-align: center;
    }
    .sub { color: #a8c4ae; font-size: 13px; margin-bottom: 20px; text-align: center; }
    .help-btn {
      position: absolute; top: 16.5px; right: 14px; z-index: 50;
      width: 18px; height: 11px; padding: 0;
      border: none; background: transparent; cursor: pointer;
      /* box-shadow:none 是关键：去掉通用 button 继承的 inset 高光/阴影（右上角弧线来源），同时保持透明无底框 */
      box-shadow: none;
      display: flex; flex-direction: column; justify-content: space-between;
      align-items: center; box-sizing: border-box;
      transition: all .2s;
    }
    .help-btn span {
      display: block; width: 13px; height: 2px; border-radius: 1px;
      background: #a8c4ae; transition: all .2s;
    }
    .help-btn:hover span { background: #fff; }
    /* 快捷操作区（Quick Actions）：报/播/战/更新 四个按钮，容器不定位，按钮相对骰子区绝对定位，
       与右侧道具背包（【技】）对称。
       四按钮均 37px 高（31px 增加 20%）、translateY(-50%) 居中，中心距统一 47px（37px 按钮 + 10px 间距）等距排列，
       锚点【播】top: calc(15% + 40px)（累计下移 40px），报 -47px、战 +47px、更新 +94px */
    .quick-actions {
      position: static;
    }
    /* 直播入口按钮：定位在骰子左侧，中心与右侧【技】按钮水平对齐；排在【战】正下方 47px 处（最下） */
    .live-entry {
      position: absolute; left: 4px; top: calc(15% + 87px);   /* 锚点：累计下移 87px */
      transform: translateY(-50%);
      flex-shrink: 0;
      width: 37px; height: 37px;      /* 31px 增加 20% */
      padding: 0;
      font-size: 17px; font-weight: 800;
      line-height: 37px;
      text-align: center;
      border: none; border-radius: 7px;
      cursor: pointer;
      background: linear-gradient(135deg, #e5484d, #b8303a); color: #fff;
      box-shadow: 0 2px 10px rgba(229, 72, 77, 0.5);
      white-space: nowrap;
      transition: filter .15s, transform .12s;
    }
    .live-entry:hover { filter: brightness(1.1); }
    .live-entry:active { transform: translateY(-50%) scale(0.95); }
    /* 速报入口按钮：绿底白字【报】，定位在【播】正上方 47px 处（等间距） */
    .report-entry {
      position: absolute; left: 4px; top: calc(15% - 7px);   /* 锚点 -47px（含下移）*/
      transform: translateY(-50%);
      flex-shrink: 0;
      width: 37px; height: 37px;
      padding: 0;
      font-size: 17px; font-weight: 800;
      line-height: 37px;
      text-align: center;
      border: none; border-radius: 7px;
      cursor: pointer;
      background: linear-gradient(135deg, #4caf6e, #2f8f4e); color: #fff;
      box-shadow: 0 2px 10px rgba(47, 143, 78, 0.5);
      white-space: nowrap;
      transition: filter .15s, transform .12s;
    }
    .report-entry:hover { filter: brightness(1.1); }
    .report-entry:active { transform: translateY(-50%) scale(0.95); }
    /* 入口白点：存在速报直播/重播时显示在按钮右上角（静态白点，不闪烁） */
    .live-dot {
      position: absolute; top: 5px; right: 5px;
      width: 6px; height: 6px;
      border-radius: 50%;
      background: rgba(255, 255, 255, 0.85);
      pointer-events: none;
    }
    /* 战按钮黄底上白点对比不足：描边加深，保证可见 */
    .duel-entry .live-dot {
      box-shadow: 0 0 0 1px rgba(120, 80, 0, 0.45);
    }
    /* 对战入口按钮：黄底白字【战】，定位在【报】正下方 47px 处（等间距，中间） */
    .duel-entry {
      position: absolute; left: 4px; top: calc(15% + 40px);   /* 锚点 +40px（含下移）*/
      transform: translateY(-50%);
      flex-shrink: 0;
      width: 37px; height: 37px;
      padding: 0;
      font-size: 17px; font-weight: 800;
      line-height: 37px;
      text-align: center;
      border: none; border-radius: 7px;
      cursor: pointer;
      background: linear-gradient(135deg, #ffd23f, #f0a500); color: #fff;
      box-shadow: 0 2px 10px rgba(240, 168, 0, 0.5);
      white-space: nowrap;
      transition: filter .15s, transform .12s;
    }
    .duel-entry:hover { filter: brightness(1.08); }
    .duel-entry:active { transform: translateY(-50%) scale(0.95); }
    /* 游戏说明内的版本更新内容（原「更新公告」浮层并入游戏说明，置于 help-note 上方） */
    .help-update {
      margin-top: 14px; padding-top: 12px;
      border-top: 1px solid rgba(255,255,255,0.12);
    }
    .help-update-title {
      margin: 0 0 6px; font-size: 13px; font-weight: 700; color: #9bb6a4; /* 与 help-note 说明文字同色 */
    }
    .help-update-list { margin: 0; padding-left: 16px; }
    .help-update-list li {
      font-size: 12px; line-height: 1.8; color: #9bb6a4;
      margin-bottom: 4px;
    }
    .help-update-list li:last-child { margin-bottom: 0; }
    /* 更新内容内嵌真实开关（静态、不可点击，固定呈现「好坏球模式开启 / 1球」态，外观与主开关一致；
       更新内容仅在经典主题出现，无需无尽适配） */
    .news-bs-toggle {
      display: inline-flex; vertical-align: middle; margin: 0 4px;
      pointer-events: none;            /* 仅展示，禁止交互 */
    }
    /* 固定为「1球 / 好坏球模式」选中高亮（开态：绿底白字）；1人 为未选中浅灰 */
    .news-bs-toggle .seg-person { color: rgba(232,240,232,0.7); }
    .news-bs-toggle .seg-ball   { background: #3a9a6a; color: #ffffff; }
    /* 缩小内嵌开关：匹配公告文字行高（约 13px），不再比文字大一圈 */
    /* 横向 padding / gap 收紧，整体宽度较主开关缩小约 20%（高度不变，仍贴合文字行高） */
    .news-bs-toggle .bs-toggle-track { gap: 0; padding: 0; border-radius: 5px; }
    .news-bs-toggle .bs-seg { font-size: 11px; padding: 3px 4px; border-radius: 4px; }
    /* 内联：顶部红/黄/绿模式点 */
    .news-dot {
      display: inline-block; width: 10px; height: 10px;
      border-radius: 50%; margin: 0 3px; vertical-align: middle;
      box-shadow: 0 0 0 2px rgba(123,216,143,0.25);
    }
    .news-dot.red { background: #e5484d; }
    .news-dot.yellow { background: #f0c040; }
    .news-dot.green { background: #4caf6e; }
    .help-modal {
      position: fixed; inset: 0; z-index: 100;
      background: rgba(0,0,0,0.6); display: flex;
      align-items: center; justify-content: center; padding: 20px;
    }
    /* 无尽排行榜面板（基础墨绿样式，经典主题可用；个性主题下由 body.endless 覆盖为红黑白） */
    .endless-rank-modal {
      position: fixed; inset: 0; z-index: 200;
      display: flex; align-items: center; justify-content: center; padding: 20px;
    }
    .endless-rank-mask {
      position: absolute; inset: 0; background: rgba(0,0,0,0.62);
    }
    .endless-rank-card {
      position: relative; z-index: 1; width: 100%; max-width: 380px;
      max-height: 82vh; overflow-y: auto;
      background: linear-gradient(180deg, #20312a 0%, #16241d 100%);
      border: 1px solid rgba(123,216,143,0.25);
      border-radius: 16px; padding: 22px 20px;
      color: #e8f3ec;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 54px rgba(0,0,0,0.58);
      animation: endlessPop .2s ease-out;
    }
    @keyframes endlessPop { from { transform: translateY(8px) scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
    .endless-rank-close {
      position: absolute; top: 10px; right: 14px; width: auto;
      border: none; background: none;
      color: #cfe3d6; font-size: 22px; line-height: 1; cursor: pointer; padding: 0;
      box-shadow: none; /* 复位通用 button 的黑色阴影，否则按钮下方残留同色矩形 */
    }
    .endless-rank-close:hover { color: #ffffff; }
    .endless-rank-title { margin: 0 0 10px; font-size: 18px; font-weight: 600; color: #fff; text-align: center; }
    .endless-rank-desc {
      font-size: 13px; line-height: 1.7; color: #a9c6b6; margin-bottom: 14px;
      padding: 10px 12px; background: rgba(255,255,255,0.05); border-radius: 10px;
      max-height: 96px; overflow-y: auto;
    }
    .endless-rank-user {
      display: flex; justify-content: space-between; gap: 10px;
      margin-bottom: 14px; padding: 10px 12px; border-radius: 10px;
      background: rgba(123,216,143,0.10); border: 1px solid rgba(123,216,143,0.22);
      font-size: 13px; color: #cfe3d6;
    }
    .endless-rank-user b { color: #ffd166; font-size: 15px; }
    .endless-rank-list { display: flex; flex-direction: column; gap: 6px; }
    .endless-rank-row {
      display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 8px;
      padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,0.04); font-size: 13px;
    }
    .endless-rank-row:nth-child(1) { background: rgba(255,209,102,0.14); }
    .endless-rank-row:nth-child(2) { background: rgba(255,255,255,0.08); }
    .endless-rank-row:nth-child(3) { background: rgba(255,255,255,0.06); }
    .endless-rank-no { color: #ffd166; font-weight: 600; text-align: center; }
    .endless-rank-uid { color: #cfe3d6; letter-spacing: .5px; }
    .endless-rank-score { color: #7bd88f; font-weight: 600; }
    .endless-rank-empty { text-align: center; color: #8fb6a0; font-size: 13px; padding: 20px 0; }
    .endless-rank-foot {
      margin-top: 10px; padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.08);
      font-size: 12px; color: #8fb6a0; text-align: left; letter-spacing: .5px;
    }

    /* 无尽模式说明浮层（基础墨绿样式，经典主题可用；个性主题下由 body.endless 覆盖为红黑白） */
    .endless-desc-modal .ch-card {
      /* 经典主题下与基础 .ch-card 同色系（白边框 / 纯墨绿）；个性主题由 body.endless 覆盖为红黑白 */
      background: #20302a;
      border: 1px solid rgba(255,255,255,0.15);
      border-radius: 14px; padding: 24px 22px;
    }
    .endless-desc-modal .ch-close {
      position: absolute; top: 10px; right: 14px; font-size: 22px; color: #a8c4ae;
    }
    .endless-desc-modal .ch-close:hover { color: #fff; }
    /* 无尽说明标题：居中，字号 18px → 19px */
    .endless-desc-modal .ch-card h2 {
      font-size: 19px; font-weight: 600; color: #fff; text-align: center; margin: 0 0 10px;
    }
    .endless-desc-modal .ch-card p {
      font-size: 13px; line-height: 1.7; color: #cfddd4; margin: 0 0 14px;
      padding: 10px 12px; background: rgba(255,255,255,0.05); border-radius: 10px;
    }
    /* 无尽说明正文：基准 13px → 16px，并加粗 */
    .endless-desc-modal .ch-card #chDescText { font-size: 16px; font-weight: 700; }
    .endless-desc-modal .ch-endless-rank {
      margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(123,216,143,0.18);
    }
    .endless-desc-modal .ch-endless-rank-title { font-size: 13px; font-weight: 700; color: #ffd166; margin-bottom: 6px; }
    .endless-desc-modal .ch-endless-rank ol {
      list-style: none; padding: 0; margin: 0 0 10px; display: flex; flex-direction: column; gap: 6px;
    }
    .endless-desc-modal .ch-endless-rank li {
      display: grid; grid-template-columns: 30px 1fr auto; align-items: center; gap: 8px;
      font-size: 13px; padding: 8px 10px; border-radius: 10px; background: rgba(255,255,255,0.04);
      color: #cfe3d6; letter-spacing: .5px; white-space: nowrap; line-height: 1.5;
    }
    .endless-desc-modal .ch-endless-rank li.cer-empty { display: block; text-align: center; color: #8fb6a0; }
    .endless-desc-modal .ch-endless-rank li:nth-child(1) { background: rgba(255,209,102,0.14); }
    .endless-desc-modal .ch-endless-rank li:nth-child(2) { background: rgba(255,255,255,0.08); }
    .endless-desc-modal .ch-endless-rank li:nth-child(3) { background: rgba(255,255,255,0.06); }
    .endless-desc-modal .ch-endless-rank li .cer-no { text-align: center; color: #ffd166; font-weight: 600; }
    .endless-desc-modal .ch-endless-rank li .cer-uid { overflow: hidden; text-overflow: ellipsis; }
    .endless-desc-modal .ch-endless-rank li .cer-score { text-align: right; color: #7bd88f; font-weight: 600; }
    .endless-desc-modal .ch-endless-mine {
      display: grid; grid-template-columns: 1fr auto; gap: 2px 12px;
      font-size: 13px; color: #e8f0e8; padding: 10px 12px; border-radius: 10px; margin-top: 0;
      background: rgba(123,216,143,0.10); border: 1px solid rgba(123,216,143,0.22);
    }
    .endless-desc-modal .ch-endless-mine b { text-align: right; color: #7bd88f; font-weight: 600; }
    .endless-desc-modal .ch-desc-end { font-size: 12px; color: #8ab894; text-align: left; margin-top: 10px; }

    /* 我的战绩面板（📜，独立样式，不复用无尽排行榜卡片） */
    .hist-modal {
      position: fixed; inset: 0; z-index: 200;
      display: flex; align-items: center; justify-content: center; padding: 20px;
    }
    .hist-mask {
      position: absolute; inset: 0; background: rgba(0,0,0,0.62);
    }
    .hist-card {
      position: relative; z-index: 1; width: 100%; max-width: 400px;
      max-height: 82vh; overflow-y: auto;
      background: linear-gradient(180deg, #1e2f28 0%, #141f1a 100%);
      border: 1px solid rgba(123,216,143,0.3);
      border-radius: 18px; padding: 24px 22px;
      color: #e8f3ec;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 20px 58px rgba(0,0,0,0.62);
      animation: histPop .22s cubic-bezier(.2,.9,.3,1.2);
    }
    /* 弹窗滚动条统一样式（我的战绩 / 无尽排行榜 / 排行榜规则说明）：暗色细滚动条替换 PC 默认样式 */
    .hist-card,
    .endless-rank-card,
    .endless-rank-desc {
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,0.22) transparent;
    }
    .hist-card::-webkit-scrollbar,
    .endless-rank-card::-webkit-scrollbar,
    .endless-rank-desc::-webkit-scrollbar { width: 8px; }
    .hist-card::-webkit-scrollbar-track,
    .endless-rank-card::-webkit-scrollbar-track,
    .endless-rank-desc::-webkit-scrollbar-track { background: transparent; }
    .hist-card::-webkit-scrollbar-thumb,
    .endless-rank-card::-webkit-scrollbar-thumb,
    .endless-rank-desc::-webkit-scrollbar-thumb {
      background: rgba(255,255,255,0.16); border-radius: 4px;
      border: 2px solid transparent; background-clip: padding-box;
    }
    .hist-card::-webkit-scrollbar-thumb:hover,
    .endless-rank-card::-webkit-scrollbar-thumb:hover,
    .endless-rank-desc::-webkit-scrollbar-thumb:hover { background-color: rgba(255,255,255,0.28); }
    @keyframes histPop {
      from { transform: translateY(10px) scale(.95); opacity: 0; }
      to { transform: none; opacity: 1; }
    }
    .hist-close {
      position: absolute; top: 10px; right: 14px;
      width: auto; padding: 0; /* 覆盖通用 button 的 width:100%/padding:14px，避免占满浮层居中 */
      font-size: 22px; color: #a8c4ae; cursor: pointer; line-height: 1;
      border: none; background: transparent;
      box-shadow: none; /* 复位通用 button 的黑色阴影，否则按钮下方残留同色矩形 */
    }
    .hist-close:hover { color: #fff; }
    .hist-close:hover { color: #ffffff; }
    .hist-title {
      margin: 0 0 12px; font-size: 18px; font-weight: 600; color: #fff;
      text-align: center; letter-spacing: 1px;
    }
    /* 主页专属：历史战绩按钮（🕐），圆形，中心对准卡片圆角圆心，半径较 mode-light 增大 2px */
    .home-history-btn {
      position: absolute; top: 10px; left: 10px; z-index: 50;
      width: 28px; height: 28px; padding: 0;
      border: none; background: transparent; cursor: pointer;
      display: flex; align-items: center; justify-content: center;
      box-sizing: border-box; border-radius: calc(50% + 1px);
      color: #a8c4ae;
      box-shadow: none; /* 覆盖 button 全局阴影，避免与 card 底色产生色差 */
      transition: all .2s;
    }
    .home-history-btn:hover { color: #fff; }
    .hist-section {
      position: relative;
      padding: 12px 0 12px 12px;
      border-bottom: 1px solid rgba(255,255,255,0.07);
    }
    .hist-section:last-of-type { border-bottom: none; }
    /* 分区色条与模式 tabs 颜色呼应：普通=绿 / 系列赛=黄 / 无尽=红 */
    .hist-section::before {
      content: ""; position: absolute; left: 0; top: 12px; bottom: 12px;
      width: 3px; border-radius: 2px; background: #7bd88f;
    }
    .hist-section:nth-of-type(2)::before { background: #f0d860; }
    .hist-section:nth-of-type(3)::before { background: #ff6b6b; }
    .hist-section:nth-of-type(4)::before { background: #6ea8ff; }
    .hist-h { font-size: 14px; font-weight: 600; color: #7bd88f; margin-bottom: 8px; }
    .hist-section:nth-of-type(2) .hist-h { color: #f0d860; }
    .hist-section:nth-of-type(3) .hist-h { color: #ff8f8f; }
    .hist-section:nth-of-type(4) .hist-h { color: #7ab8ff; }
    .hist-row {
      display: flex; justify-content: space-between; align-items: center;
      font-size: 13px; color: #cfe3d6; padding: 4px 0;
    }
    .hist-row b { color: #ffd166; font-size: 15px; }
    .hist-ids {
      margin-top: 4px; font-size: 12px; color: #8fb6a0; line-height: 1.6;
      word-break: break-all;
    }
    .hist-tip { margin-top: 12px; font-size: 12px; color: #6f8f7c; text-align: center; }
    .help-card {
      position: relative; max-width: 360px; width: 100%;
      background: #20302a; border: 1px solid rgba(255,255,255,0.15);
      border-radius: 14px; padding: 24px 22px; color: #e8f0ea;
      box-shadow: 0 12px 40px rgba(0,0,0,0.5);
    }
    .help-card h2 { font-family: "Paytone One", system-ui, sans-serif; font-size: 17px; margin: 0 0 12px; color: #fff; }
    .help-card p { font-size: 14px; line-height: 1.7; margin: 0; color: #cfddd4; }
    .help-note {
      margin-top: 16px !important; padding-top: 14px;
      border-top: 1px solid rgba(255,255,255,0.12);
      font-size: 12px !important; line-height: 1.8 !important; color: #9bb6a4 !important;
    }
    .help-note .link-btn {
      width: auto; padding: 0 2px; margin: 0; border: none; border-radius: 0;
      background: none !important; box-shadow: none; color: #f0d860 !important;
      font-size: 12px !important; font-weight: normal !important; line-height: inherit; text-decoration: underline;
      cursor: pointer;
    }
    .help-note .link-btn:hover { color: #fff !important; }
    .help-note a.link-btn:visited, .help-note a.link-btn:active, .help-note a.link-btn:hover { color: #f0d860 !important; }
    .help-card a.link-btn, .help-card a.link-btn:visited, .help-card a.link-btn:active, .help-card a.link-btn:hover { color: #f0d860 !important; text-decoration: underline; }
    .help-vol {
      display: flex; align-items: center; justify-content: space-between;
      margin-top: 14px; padding-top: 12px; margin-bottom: 100px; border-top: 1px solid rgba(255,255,255,0.08);
      font-size: 12px; color: #9bb6a4;
    }
    /* 音乐滑块紧跟音效下方：去掉分隔线、收紧间距；底部留白移到最后一个（音乐）块 */
    .help-vol-sfx { margin-bottom: 10px; }
    .help-vol-music { border-top: none; margin-top: 10px; padding-top: 0; margin-bottom: 100px; }
    /* 管理端关闭「游戏音乐」时（body.music-off）：隐藏音乐行，音效由滑块切换为开关。
       底部 100px 留白转给音效行（此时它是最后一个可见块），避免与底部绝对定位内容重叠。
       移除该 class 即自动恢复「音乐行 + 音效滑块」。 */
    body.music-off .help-vol-music { display: none; }
    body.music-off .help-vol-sfx { margin-bottom: 100px; }
    .help-vol-sfx > .switch { display: none; }
    body.music-off .help-vol-sfx > .vol-slider { display: none; }
    body.music-off .help-vol-sfx > .switch { display: inline-block; }
    /* 音乐音量滑块 */
    .vol-slider {
      -webkit-appearance: none; appearance: none;
      width: 104px; height: 4px; border-radius: 2px; outline: none;
      background: rgba(255,255,255,0.18); cursor: pointer; margin: 0;
    }
    .vol-slider::-webkit-slider-thumb {
      -webkit-appearance: none; appearance: none;
      width: 16px; height: 16px; border-radius: 50%;
      background: #f0d860; border: none; box-shadow: 0 1px 3px rgba(0,0,0,0.4);
    }
    .vol-slider::-moz-range-thumb {
      width: 16px; height: 16px; border-radius: 50%;
      background: #f0d860; border: none; box-shadow: 0 1px 3px rgba(0,0,0,0.4);
    }
    .vol-slider::-moz-range-track { height: 4px; border-radius: 2px; background: rgba(255,255,255,0.18); }
    .help-vol-label { white-space: nowrap; font-size: 14px; }
    .switch { position: relative; display: inline-block; width: 46px; height: 24px; cursor: pointer; }
    .switch input { opacity: 0; width: 0; height: 0; }
    .switch-track {
      position: absolute; inset: 0; background: rgba(255,255,255,0.18);
      border-radius: 12px; transition: background .2s;
    }
    .switch-track::before {
      content: ""; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px;
      background: #e8f0e8; border-radius: 50%; transition: transform .2s;
    }
    .switch input:checked + .switch-track { background: #f0d860; }
    .switch input:checked + .switch-track::before { transform: translateX(22px); background: #1f2d23; }
    /* 主题选择：经典(墨绿) / 个性(无尽红黑白)，位于说明浮层、音效上方 */
    .help-theme {
      display: flex; align-items: center; justify-content: space-between;
      margin-top: 14px; padding-top: 12px;
      border-top: 1px solid rgba(255,255,255,0.08);
      font-size: 12px; color: #9bb6a4;
    }
    .help-theme-label { white-space: nowrap; font-size: 14px; }
    .theme-seg {
      display: flex; gap: 2px; padding: 2px;
      background: rgba(255,255,255,0.10); border-radius: 8px;
    }
    .theme-opt {
      border: none; background: transparent; color: #cfddd4;
      font-size: 13px; line-height: 1; padding: 6px 11px; border-radius: 6px;
      cursor: pointer; white-space: nowrap;
      box-shadow: none; /* 透明图标按钮：去掉通用 button 继承的 inset 阴影 */
    }
    .theme-opt.active { background: #f0d860; color: #1f2d23; font-weight: 600; }
    .theme-opt:hover { filter: brightness(1.1); }
    /* 好坏球开关：位于 Roll 按钮上方靠右，切换只影响下一打席 */
    .bs-toggle {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      margin: -12px 0 30px;        /* 上移：贴紧 dice-area 下方；下距 rollBtn 保持 30px */
      cursor: pointer;
      user-select: none;
      -webkit-tap-highlight-color: transparent;
    }
    .bs-toggle input {
      position: absolute;
      opacity: 0;
      width: 0;
      height: 0;
    }
    /* 分段开关：仿 theme-opt 圆角矩形风格（外框浅底 + 选中项高亮块）
       1人 = 普通模式（关，默认选中），1球 = 好坏球模式（开） */
    .bs-toggle-track {
      display: flex;
      gap: 2px;
      padding: 2px;
      background: rgba(255,255,255,0.10);   /* 与 .theme-seg 同底 */
      border-radius: 7px;                    /* 圆角矩形外框（增大 20%） */
      flex-shrink: 0;
      cursor: pointer;
    }
    .bs-seg {
      display: flex; align-items: center; justify-content: center;
      font-size: 12px; line-height: 1;       /* 较 10px 增大 20% */
      padding: 6px 6px;                       /* 较 5px 增大 20% */
      border-radius: 6px;                     /* 较 5px 增大 20% */
      font-weight: 600;
      color: rgba(232,240,232,0.7);
      white-space: nowrap;
      transition: background .2s, color .2s;
    }
    /* 选中项高亮（经典：绿底白字）：1人默认选中，开态切到 1球 */
    .bs-toggle input:not(:checked) + .bs-toggle-track .seg-person,
    .bs-toggle input:checked + .bs-toggle-track .seg-ball {
      background: #3a9a6a; color: #ffffff;
    }
    /* 好坏球开关锁定（选棒/技能武装/结算态）：视觉置灰但不禁用 input，保证点击能触发 change 从而弹提示 */
    .bs-toggle.bs-locked { cursor: not-allowed; opacity: 0.55; }
    .bs-toggle.bs-locked .bs-toggle-track { cursor: not-allowed; }
    /* 打/看选择：好坏球打席掷骰前选进攻(打)或保守(看) */
    .bs-choice {
      display: flex;
      gap: 10px;
      margin: 0;
    }
    .bs-choice-btn {
      flex: 1;
      padding: 14px;
      height: 54px;
      line-height: 1.1;
      border: none;
      border-radius: 12px;
      font-size: 22px;
      font-weight: 800;
      cursor: pointer;
      box-shadow: 0 4px 12px rgba(0,0,0,0.15);
      color: #fff;
      white-space: nowrap;
    }
    .bs-choice-btn.swing { background: linear-gradient(135deg, #ffffff, #eaf0ec); color: #2d5a3d; } /* 打：白（与 Roll 统一，渐变弱化） */
    .bs-choice-btn.read  { background: linear-gradient(135deg, #3a9a6a, #358f62); } /* 看：绿（渐变弱化） */
    .bs-choice-btn.bs-restart { background: linear-gradient(135deg, #5a6c5a, #3e4e3e); } /* 再来一局：中性灰绿 */
    .bs-choice-btn:hover { filter: brightness(1.08); }
    .bs-choice-btn:active { transform: scale(0.95); filter: brightness(0.92); }
    /* 打/看选择后 armed：两按钮锁定（不描边，靠字色降低区分），等待本球结果返回后开放 */
    .bs-choice-btn:disabled {
      cursor: not-allowed;
      color: rgba(255, 255, 255, 0.5);
    }
    /* 白底按钮（打/Roll/放手一搏）置灰：用深绿字避免白底白字（经典模式不描边） */
    .bs-choice-btn.swing:disabled { color: rgba(45, 90, 61, 0.5); }
    /* 经典模式所有按钮都不描边：看（read）去掉基础白框 */
    .bs-choice-btn.read:disabled { box-shadow: none; }
    .bs-choice-btn:disabled:hover { filter: none; }
    .bs-choice-btn.chosen {
      box-shadow: none;
      filter: brightness(1.12);
    }
    /* 经典模式所有按钮不描边（含选中态）：保留提亮区分，去掉框 */
    .bs-choice-btn.chosen { box-shadow: none; }
    #take1BBtn.chosen:disabled, #roll2Btn.chosen:disabled { box-shadow: none; }
    .help-legal {
      position: absolute; left: 22px; bottom: 14px;
      text-align: left; font-size: 12px;
    }
    .help-wx {
      position: absolute; left: 22px; bottom: 60px;
      text-align: left; font-size: 12px !important; color: #9bb6a4 !important;
      line-height: 1.8; max-width: calc(100% - 44px);
    }
    .help-card .help-legal .link-btn, .help-card .help-legal .link-btn:visited, .help-card .help-legal .link-btn:active, .help-card .help-legal .link-btn:hover {
      color: #a8c4ae !important; font-size: 12px; font-weight: normal; text-decoration: underline;
    }
    .help-close {
      position: absolute; top: 10px; right: 14px; font-size: 22px;
      color: #a8c4ae; cursor: pointer; line-height: 1;
    }
    .copyright {
      width: 100%; max-width: 420px; box-sizing: border-box;
      text-align: center; padding: 18px 12px; font-size: 12px;
      color: #7e9a86; letter-spacing: 0.5px;
    }
    .help-close:hover { color: #fff; }
    /* 标题行：Rollin' Ace（位于模式切换下方） */
    .title-row {
      display: flex; align-items: center; justify-content: center;
      margin-bottom: 16px;
    }
    .title-row h1 { margin-bottom: 0; }
    /* 标题后缀模式标签：Rollin' Ace 保留原字体，后缀做成小标签（绿=挑战赛 / 金=系列赛 / 红=无尽挑战）。
       三个标签统一立体胶囊外观：深描边 + 顶部内高光 + 白字投影，与渐变底搭配嵌入深色卡片 */
    .mode-tag {
      display: inline-block; margin-left: 8px; padding: 2px 10px;
      font-size: 14px; font-weight: 600; line-height: 1.4; vertical-align: middle;
      border-radius: 999px; letter-spacing: 1px;
      color: #ffffff;
      border: 1px solid rgba(0,0,0,0.25);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.30), 0 2px 6px rgba(0,0,0,0.28);
      text-shadow: 0 1px 1px rgba(0,0,0,0.35); /* 覆盖 h1 继承的绿色描边，改为白字底部投影 */
    }
    .mode-tag.normal { background: linear-gradient(135deg, #35c46f 0%, #1e9e53 100%); }
    /* 锦标赛标签：琥珀金渐变 */
    .mode-tag.series { background: linear-gradient(135deg, #f2c94c 0%, #cf9b1c 100%); }
    /* 无尽战标签：经典主题下静态红渐变（基础样式），个性主题下叠加燃烧动画 */
    .mode-tag.endless { background: linear-gradient(135deg, #e74c3c 0%, #b02323 100%); }
    body.endless .mode-tag.endless { background: #e74c3c; color: #fff; }
    /* 模式切换三灯：绿=普通 / 黄=系列赛 / 红=无尽，点击跳转对应页面；
       置于标题上方单独一行，与上方按钮区、标题保持清晰间距 */
    .mode-tabs {
      display: flex; gap: 28px; align-items: center; justify-content: center;
      margin: -5px auto 10px;      /* 模式灯行下移 4px：中心线由 20 → 24，与 history/help 对齐 */
    }
    .mode-light {
      appearance: none; border: 2px solid rgba(255,255,255,0.25); cursor: pointer;
      width: 16px; height: 16px; border-radius: 50%; padding: 0; text-decoration: none;
      background: #555; transition: transform .15s ease, box-shadow .15s ease;
      flex-shrink: 0; touch-action: manipulation; -webkit-tap-highlight-color: transparent;
    }
    .mode-light.green { background: #2ecc71; }
    .mode-light.yellow { background: #f1c40f; }
    .mode-light.red { background: #e74c3c; }
    .mode-light:hover { box-shadow: 0 0 0 3px rgba(255,255,255,0.18); }
    .mode-light:active { transform: scale(1.3); }
    .mode-light.active { transform: scale(1.15); box-shadow: 0 0 0 3px rgba(255,255,255,0.3); }
    /* 触屏设备：圆点更大、间距更宽，便于点按 */
    @media (hover: none) and (pointer: coarse) {
      .mode-tabs { gap: 28px; margin: -5px auto 10px; } /* 与基础值一致，确保 iOS 触屏与 PC 同行对齐 */
      .mode-light { width: 16px; height: 16px; border-width: 2.5px; }
    }
    /* 今日挑战展示区 */
    .challenge {
      background: linear-gradient(180deg, rgba(255,255,255,0.10), rgba(255,255,255,0.05));
      border: 1px solid rgba(255,255,255,0.14);
      border-radius: 14px;
      padding: 8px 16px;
      margin-bottom: 24px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 2px 8px rgba(0,0,0,0.12);
    }
    .challenge-head { display: flex; align-items: center; justify-content: center; min-height: 24px; margin-bottom: 6px; }
    .challenge-title-group { position: relative; display: inline-flex; align-items: center; }
    .challenge-title-group .ch-help-btn { position: absolute; left: 100%; top: 50%; transform: translateY(-50%); margin-left: 8px; }
    .challenge-title { font-size: 20px; font-weight: 800; color: #ffe487; text-align: center; margin: 0; }
    .ch-help-btn {
      display: inline-flex; align-items: center; justify-content: center;
      flex: none; width: 22px; min-width: 0;
      padding: 0; height: 22px;
      border-radius: 50%; border: 1px solid rgba(240,216,96,0.6);
      background: rgba(240,216,96,0.08); color: #f0d860; font-size: 15px; font-weight: 700; line-height: 22px;
      cursor: pointer; transition: all .2s; vertical-align: middle;
      box-sizing: border-box; white-space: nowrap;
    }
    .ch-help-btn:hover { background: #f0d860; color: #1f2d23; }
    .challenge-desc {
      font-size: 14px; color: #cfddd4; text-align: left;
      margin: 0; line-height: 1.7;
    }
    .challenge-stats {
      font-size: 12px; color: #8ab894; text-align: left; white-space: pre-line;
      margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.12);
      line-height: 1.8;
    }
    /* 本期挑战 info 浮层（独立样式，不与游戏说明浮层共用） */
    .ch-modal {
      position: fixed; inset: 0; z-index: 100;
      background: rgba(0,0,0,0.6); display: flex;
      /* 超高保护：容器可滚动 + 顶部对齐，配合 .ch-card 的 margin:auto 实现
         「内容不超高时居中、超高时顶部对齐可滚动查看」，避免顶部内容被裁、关闭按钮不可达 */
      align-items: flex-start; justify-content: center; padding: 20px;
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: rgba(255,255,255,0.22) transparent;
    }
    .ch-modal::-webkit-scrollbar { width: 8px; }
    .ch-modal::-webkit-scrollbar-track { background: transparent; }
    .ch-modal::-webkit-scrollbar-thumb {
      background: rgba(255,255,255,0.16); border-radius: 4px;
      border: 2px solid transparent; background-clip: padding-box;
    }
    .ch-card {
      position: relative; max-width: 360px; width: 100%;
      margin: auto; /* 不超高时居中；超高时顶部对齐、由容器滚动 */
      background: #20302a; border: 1px solid rgba(255,255,255,0.15);
      border-radius: 14px; padding: 24px 22px; color: #e8f0ea;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 14px 44px rgba(0,0,0,0.54);
    }
    /* 挑战赛说明标题：居中，字号 17px → 19px */
    .ch-card h2 { font-size: 19px; margin: 0 0 12px; color: #fff; text-align: center; }
    .ch-card p { font-size: 14px; line-height: 1.7; margin: 0; color: #cfddd4; }
    /* 挑战说明正文（挑战赛/无尽/直播共用）：字号 14px → 16px 并加粗，提升可读性 */
    .ch-card #chDescText { font-size: 16px; font-weight: 700; white-space: pre-line; }
    .ch-close {
      position: absolute; top: 10px; right: 14px; font-size: 22px;
      color: #a8c4ae; cursor: pointer; line-height: 1;
      box-shadow: none; /* 透明图标按钮：去掉通用 button 继承的 inset 阴影 */
    }
    .ch-close:hover { color: #fff; }
    .challenge-meta { font-size: 12px; color: #8ab894; text-align: center; margin: 8px 0 8px; }
    body.endless .ch-endless-rank { margin-top: 14px; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.12); }
    body.endless .ch-endless-rank-title { font-size: 13px; font-weight: 700; color: #f0d860; margin-bottom: 6px; }
    body.endless .ch-endless-rank ol { list-style: none; padding: 0; margin: 0 0 10px; }
    body.endless .ch-endless-rank li { font-size: 12px; color: #c8ddd0; line-height: 1.8; white-space: nowrap; }
    body.endless .ch-endless-mine { font-size: 12px; color: #e8f0e8; padding-top: 8px; border-top: 1px dashed rgba(255,255,255,0.14); }
    .challenge-score {
      display: flex; align-items: center; justify-content: space-between;
      font-size: 18px; font-weight: 600; color: #e2f1e8;
      background: rgba(0,0,0,0.18); border-radius: 10px; padding: 6px 10px;
      max-width: 100%; width: 100%; margin: 0 auto; box-sizing: border-box;
    }
    .challenge-score > .ch-side { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: 1 1 0; min-width: 0; }
    /* 记分牌：左 me/主、右 opp/客。me 在左→左对齐，opp 在右→右对齐 */
    .challenge-score > .ch-side-me { align-items: flex-start; }
    .challenge-score > .ch-side-opp { align-items: flex-end; }

    /* 进攻方标记：上半局客队名左侧、下半局主队名右侧，一个小红点 */
    #chOppName.attack-mark, #chMeName.attack-mark { position: relative; }
    #chOppName.attack-mark::before, #chMeName.attack-mark::after {
      content: "";
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      width: 7px;
      height: 7px;
      background: #e5484d;
      border-radius: 50%;
    }
    #chOppName.attack-mark::before { left: -12px; }   /* 客队（右）左侧 */
    #chMeName.attack-mark::after { right: -12px; }    /* 主队（左）右侧 */
    /* 队名：去掉单行截断，允许完整显示（超长自然换行）。保留 line-height 用于攻标记对齐 */
    .challenge-score .ch-side > span:not(.ch-side-tag) {
      max-width: 100%;
      line-height: 1;  /* 与「攻」标记行高一致，确保垂直居中标记与队名文字对齐 */
    }
    /* 队名上方的我方/对方说明标签 */
    .ch-side-tag {
      flex: 0 0 auto;
      font-size: 12px;
      font-weight: 600;
      line-height: 1;
      padding: 2px 6px;
      border-radius: 6px;
      white-space: nowrap;
    }
    .ch-me-tag { color: #bfe9cd; background: rgba(127,200,160,0.18); border: 1px solid rgba(127,200,160,0.35); }
    .ch-opp-tag { color: #e8c0c0; background: rgba(200,120,120,0.14); border: 1px solid rgba(200,120,120,0.3); }
    /* 我方队名高亮：自己的队伍不显示「（我）」文字，用亮绿色+光晕标识 */
    .challenge-score .ch-side .self {
      color: #6ee7a0;
      text-shadow: 0 0 8px rgba(110,231,160,0.55);
    }
    .challenge-score-val {
      flex: 0 0 auto;
      text-align: center;
      white-space: nowrap;
      margin-top: 14px;
    }
    .challenge-score-val { font-size: 32px; color: #ffe487; }
    .challenge-score-val b { font-size: 38px; }
    /* 分数变化时 chMe 闪烁一下，更醒目 */
    @keyframes scoreFlashMe {
      0%   { color: #6ee7a0; text-shadow: 0 0 10px rgba(110,231,160,0.9); transform: scale(1.25); }
      60%  { color: #6ee7a0; text-shadow: 0 0 10px rgba(110,231,160,0.9); transform: scale(1.25); }
      100% { color: #ffe487; text-shadow: none; transform: scale(1); }
    }
    #chMe.score-flash { animation: scoreFlashMe 0.4s ease; display: inline-block; }
    .challenge-status { font-size: 12px; text-align: center; margin-top: 6px; font-weight: 600; }
    .challenge-status.done { color: #6ee7a0; }
    .challenge-status.todo { color: #ffe487; }
    .ch-desc-end { font-size: 12px; color: #8ab894; text-align: left; margin-top: 10px; }
    /* 3D 骰子：scene 提供透视，cube 是真正的立方体（尺寸 ×2）*/
    .dice-area {
      position: relative; /* 作为道具图标右侧定位的参照 */
      z-index: 20; /* 置于垒包/本期挑战之上，避免被遮挡 */
      width: 100%; /* 撑满卡片宽度，保证骰子整体居中 */
      margin: 32px auto;
      display: flex;
      align-items: center;
      justify-content: center;
      /* 上下留白 57px：为骰子两侧的按钮列（报/播/战/更新，总高约 188px）腾出空间，
         使最上方【报】不碰到挑战区、最下方【更新】不碰到垒包 */
      margin: 57px 0 57px;
    }
    .dice-scene {
      width: 90px; height: 90px;
      perspective: 450px;
      user-select: none;
      position: relative; /* 多骰叠放，仅显示当前那颗 */
      flex-shrink: 0;
      transition: width 0.3s ease; /* 双骰模式下平滑加宽 */
    }
    /* Double Dice 模式：两颗骰并排（Dice1 居左，Dice2 居右）。
       间距保持 18px（避开「播」/「技」按钮），宽度相应收窄保持居中。 */
    .dice-scene.double { width: 198px; }
    .dice-scene.double #diceMain { left: 0; }
    .dice-scene.double #diceDice2 { left: 108px; }
    .dice-cube {
      position: absolute; /* 全部绝对定位，叠加在同一位置 */
      left: 0; top: 0;
      width: 90px; height: 90px;
      transform-style: preserve-3d;
      /* 背景色兜底：3D 面之间浮点渲染会产生细小缝隙，白色背景避免透出深色；
         隐藏自身背景平面的背面，避免旋转时从面内侧穿透造成闪动 */
      background: #fff;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      will-change: transform; /* 提示浏览器提升合成层，慢速动画更平滑 */
    }
    .dice-cube.hidden { display: none; }
    .dice-cube {
      transform: rotateY(180deg); /* 初始显示 1B 面（back）*/
      transition: transform 0.6s cubic-bezier(0.2, 0.8, 0.3, 1);
    }
    .dice-cube.rolling {
      animation: diceSpin 0.7s linear infinite;
      transition: none;
    }
    /* 待机展示态：缓慢转动，示意这是一个骰子（仅刷新加载后一次性启用） */
    .dice-cube.idle {
      animation: diceIdle 10s linear infinite;
      transition: none;
    }
    @keyframes diceIdle {
      0%   { transform: rotateX(0deg) rotateY(180deg); }
      25%  { transform: rotateX(90deg) rotateY(270deg); }
      50%  { transform: rotateX(180deg) rotateY(360deg); }
      75%  { transform: rotateX(270deg) rotateY(450deg); }
      100% { transform: rotateX(360deg) rotateY(540deg); }
    }
    @keyframes diceSpin {
      0%   { transform: rotateX(0deg) rotateY(0deg); }
      25%  { transform: rotateX(180deg) rotateY(90deg); }
      50%  { transform: rotateX(360deg) rotateY(180deg); }
      75%  { transform: rotateX(540deg) rotateY(270deg); }
      100% { transform: rotateX(720deg) rotateY(360deg); }
    }
    .dice-face {
      position: absolute;
      width: 90px; height: 90px;
      border-radius: 4px;
      background: #fff;
      box-shadow: 0 4px 12px rgba(0,0,0,0.2), inset 0 -3px 6px rgba(0,0,0,0.08);
      display: flex; align-items: center; justify-content: center;
      font-size: 20px; font-weight: 800; color: #1a1a1a;
      letter-spacing: 0.3px;
      backface-visibility: hidden;
      -webkit-backface-visibility: hidden;
      border: 2px solid #ddd;
    }
    /* 棒球缝线装饰：在指定棱对应的面边界上画红白间隔线（更细更密） */
    .seam { position: absolute; z-index: 3; pointer-events: none; border-radius: 2px; }
    .seam.t { top: 0; left: 0; right: 0; height: 5px;
      background: repeating-linear-gradient(90deg, #e5484d 0 3px, #fff 3px 6px); }
    .seam.b { bottom: 0; left: 0; right: 0; height: 5px;
      background: repeating-linear-gradient(90deg, #e5484d 0 3px, #fff 3px 6px); }
    .seam.l { left: 0; top: 0; bottom: 0; width: 5px;
      background: repeating-linear-gradient(0deg, #e5484d 0 3px, #fff 3px 6px); }
    .seam.r { right: 0; top: 0; bottom: 0; width: 5px;
      background: repeating-linear-gradient(0deg, #e5484d 0 3px, #fff 3px 6px); }
    /* 每个面显示固定内容（结果 → 面序号映射见 JS RESULT_TO_INDEX）*/
    .dice-face .result-label {
      position: absolute;
      left: 50%; top: 50%;
      transform: translate(-50%, -50%);
      white-space: nowrap;
    }
    /* 好坏球骰面：好球框+球 SVG 图（viewBox 3:4，显示 66×88 保持比例不失真） */
    .dice-face .bs-face {
      width: 85px;
      height: 90px;
      pointer-events: none;
    }
    /* 出局类面（OUT / 双杀）白底红字 */
    .dice-face.out-face {
      color: #e5484d;
    }
    /* 英文 OUT 视觉窄，放大字号 + 轻微字距，与汉字（一垒打等）视觉一致 */
    .dice-face.out-en .result-label {
      font-size: 26px;
      letter-spacing: 1px;
    }
    /* 六个面定位（立方体边长 90，半距 45）*/
    .face-front  { transform: rotateY(0deg)   translateZ(45px); }
    .face-back   { transform: rotateY(180deg) translateZ(45px); }
    .face-right  { transform: rotateY(90deg)  translateZ(45px); }
    .face-left   { transform: rotateY(-90deg) translateZ(45px); }
    .face-top    { transform: rotateX(90deg)  translateZ(45px); }
    .face-bottom { transform: rotateX(-90deg) translateZ(45px); }
    /* 紧凑局面区：垒包(中心显示局数) + 出局灯 融为一体 */
    .situation {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 0;
      margin: 16px auto 20px;
    }
    .bases-wrap {
      display: flex;
      justify-content: center;
    }
    .bases {
      display: grid;
      grid-template-columns: repeat(3, 30px);
      grid-template-rows: repeat(3, 30px);
      gap: 8px;
      position: relative;
    }
    /* 中心格：局数指示器（局数居中 + 三角标记上下半局） */
    .inning {
      grid-column: 2;
      grid-row: 2;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #1a2233;
      font-weight: 800;
    }
    .inning .inn-num {
      font-size: 25px;
      line-height: 1.1;
      color: #f0d860;
    }
    /* 下半局（默认）：倒三角 ▼ 在数字下方，数字在上方 */
    .inning.bottom-half .inn-arrow {
      position: absolute;
      top: 100%;
      left: 50%;
      transform: translateX(-50%);
      font-size: 16px;
      line-height: 1;
      color: #f0d860;
      margin-top: 1px;
    }
    /* 上半局：正三角 ▲ 在数字上方，数字在下方 */
    .inning.top-half .inn-arrow {
      position: absolute;
      bottom: 100%;
      left: 50%;
      transform: translateX(-50%);
      font-size: 16px;
      line-height: 1;
      color: #f0d860;
      margin-bottom: -14px; /* 向下偏移，避免三角顶到网格上沿遮挡二垒 */
    }
    /* 上半局：数字下移，避免与上方三角重叠（flex 默认水平居中，这里仅兜底垂直对齐） */
    .inning.top-half .inn-num {
      position: relative;
      top: 15px;
    }
    /* 半局更新闪亮提示：局号 + 半局三角发光脉冲（board.js 切换上下半局时短暂加 .inning-flash） */
    .inning.inning-flash {
      animation: inning-flash-shine .6s ease-out 2;
    }
    .inning.inning-flash .inn-num,
    .inning.inning-flash .inn-arrow {
      animation: inning-flash-pulse .6s ease-out 2;
    }
    @keyframes inning-flash-shine {
      0%, 100% { transform: scale(1); filter: brightness(1); }
      50% { transform: scale(1.2); filter: brightness(2) drop-shadow(0 0 10px rgba(240,216,96,.95)); }
    }
    @keyframes inning-flash-pulse {
      0%, 100% { color: #f0d860; }
      50% { color: #fff; text-shadow: 0 0 6px rgba(255,255,255,.9); }
    }
    button {
      width: 100%;
      padding: 14px;
      border: none;
      border-radius: 12px;
      background: #fff;
      color: #2d5a3d;
      font-size: 18px;
      font-weight: 800;
      cursor: pointer;
      /* 底部投影，按钮浮起有层次（不靠 inset 高光，避免边缘发亮） */
      box-shadow: 0 4px 12px rgba(0,0,0,0.18);
      /* 缩放/回弹过渡：移动端轻击也能看到按压反馈（配合 body[ontouchstart] 激活 :active） */
      transition: transform .12s ease, filter .12s ease, box-shadow .12s ease;
    }
    button:disabled { background: rgba(255,255,255,0.4); color: #2d5a3d; cursor: not-allowed; box-shadow: none; animation: none !important; transform: none !important; }
    #rollBtn, #take1BBtn, #roll2Btn {
      font-size: 22px; line-height: 1.1; height: 54px;
      white-space: nowrap; display: flex; align-items: center; justify-content: center;
    }
    /* Roll 主按钮：白色→浅绿灰渐变（浅色系），文字保持深绿 */
    #rollBtn {
      background: linear-gradient(135deg, #ffffff 0%, #eaf0ec 100%);
      color: #2d5a3d;
    }
    /* Roll 点击后置灰：与「打」按钮一致——背景保持白渐变，仅文字降为半透明深绿 */
    #rollBtn:disabled {
      color: rgba(45, 90, 61, 0.5);
    }
    /* 主要比赛按钮的点击反馈：悬停提亮并上浮、按下缩放 */
    #rollBtn:not(:disabled):hover, #take1BBtn:not(:disabled):hover,
    #roll2Btn:not(:disabled):hover {
      filter: brightness(1.09);
      transform: translateY(-1px);
      box-shadow: 0 6px 16px rgba(0,0,0,0.22);
    }
    #rollBtn:not(:disabled):active, #take1BBtn:not(:disabled):active,
    #roll2Btn:not(:disabled):active {
      transform: scale(0.95);
      filter: brightness(0.92);
    }
    /* 安打保底：与「看」一致（绿色渐变），文字始终白色 */
    #take1BBtn {
      background: linear-gradient(135deg, #3a9a6a, #358f62);
      color: #fff;
    }
    /* 选dice2/放手一搏：与「打」/Roll 统一（白色渐变），文字深绿 */
    #roll2Btn {
      background: linear-gradient(135deg, #ffffff, #eaf0ec);
      color: #2d5a3d;
      font-weight: 800;
      letter-spacing: 1px;
    }
    /* 点击后（置灰态）：文字亮度降低，不描边 */
    #take1BBtn:disabled, #roll2Btn:disabled {
      cursor: not-allowed;
      color: rgba(255, 255, 255, 0.5);
    }
    /* 白底按钮（选dice2/放手一搏）置灰：用深绿字，避免白底白字看不清 */
    #roll2Btn:disabled { color: rgba(45, 90, 61, 0.5); }
    /* 经典模式所有按钮都不描边：安打保底/放手一搏去掉白框 */
    #take1BBtn:disabled, #roll2Btn:disabled { box-shadow: none; }
    /* 被选中者（与打/看 chosen 一致）：提亮区分，不描边（经典/无尽均不描边，去掉白边） */
    #take1BBtn.chosen:disabled, #roll2Btn.chosen:disabled {
      box-shadow: none;
      filter: brightness(1.12);
    }
    /* 再来一局按钮：每局结束（胜/负）出现，覆盖 Roll（普通）或打/看（好坏球）位置，样式与 Roll 一致 */
    #newGameBtn {
      font-size: 22px; line-height: 1.1; height: 54px;
      white-space: nowrap; display: flex; align-items: center; justify-content: center;
      background: linear-gradient(135deg, #ffffff 0%, #eaf0ec 100%);
      color: #2d5a3d;
      font-weight: 800;
      border: none; border-radius: 12px; width: 100%; padding: 14px;
      cursor: pointer; box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    }
    #newGameBtn:not(:disabled):hover { filter: brightness(1.09); }
    #newGameBtn:not(:disabled):active { transform: scale(0.95); filter: brightness(0.92); }
    .result {
      margin-top: 6px;                 /* 较 16px 减 10px，使主操作区到卡片底部距离缩短 10px */
      padding: 0;
      border: none;
      background: none;
      text-align: center;
      font-size: 17px;
      font-weight: 700;
      color: #9bb6a4;
      height: 51px;                 /* 固定 2 行高度（line-height 1.5 × 17px × 2） */
      line-height: 1.5;
      white-space: normal;
      overflow: hidden;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .result.passed { color: #6ee7a0; }
    .result.failed { color: #f08070; }
    /* 道具战术骰结果配色：bad=红（如雾的 Nice Play / 盗·牺失败），good=绿（失误·成功等） */
    .result.good { color: #6ee7a0; }
    .result.bad { color: #f08070; }
    /* 好坏球击中（好球击中 / 坏球打到了）：醒目高亮，颜色与普通主题 good（成功=绿）保持一致 */
    .result.bs-hit {
      color: #6ee7a0;
      font-weight: 900;
      /* 好球/坏球击中：静态醒目高亮（颜色/字重），字号沿用 .result 基础 17px */
    }
    /* ===== 无尽模式「红·黑·白」史诗主题 =====（仅 body.endless 生效）
       语义：红=失败(bad) / 白=成功(good) / 灰=中立(none)。基底炭黑+白字，红做能量点缀。 */
    body.endless {
      background: #0d0a0a;
      color: #ece4e2;
    }
    /* 无尽模式 html 兜底同色：内容溢出 body 时避免露出经典绿/白 */
    html:has(body.endless) { background: #0d0a0a; }
    body.endless .card {
      /* 与炭黑背景同属暗红黑色系、更亮一级；外围加血红色泛光，并带血光闪动（血色脉动） */
      background: linear-gradient(180deg, #2c1614 0%, #1a0e0d 100%);
      box-shadow: 0 0 22px rgba(190,30,30,0.45), 0 0 48px rgba(150,20,20,0.28), 0 8px 32px rgba(0,0,0,0.55);
      animation: cardBlood 2.2s ease-in-out infinite;
    }
    @keyframes cardBlood {
      0%, 100% {
        box-shadow: 0 0 14px rgba(180,25,25,0.34), 0 0 36px rgba(140,18,18,0.20), 0 8px 32px rgba(0,0,0,0.55);
      }
      50% {
        box-shadow: 0 0 30px rgba(220,40,40,0.64), 0 0 64px rgba(165,24,24,0.42), 0 8px 32px rgba(0,0,0,0.55);
      }
    }
    body.endless h1 {
      color: #ffffff;
      /* 与普通模式 h1 一致的三层立体投影，仅描边色由墨绿改为深红 */
      text-shadow: 0 1px 0 rgba(255,255,255,0.18), 2px 2px 0 #3a0d0d, 4px 4px 10px rgba(0,0,0,0.25);
    }
    /* 无尽模式标签「无尽战」：燃烧文字效果（火红脉动发光，无火苗） */
    body.endless .mode-tag.endless {
      background: linear-gradient(135deg, #e5484d 0%, #b02323 100%);
      animation: tagBurn 1.2s ease-in-out infinite;
      /* 去除字符末尾间距，使「无尽战」在胶囊内自然水平居中（基础 padding 已对称） */
      letter-spacing: normal;
      text-align: center;
    }
    @keyframes tagBurn {
      0%, 100% {
        box-shadow: 0 0 6px rgba(255,120,50,0.55);
        text-shadow: 0 0 5px rgba(255,210,130,0.8), 0 0 12px rgba(255,80,40,0.55);
      }
      50% {
        box-shadow: 0 0 16px rgba(255,90,40,0.9);
        text-shadow: 0 0 9px rgba(255,230,150,1), 0 0 22px rgba(255,80,40,0.9);
      }
    }
    body.endless .sub { color: #bfb3b1; }
    body.endless .log { color: #9c8d8b; }
    body.endless #rollBtn {
      background: linear-gradient(135deg, #e5484d 0%, #b02323 100%);
      color: #ffffff;
      box-shadow: none; /* 无尽红钮：去掉经典主题的 inset 边缘高光 */
    }
    /* 无尽红钮 hover：只上浮 + 深色投影，不要浅色 inset 高光（边缘发亮） */
    body.endless #rollBtn:not(:disabled):hover,
    body.endless #take1BBtn:not(:disabled):hover,
    body.endless #roll2Btn:not(:disabled):hover {
      box-shadow: 0 6px 16px rgba(0,0,0,0.35);
    }
    body.endless #newGameBtn {
      background: linear-gradient(135deg, #e5484d 0%, #b02323 100%);
      color: #ffffff;
      box-shadow: none; /* 无尽红钮：去掉经典主题的 inset 边缘高光 */
    }
    body.endless #newGameBtn:not(:disabled):hover {
      box-shadow: 0 6px 16px rgba(0,0,0,0.35);
    }
    /* 主要按钮无尽配色：看=读球(good)→白 / 打=挥棒(bad)→红；安打保底/放手一搏跟随看/打 */
    body.endless .bs-choice-btn.read {
      background: linear-gradient(135deg, #f4f4f4 0%, #d7d2d0 100%);
      color: #1c1c1c;
    }
    body.endless .bs-choice-btn.swing {
      background: linear-gradient(135deg, #e5484d 0%, #b02323 100%);
      color: #ffffff;
    }
    body.endless .bs-choice-btn.bs-restart {
      background: linear-gradient(135deg, #3a3a3a 0%, #232323 100%);
      color: #cfc9c9;
    }
    body.endless #take1BBtn {
      background: linear-gradient(135deg, #f4f4f4 0%, #d7d2d0 100%);
      color: #1c1c1c;
    }
    body.endless #roll2Btn {
      background: linear-gradient(135deg, #e5484d 0%, #b02323 100%);
      color: #ffffff;
    }
    /* 点击后置灰态：文字亮度降低 + 细白框（与打/看一致，无尽下保持可读） */
    body.endless #take1BBtn:disabled { color: rgba(28, 28, 28, 0.5); }
    body.endless #roll2Btn:disabled { color: rgba(255, 255, 255, 0.55); }
    /* Roll（无尽红钮）置灰：与无尽「打」按钮一致——背景保持红渐变，文字降为半透明白 */
    body.endless #rollBtn:disabled { color: rgba(255, 255, 255, 0.55); }
    /* 白底按钮（看/安打保底）置灰用深灰字；红底按钮（打/放手一搏）置灰用半透明白字 */
    body.endless .bs-choice-btn.read:disabled { color: rgba(28, 28, 28, 0.5); }
    body.endless .bs-choice-btn.swing:disabled { color: rgba(255, 255, 255, 0.55); }
    /* 无尽下主要按钮均不描边（与经典一致）：打/看/安打保底/放手一搏，仅以字色 + 提亮区分状态 */
    body.endless .bs-choice-btn:disabled,
    body.endless #take1BBtn:disabled,
    body.endless #roll2Btn:disabled { box-shadow: none; }
    /* 好坏球开关：无尽红·黑·白适配（红底白字选中态） */
    body.endless .bs-toggle-track { background: rgba(255,255,255,0.12); }
    body.endless .bs-seg { color: rgba(255,255,255,0.7); }
    body.endless .bs-toggle input:not(:checked) + .bs-toggle-track .seg-person,
    body.endless .bs-toggle input:checked + .bs-toggle-track .seg-ball {
      background: #e5484d; color: #ffffff;
    }
    /* 场景挑战页面（锦标赛/系列挑战）：主按钮 Roll / 再来一局沿用经典白底深绿样式，
       标题标签「锦标赛」保持琥珀金、当前模式灯保持黄色，不与无尽模式同色 */
    /* 主按钮区容器：包裹好坏球开关与所有主操作按钮（含互斥切换），便于整体布局与后续改动 */
    .action-bar {
      display: flex;
      flex-direction: column;
      /* 整体上移 10px（经典与无尽一致），压缩主操作区与上方内容的间距 */
      margin-top: -10px;
      /* 提升为独立合成层：隔离上方骰子落定（3D transform 过渡 + will-change）时的重绘波及，
         消除 dice1 结果出现瞬间 rollBtn 的亚像素上移抖动 */
      transform: translateZ(0);
    }
    /* 无尽浮层适配：技能卡 / 比赛描述 / 赛后发奖 → 红·黑·白 */
    body.endless .item-panel {
      background: rgba(28, 14, 14, 0.98);
      border-color: rgba(229, 72, 77, 0.4);
    }
    body.endless .item-panel-head { color: #ffffff; }
    body.endless .item-panel-sub { color: #b3a3a2; }
    body.endless .item-close { background: transparent; color: #ece4e2; }
    body.endless .item-cell {
      background: rgba(255,255,255,0.06);
      border-color: rgba(255,255,255,0.14);
    }
    body.endless .item-cell.selected { border-color: #e5484d; }
    body.endless .item-cell-count { color: #b3a3a2; }
    body.endless .item-cell-desc { color: #cfc2c0; }
    body.endless .endless-desc-modal .ch-card {
      background: linear-gradient(180deg, #221313 0%, #170d0d 100%);
      border-color: rgba(229,72,77,0.35);
    }
    body.endless .endless-desc-modal .ch-close { color: #d9c9c8; }
    body.endless .endless-desc-modal .ch-card h2 { color: #ffffff; }
    body.endless .endless-desc-modal .ch-card p {
      color: #cfc2c0; background: rgba(255,255,255,0.05);
    }
    body.endless .endless-desc-modal .ch-endless-rank { border-top-color: rgba(229,72,77,0.25); }
    /* 无尽记分牌：我方/对方标签、比分、分数闪烁 → 红·黑·白（去掉绿/金） */
    body.endless .challenge-score { color: #e9dfdd; background: rgba(255,255,255,0.04); }
    body.endless .challenge-score-val { color: #ff8c66; }             /* 比分分数 → 亮橙红（浅一点） */
    body.endless .challenge-title { color: #ff8c66; }                    /* 计分牌标题 → 亮橙红（红系） */
    body.endless .ch-me-tag { color: #ffffff; background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.30); }
    body.endless .ch-opp-tag { color: #ff8c66; background: rgba(229,72,77,0.16); border: 1px solid rgba(229,72,77,0.45); }
    body.endless #chMe.score-flash { animation: endlessScoreFlash 0.4s ease; }
    @keyframes endlessScoreFlash {
      0%, 60% { color: #ffffff; text-shadow: 0 0 10px rgba(229,72,77,0.9); transform: scale(1.25); }
      100%    { color: #ffffff; text-shadow: none; transform: scale(1); }
    }
    /* 无尽比赛说明：排行榜标题/列表/我的分数 → 红·黑·白（去掉绿/金） */
    body.endless .endless-desc-modal .ch-endless-rank-title { color: #ffffff; text-shadow: 0 2px 8px rgba(229,72,77,0.35); }
    body.endless .endless-desc-modal .ch-endless-rank li { color: #d5c6c4; }
    body.endless .endless-desc-modal .ch-endless-rank li:nth-child(1) { background: rgba(229,72,77,0.16); }
    body.endless .endless-desc-modal .ch-endless-rank li .cer-no { color: #ff8c66; }
    body.endless .endless-desc-modal .ch-endless-rank li .cer-score { color: #f0f0f0; font-weight: 700; }
    body.endless .endless-desc-modal .ch-endless-mine { color: #ece4e2; background: rgba(255,255,255,0.05); border: 1px solid rgba(229,72,77,0.25); }
    body.endless .endless-desc-modal .ch-endless-mine b { color: #f0f0f0; font-weight: 700; }
    /* 无尽排行榜浮层 → 红·黑·白 */
    body.endless .endless-rank-card {
      background: linear-gradient(180deg, #221313 0%, #170d0d 100%);
      border-color: rgba(229,72,77,0.45);
    }
    body.endless .endless-rank-close { color: #d9c9c8; }
    body.endless .endless-rank-title { color: #ffffff; text-shadow: 0 2px 8px rgba(229,72,77,0.35); }
    body.endless .endless-rank-desc { color: #c9bcba; }
    body.endless .endless-rank-user b { color: #ff8c66; }
    body.endless .endless-rank-user { color: #d5c6c4; background: rgba(255,255,255,0.06); border-color: rgba(255,255,255,0.12); }
    body.endless .endless-rank-row { border-bottom-color: rgba(255,255,255,0.08); }
    body.endless .endless-rank-row:nth-child(1) { background: rgba(229,72,77,0.16); }
    body.endless .endless-rank-row:nth-child(2) { background: rgba(255,255,255,0.09); }
    body.endless .endless-rank-row:nth-child(3) { background: rgba(255,255,255,0.07); }
    body.endless .endless-rank-no { color: #ff8c66; }
    body.endless .endless-rank-uid { color: #d5c6c4; }
    body.endless .endless-rank-score { color: #f0f0f0; font-weight: 700; }
    body.endless .endless-rank-empty { color: #b3a3a2; }
    body.endless .endless-rank-foot { border-top-color: rgba(229,72,77,0.25); color: #b3a3a2; }
    body.endless .endless-desc-modal .ch-desc-end { color: #b3a3a2; }
    /* 无尽我的战绩浮层 → 红·黑·白（去掉绿/金/彩色条，三节统一红色） */
    body.endless .hist-card {
      background: linear-gradient(180deg, #221313 0%, #170d0d 100%);
      border-color: rgba(229,72,77,0.45);
    }
    body.endless .hist-close { color: #d9c9c8; }
    body.endless .hist-title { color: #ffffff; text-shadow: 0 2px 8px rgba(229,72,77,0.35); }
    body.endless .hist-section { border-bottom-color: rgba(229,72,77,0.25); }
    body.endless .hist-section::before,
    body.endless .hist-section:nth-of-type(2)::before,
    body.endless .hist-section:nth-of-type(3)::before,
    body.endless .hist-section:nth-of-type(4)::before { background: #e5484d; }
    body.endless .hist-h,
    body.endless .hist-section:nth-of-type(2) .hist-h,
    body.endless .hist-section:nth-of-type(3) .hist-h,
    body.endless .hist-section:nth-of-type(4) .hist-h { color: #ffffff; }
    body.endless .hist-row { color: #d5c6c4; }
    body.endless .hist-row b { color: #ff8c66; }
    body.endless .hist-ids { color: #b3a3a2; }
    body.endless .hist-tip { color: #8a7b79; }
    body.endless .reward-card {
      background: linear-gradient(160deg, #241313, #170d0d);
      border-color: rgba(229,72,77,0.45);
      color: #ece4e2;
    }
    body.endless .reward-title { color: #ffffff; text-shadow: 0 2px 8px rgba(229,72,77,0.35); }
    body.endless .reward-chip-num { color: #ece4e2; }
    body.endless .reward-msg { color: #c9bcba; }
    body.endless .reward-close {
      background: linear-gradient(135deg, #e5484d 0%, #b02323 100%);
      color: #ffffff;
    }
    /* 结果语义色：白=成功 / 红=失败 / 灰=中立 */
    body.endless .result { color: #b7acac; }
    body.endless .result.good { color: #ffffff; }
    body.endless .result.bad { color: #e5484d; }
    body.endless .result.passed { color: #ffffff; }
    body.endless .result.failed { color: #e5484d; }
    body.endless .result.bs-hit { color: #ffffff; } /* 好坏球击中：白（无尽成功=白，醒目高亮） */
    /* 无尽主题下说明浮层（游戏说明）适配 → 红·黑·白 */
    body.endless .help-card {
      background: linear-gradient(180deg, #221313 0%, #170d0d 100%);
      border-color: rgba(229,72,77,0.35);
    }
    body.endless .help-card h2 { color: #ffffff; }
    body.endless .help-card p { color: #cfc2c0; }
    body.endless .help-note { color: #b3a3a2 !important; }
    body.endless .help-update-title { color: #b3a3a2; } /* 与无尽主题 help-note 同色 */
    body.endless .help-update-list li { color: #b3a3a2; }
    body.endless .help-vol { color: #b3a3a2; }
    body.endless .help-theme { color: #b3a3a2; }
    body.endless .help-wx { color: #b3a3a2 !important; }
    body.endless .help-card a.link-btn, body.endless .help-card a.link-btn:visited,
    body.endless .help-card a.link-btn:active, body.endless .help-card a.link-btn:hover { color: #ff8c66 !important; }
    body.endless .help-card .help-legal .link-btn,
    body.endless .help-card .help-legal .link-btn:visited,
    body.endless .help-card .help-legal .link-btn:active,
    body.endless .help-card .help-legal .link-btn:hover { color: #ff8c66 !important; }
    /* 开发者/法律声明链接：无尽主题下与经典（普通）主题保持一致颜色（ID 选择器最高优先级） */
    body.endless #helpWxLink, body.endless #helpWxLink:visited,
    body.endless #helpWxLink:active, body.endless #helpWxLink:hover { color: #f0d860 !important; }
    body.endless #helpLegalLink, body.endless #helpLegalLink:visited,
    body.endless #helpLegalLink:active, body.endless #helpLegalLink:hover { color: #cfc2c0 !important; }
    body.endless .help-close { color: #d9c9c8; }
    body.endless .help-close:hover { color: #ffffff; }
    body.endless .theme-seg { background: rgba(255,255,255,0.12); }
    body.endless .theme-opt { color: #d5c6c4; }
    /* 白=成功：个性主题下选中态用白底黑字 */
    body.endless .theme-opt.active { background: #ffffff; color: #1c1c1c; font-weight: 600; }
    .log { margin-top: 12px; font-size: 12px; color: #8ab894; }
    .uid-row { margin-top: 20px; display: none; align-items: center; justify-content: center; gap: 8px; flex-wrap: wrap; }
    .uid { font-size: 11px; color: #5a8a66; text-align: left; word-break: break-all; cursor: pointer; transition: color .15s ease; }
    .uid:hover { color: #7fc8a0; text-decoration: underline; text-underline-offset: 2px; }

    /* 找回数据弹层（暗色玻璃拟态，与 reward-overlay 风格一致） */
    .recover-overlay {
      position: fixed; inset: 0; z-index: 60;
      display: flex; align-items: center; justify-content: center;
      background: rgba(8, 14, 24, 0.62); backdrop-filter: blur(6px);
      opacity: 0; pointer-events: none; transition: opacity 0.2s ease;
    }
    .recover-overlay.show { opacity: 1; pointer-events: auto; }
    .recover-card {
      position: relative;
      width: min(420px, 90vw); padding: 22px;
      border-radius: 18px;
      background: linear-gradient(160deg, rgba(20,32,26,0.95), rgba(10,18,14,0.95));
      border: 1px solid rgba(127,200,160,0.3);
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.05), 0 20px 56px rgba(0,0,0,0.58);
      transform: translateY(12px) scale(0.98); transition: transform 0.2s ease;
    }
    .recover-overlay.show .recover-card { transform: translateY(0) scale(1); }
    .recover-close {
      position: absolute; top: 10px; right: 14px; left: auto; width: auto;
      border: none; background: none; color: #7fc8a0;
      font-size: 22px; line-height: 1; text-align: right; cursor: pointer;
      box-shadow: none; /* 透明图标按钮：去掉通用 button 继承的 inset 阴影 */
    }
    .recover-close:hover { color: #a8e8c4; }
    .recover-title { font-size: 16px; font-weight: 700; color: #e2e8f0; margin-bottom: 14px; padding-right: 28px; }
    .recover-hint { font-size: 12px; line-height: 1.6; color: #94a3b8; margin-bottom: 10px; }
    .recover-uid-row { display: flex; flex-direction: column; gap: 10px; }
    .recover-uid {
      width: 100%; box-sizing: border-box; padding: 10px 12px; border-radius: 10px;
      background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.12);
      color: #cbd5e1; font-size: 13px; line-height: 1.6; word-break: break-all;
      overflow-wrap: anywhere;
      font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
    }
    .recover-copy {
      align-self: flex-end; padding: 9px 18px; border: none; border-radius: 8px;
      background: linear-gradient(135deg, #3a9a6a, #1e5c40); color: #fff;
      font-size: 12px; font-weight: 600; cursor: pointer; white-space: nowrap;
    }
    .recover-copy:hover { filter: brightness(1.08); }
    .recover-divider { height: 1px; background: rgba(255,255,255,0.1); margin: 18px 0; }
    .recover-subtitle { font-size: 13px; font-weight: 700; color: #e2e8f0; margin-bottom: 8px; }
    .recover-desc { font-size: 12px; line-height: 1.6; color: #94a3b8; margin-bottom: 14px; }
    .recover-input {
      width: 100%; padding: 12px 14px; border-radius: 10px;
      background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.14);
      color: #e2e8f0; font-size: 13px; font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
      outline: none;
    }
    .recover-input:focus { border-color: #5a9a78; box-shadow: 0 0 0 3px rgba(90,154,120,0.25); }
    .recover-msg { min-height: 18px; margin-top: 10px; font-size: 12px; text-align: center; }
    .recover-msg.err { color: #f08070; }
    .recover-msg.ok { color: #6ee7a0; }
    .recover-btns { display: flex; gap: 10px; margin-top: 14px; }
    .recover-cancel, .recover-confirm {
      flex: 1; padding: 11px; border: none; border-radius: 10px;
      font-size: 14px; font-weight: 700; cursor: pointer;
    }
    .recover-cancel { background: rgba(255,255,255,0.1); color: #cbd5e1; }
    .recover-cancel:hover { background: rgba(255,255,255,0.16); }
    .recover-confirm { background: linear-gradient(135deg, #3a9a6a, #1e5c40); color: #fff; }
    .recover-confirm:hover { filter: brightness(1.08); }
    .recover-confirm:disabled { opacity: 0.55; cursor: not-allowed; filter: none; }
    /* 菱形布局：二垒(顶中) / 一垒(右下) / 三垒(左下)，本垒在底部中间 */
    .base[data-base="1"] { grid-column: 2; grid-row: 1; } /* 二垒 */
    .base[data-base="0"] { grid-column: 3; grid-row: 2; } /* 一垒 */
    .base[data-base="2"] { grid-column: 1; grid-row: 2; } /* 三垒 */
    .base {
      width: 26px; height: 26px;
      transform: rotate(45deg);
      background: rgba(255,255,255,0.12);
      border: 1px solid rgba(255,255,255,0.18);
      align-self: center; justify-self: center;
    }
    .base.on { background: #f0d860; border-color: #f0d860; }
    /* 无尽模式：垒包保持暗色底座，跑者恢复原样（无闪烁） */
    /* 跑者 = 移动的垒包块：直接用「亮起的垒包」在垒间滑动/亮起/回本，替代小圆点 */
    .runner {
      position: absolute;
      width: 22px; height: 22px;
      background: #f0d860;
      border: 2px solid #f7ec9f;
      box-shadow: 0 0 10px rgba(240,216,96,0.9);
      transform: translate(-50%, -50%) rotate(45deg);
      transition: left 0.5s ease, top 0.5s ease, opacity 0.45s ease;
      pointer-events: none;
      opacity: 0;
      z-index: 5;
    }
    /* 上垒亮起：垒包块出现时的小弹跳 + 强发光 */
    .runner.appear {
      animation: runnerAppear 0.5s ease-out;
    }
    @keyframes runnerAppear {
      0%   { opacity: 0; transform: translate(-50%, -50%) rotate(45deg) scale(0.3); box-shadow: 0 0 0 rgba(240,216,96,0); }
      60%  { opacity: 1; transform: translate(-50%, -50%) rotate(45deg) scale(1.35); box-shadow: 0 0 18px rgba(240,216,96,1); }
      100% { opacity: 1; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
    }
    /* 回本得分：垒包块从三垒方向冲向本垒并渐隐 */
    .runner.scoring {
      opacity: 1;
      animation: runnerScore 0.7s ease-in forwards;
    }
    @keyframes runnerScore {
      0%   { opacity: 1; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      40%  { opacity: 1; transform: translate(-50%, -50%) rotate(45deg) scale(1.2); }
      100% { opacity: 0; transform: translate(-50%, -50%) rotate(45deg) scale(0.5); }
    }
    /* 出局：垒包块原地消失（红闪） */
    .runner.out {
      animation: runnerOut 0.45s ease-in forwards;
    }
    @keyframes runnerOut {
      0%   { opacity: 1; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      100% { opacity: 0; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(0.2); }
    }
    /* 盗垒失败：1垒扑向2垒被触杀，红闪两下后消失 */
    .runner.steal-fail {
      animation: runnerStealFail 0.7s ease-in forwards;
    }
    @keyframes runnerStealFail {
      0%   { opacity: 1; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      22%  { opacity: 0.15; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      34%  { opacity: 1; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      56%  { opacity: 0.15; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      68%  { opacity: 1; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(1); }
      100% { opacity: 0; background: #ff5a5f; border-color: #ffb3b3; transform: translate(-50%, -50%) rotate(45deg) scale(0.2); }
    }
    /* 好坏球灯：一行 3 坏(绿) + 2 好(黄) + 3 出局(红)；关闭开关时通过 .bs-light{display:none}
       隐藏坏/好 5 颗，仅留 3 颗出局灯（#outs 嵌回 .bs-lights 内，display:contents 让 out-dot
       直接作为 .bs-lights 的 flex 子项参与一行排列） */
    .bs-lights {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      margin: -6px 0 8px;
    }
    /* 坏/好/出局三组之间隔开 1 颗灯的距离（灯 14px，gap 6px → 额外 10px = 共 16px） */
    .bs-lights .bs-light:nth-child(3) { margin-right: 10px; }
    .bs-lights .bs-light:nth-child(5) { margin-right: 10px; }
    .bs-light {
      width: 14px; height: 14px; border-radius: 50%;
      background: #2ecc71;
      box-shadow: 0 0 8px rgba(46,204,113,0.7);
    }
    .bs-light.strike { background: #f1c40f; box-shadow: 0 0 8px rgba(241,196,15,0.7); }
    .bs-light.off { background: rgba(255,255,255,0.12); box-shadow: none; }
    /* 换打者提示：从左向右依次熄灭亮起的坏球灯、好球灯 */
    .bs-light.bs-flash-out {
      animation: bsFlashOut .4s ease-in forwards;
    }
    @keyframes bsFlashOut {
      0%   { filter: brightness(1.6); transform: scale(1.1); }
      100% { background: rgba(255,255,255,0.12); box-shadow: none; filter: brightness(1); transform: scale(1); }
    }
    .outs {
      display: flex; align-items: center; justify-content: center; gap: 6px;
    }
    .bs-lights .outs {
      display: contents; /* 仅当嵌在 .bs-lights 内时合并为单行 flex 子项 */
    }
    .out-dot {
      width: 14px; height: 14px; border-radius: 50%;
      background: #e5484d;
    }
    .out-dot.off { background: rgba(255,255,255,0.12); box-shadow: none; animation: none; }
    /* 亮起效果：点亮瞬间「通电」弹起 + 持续呼吸发光（每次从熄灭转亮都会播放） */
    .out-dot:not(.off) {
      animation: outLightUp 0.6s ease-out, outGlow 2.2s ease-in-out 0.6s infinite;
    }
    @keyframes outLightUp {
      0%   { background: #ff9a9a; box-shadow: 0 0 0 rgba(229,72,77,0); transform: scale(0.4); }
      60%  { background: #ff5a5f; box-shadow: 0 0 16px rgba(229,72,77,0.95); transform: scale(1.3); }
      100% { background: #e5484d; box-shadow: 0 0 8px rgba(229,72,77,0.55); transform: scale(1); }
    }
    @keyframes outGlow {
      0%, 100% { box-shadow: 0 0 6px rgba(229,72,77,0.4); }
      50%      { box-shadow: 0 0 13px rgba(229,72,77,0.85); }
    }

    /* ---------- 道具系统（与 index.html 逻辑分离，见 items.js） ---------- */
    /* 背包入口图标：贴骰子区域右侧，按钮中心对齐主骰子下边缘 */
    .item-dock {
      position: absolute;
      right: 4px;
      top:15%;
      transform: translateY(-50%);
      flex-shrink: 0;
    }
    .item-bag-btn {
      position: relative;
      width: 44px; height: 44px;
      padding: 0;
      background: #ffffff;
      border: none;
      color: #2d5a3d;
      font-size: 20px;
      font-weight: 800;
      cursor: pointer;
      line-height: 44px;
      text-align: center;
      border-radius: 8px;
    }
    .item-bag-btn:hover { transform: scale(1.08); }
    .item-bag-btn.empty { background: #ffffff; color: #9bb0a3; }
    .item-bag-badge {
      position: absolute; top: -8px; right: -8px;
      min-width: 20px; height: 20px; padding: 0 5px;
      border-radius: 10px; background: #e5484d; color: #fff;
      font-size: 12px; font-weight: 800; line-height: 20px; text-align: center;
      box-shadow: 0 2px 6px rgba(0,0,0,0.3);
    }
    .item-game-count { font-size: 12px; color: #f0d860; font-weight: 700; margin-bottom: 21px; }

    /* 浮层遮罩 */
    .item-overlay {
      position: fixed; inset: 0; z-index: 50;
      background: rgba(0,0,0,0.55);
      display: flex; align-items: center; justify-content: center;
      opacity: 0; transition: opacity 0.2s ease;
      padding: 20px;
    }
    .item-overlay.show { opacity: 1; }
    .item-panel {
      position: relative;
      width: 100%; max-width: 380px;
      background: linear-gradient(180deg, rgba(43,86,59,0.98), rgba(29,58,41,0.98));
      border: 1px solid rgba(240, 216, 96, 0.35);
      border-radius: 18px; padding: 18px;
      box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 18px 52px rgba(0,0,0,0.5);
      transform: scale(0.94); transition: transform 0.2s ease;
    }
    .item-overlay.show .item-panel { transform: scale(1); }
    .item-panel-head {
      display: flex; align-items: center; justify-content: space-between;
      font-size: 18px; font-weight: 800; color: #fff; margin-bottom: 4px;
    }
    .item-close {
      position: absolute; top: 10px; right: 14px;
      width: auto; padding: 0; /* 覆盖通用 button 的 width:100%/padding:14px，避免占满浮层居中 */
      font-size: 22px; color: #a8c4ae; cursor: pointer; line-height: 1;
      border: none; background: transparent;
      box-shadow: none;
    }
    .item-close:hover { color: #fff; }
    .item-panel-sub { font-size: 12px; color: #8ab894; margin-bottom: 14px; }
    .item-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
    .item-cell {
      background: rgba(255,255,255,0.06);
      border: 2px solid rgba(255,255,255,0.10);
      border-radius: 12px; padding: 12px 10px; cursor: pointer;
      text-align: center;
      transition: border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
    }
    .item-cell:hover { transform: translateY(-2px); border-color: rgba(240,216,96,0.6); }
    /* 手机端触屏点击反馈：按下时缩小 + 明显提亮（无 hover，靠 :active 提供按压反馈） */
    .item-cell:not(.locked):active {
      transform: scale(0.93);
      border-color: rgba(240,216,96,0.9);
      background: rgba(255,255,255,0.18);
    }
    .item-cell.selected { border-color: #f0d860; background: rgba(240,216,96,0.16); }
    .item-cell-bat.selected { border-color: #f0d860; background: rgba(240,216,96,0.16); }
    .item-cell-steal.selected { border-color: #5ec2ff; background: rgba(94,194,255,0.16); }
    .item-cell-sac.selected { border-color: #ff9d6e; background: rgba(255,157,110,0.16); }
    .item-cell-mist.selected { border-color: #c9b6ff; background: rgba(201,182,255,0.16); }
    .item-cell-lun.selected { border-color: #555c68; background: rgba(60,66,78,0.35); }
    .item-cell-ling.selected { border-color: #ff6b6b; background: rgba(255,107,107,0.16); }
    .item-cell.locked { opacity: 0.42; cursor: not-allowed; filter: grayscale(0.6); }
    .item-cell.locked:hover { transform: none; border-color: rgba(255,255,255,0.10); }
    .item-cell.used-once { position: relative; }
    .item-cell.used-once::after {
      content: "已用"; position: absolute; top: 6px; right: 6px;
      font-size: 10px; font-weight: 700; color: #fff;
      background: rgba(0,0,0,0.5); border-radius: 6px; padding: 1px 6px;
    }
    .item-cell.used-once-cost2::after {
      content: "已用(占2)"; position: absolute; top: 6px; right: 6px;
      font-size: 10px; font-weight: 700; color: #fff;
      background: rgba(0,0,0,0.5); border-radius: 6px; padding: 1px 6px;
    }
    .item-cell-name {
      font-size: 22px; font-weight: 800; text-align: center; margin-bottom: 2px;
    }
    .item-cell-bat .item-cell-name { color: #f0d860; }
    .item-cell-steal .item-cell-name { color: #5ec2ff; }
    .item-cell-sac .item-cell-name { color: #ff9d6e; }
    .item-cell-mist .item-cell-name { color: #c9b6ff; }
    .item-cell-lun .item-cell-name { color: #d7dbe2; }
    .item-cell-ling .item-cell-name {
      color: #ff6b6b;
    }
    .item-cell-count { font-size: 11px; color: #8ab894; text-align: center; margin-bottom: 6px; }

    .item-cell-desc { font-size: 11px; color: #c8ddd0; line-height: 1.45; text-align: center; }
    .item-panel-foot { margin-top: 14px; font-size: 13px; color: #e8f0e8; text-align: center; }
    .item-foot-info { font-size: 12px; color: #c8ddd0; }
    .item-cancel {
      width: auto; padding: 4px 10px; margin-left: 8px; font-size: 12px; font-weight: 700;
      background: rgba(229,72,77,0.85); color: #fff; border: none; border-radius: 8px; cursor: pointer;
    }
    .item-toast {
      position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%) translateY(12px);
      background: rgba(20,40,28,0.95); color: #f0d860; border: 1px solid rgba(240,216,96,0.4);
      padding: 10px 18px; border-radius: 12px; font-size: 13px; font-weight: 700;
      z-index: 60; opacity: 0; pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease;
      max-width: 90vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; /* 单行不换行，宽度自适应文本，极端超长省略 */
    }
    .item-toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }

    /* 发奖浮层 */
    .reward-overlay {
      position: fixed; inset: 0; z-index: 70;
      display: flex; align-items: center; justify-content: center;
      background: rgba(0,0,0,0.55); opacity: 0; pointer-events: none;
      transition: opacity 0.22s ease;
    }
    .reward-overlay.show { opacity: 1; pointer-events: auto; }
    .reward-card {
      width: min(86vw, 360px);
      background: linear-gradient(160deg, #1f3d2b, #16301f);
      border: 1px solid rgba(240,216,96,0.35);
      border-radius: 18px; padding: 26px 22px 22px;
      text-align: center; color: #eaf3ea;
      box-shadow: 0 18px 48px rgba(0,0,0,0.45);
      transform: translateY(10px) scale(0.96);
      transition: transform 0.22s ease;
    }
    .reward-overlay.show .reward-card { transform: translateY(0) scale(1); }
    .reward-title {
      font-size: 20px; font-weight: 800; color: #f0d860;
      margin-bottom: 16px; text-shadow: 0 2px 8px rgba(0,0,0,0.4);
    }
    .reward-items {
      display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 16px;
    }
    /* 再见本垒打 6 种全发：3×2 两排，每排 3 个 */
    .reward-items.cols-3 {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
    }
    .reward-items.cols-3 .reward-chip { justify-self: center; }
    /* 普通通关 5 种：保持 1 排（chip 自适应列宽） */
    .reward-items.cols-5 {
      display: grid; grid-template-columns: repeat(5, 1fr); gap: 8px;
    }
    .reward-items.cols-5 .reward-chip {
      width: auto; min-width: 0; padding: 10px 4px; justify-self: center;
    }
    .reward-chip {
      display: flex; flex-direction: column; align-items: center; gap: 4px;
      width: 64px; padding: 10px 0; border-radius: 12px;
      background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.12);
    }
    .reward-chip-icon {
      font-size: 24px; font-weight: 800; line-height: 1; width: 40px; height: 40px;
      display: flex; align-items: center; justify-content: center; border-radius: 9px;
    }
    .reward-chip-num { font-size: 13px; font-weight: 700; color: #eaf3ea; }
    .reward-chip-bat .reward-chip-icon { background: linear-gradient(135deg,#f0d860,#e0b840); color:#2d5a3d; }
    .reward-chip-steal .reward-chip-icon { background: linear-gradient(135deg,#5ec2ff,#3a9ee0); color:#10314a; }
    .reward-chip-sac .reward-chip-icon { background: linear-gradient(135deg,#ff9d6e,#e07a4e); color:#3a1c12; }
    .reward-chip-mist .reward-chip-icon { background: linear-gradient(135deg,#c9b6ff,#9b86e0); color:#2a1f48; }
    .reward-chip-lun .reward-chip-icon { background: linear-gradient(135deg,#4a4f5a,#23262d); color:#e8ebef; }
    .reward-chip-ling .reward-chip-icon { background: linear-gradient(135deg,#ff6b6b,#e04545); color:#fff; }
    .reward-msg { font-size: 13px; color: #c8ddd0; line-height: 1.6; margin-bottom: 18px; }
    .reward-close {
      width: 100%; padding: 12px 0; font-size: 15px; font-weight: 800; cursor: pointer;
      background: linear-gradient(135deg, #f0d860, #e8c84e); color: #2d5a3d;
      border: none; border-radius: 12px;
    }
    .reward-close:active { transform: scale(0.98); }