/* ===== 萌足开球杯 — 1:1 与设计稿 football-cute-kick-cup-v4.png =====
   设计稿画布 941 x 1672。整个舞台按比例缩放，所有覆盖元素用百分比定位，
   字号用容器查询单位 cqw(1cqw = 舞台宽度的 1%) 让文字随舞台等比缩放。   */

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; height: 100%; }
body {
  min-height: 100dvh;
  display: grid;
  place-items: center;
  background: #000;             /* 最外层留白底色：黑 */
  font-family: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", system-ui, sans-serif;
  color: #fff;
  overflow: hidden;
  user-select: none;
}

/* 舞台：保持 941:1672 比例，contain 进视口，居中 */
.stage {
  position: relative;
  width: min(100vw, calc(100dvh * 941 / 1672));
  height: min(100dvh, calc(100vw * 1672 / 941));
  aspect-ratio: 941 / 1672;
  container-type: inline-size;
  background: #1ea0e6 url("./assets/ui-v3/bg-stadium.jpg") center / 100% 100% no-repeat;
  overflow: hidden;
  box-shadow: 0 12px 48px rgba(0, 0, 0, .35);
}

/* 通用绝对定位（百分比来自内联变量 --x/--y/--w/--h） */
.hot, .card, .kick, .ball-num, .cell-ring, .digit-cell, .mode-toggle, .rules-btn {
  position: absolute;
  left: calc(var(--x) * 1%);
  top: calc(var(--y) * 1%);
  width: calc(var(--w) * 1%);
  height: calc(var(--h) * 1%);
}
.hot { border: 0; background: transparent; padding: 0; cursor: pointer; z-index: 6; }
button { font: inherit; border: 0; cursor: pointer; }

.logo-art {
  position: absolute;
  left: 10%;
  top: 4.8%;
  width: 80%;
  height: 18.0%;
  z-index: 4;
  background: url("./assets/ui-v3/logo.png") center / contain no-repeat;
  pointer-events: none;
}
.asset-fair { background: url("./assets/ui-v3/badge-fair.png") center / contain no-repeat; }
.asset-sound { background: url("./assets/ui-v3/btn-sound.png") center / contain no-repeat; }
.asset-sound[aria-pressed="false"] { background-image: url("./assets/ui-v3/btn-sound-muted.png"); }
.asset-records { background: url("./assets/ui-v3/btn-records.png") center / contain no-repeat; }
.asset-stats { background: url("./assets/ui-v3/btn-stats.png") center / contain no-repeat; }
.asset-income { background: url("./assets/ui-v3/btn-daily-income.png") center / contain no-repeat; }

/* 公平验证下方「玩法」按钮（CSS 金色小药丸） */
.rules-btn {
  z-index: 7;
  border-radius: 99cqw;
  background: linear-gradient(180deg, #fff1b2 0%, #ffd24a 50%, #f4a01f 100%);
  box-shadow:
    inset 0 .28cqw 0 rgba(255, 255, 255, .7),
    inset 0 -.4cqw .5cqw rgba(175, 90, 0, .35),
    0 0 0 .32cqw #b9740f,
    0 .5cqw .9cqw rgba(0, 30, 10, .4);
  color: #6b3300; font-weight: 900; font-size: 2.7cqw; letter-spacing: .4cqw;
  display: grid; place-items: center;
  text-shadow: 0 .2cqw 0 rgba(255, 255, 255, .55);
}
.rules-btn:active { transform: scale(.95); }

/* ===== 顶部积分胶囊（CSS 边框 + 星星/加号素材，无「星」字） ===== */
.score-pill {
  position: absolute;
  left: 68.5%; top: 2.1%; width: 27%; height: 4.0%;
  z-index: 7;
  display: flex; align-items: center; gap: .5cqw;
  padding: 0 .3cqw 0 1.2cqw;
  border-radius: 99cqw;
  background: linear-gradient(180deg, #34a1ed 0%, #1f76cb 100%);
  box-shadow:
    inset 0 .3cqw .2cqw rgba(255, 255, 255, .5),
    inset 0 -.3cqw .4cqw rgba(0, 0, 0, .28),
    0 0 0 .32cqw #0f4f93,
    0 .45cqw .9cqw rgba(0, 20, 50, .35);
}
.score-star {
  flex: 0 0 auto;
  height: 84%; aspect-ratio: 1;
  background: url("./assets/ui-v3/star-on.png") center / contain no-repeat;
  filter: drop-shadow(0 .12cqw .12cqw rgba(0, 30, 60, .4));
}
.score-pill b {
  flex: 1; min-width: 0; text-align: center;
  color: #fff; font-weight: 900; font-size: 3.0cqw; letter-spacing: -.05cqw; line-height: 1;
  text-shadow: 0 .22cqw 0 rgba(8, 50, 95, .85), 0 .1cqw .3cqw rgba(0, 0, 0, .25);
  font-family: "DIN Alternate", ui-monospace, sans-serif;
}
.score-plus {
  flex: 0 0 auto;
  height: 112%; aspect-ratio: 1;
  margin: 0 -.45cqw 0 .15cqw;
  padding: 0; border: 0; background: url("./assets/ui-v3/icon-plus.png") center / contain no-repeat;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  filter: drop-shadow(0 .2cqw .25cqw rgba(0, 30, 60, .4));
}
.score-plus:active { transform: scale(.9); }
/* 静音状态由 btn-sound-muted.png（已带红色斜杠 + 「静」）表达，无需额外覆盖标记 */

/* ===== LED 记分屏（新素材无烤字，文字全部由 CSS 对位四个槽位） ===== */
.led {
  position: absolute;
  left: 15.5%; top: 21.7%; width: 69.1%; height: 14.1%;
  z-index: 4;
  background: url("./assets/ui-v3/scoreboard.png") center / 100% 100% no-repeat;
}
/* 顶部长槽：第 [回合号] 回合 */
.led-round {
  position: absolute;
  left: 4%; top: 7%; width: 92%; height: 19.3%;
  display: flex; align-items: center; justify-content: center; gap: 1.4cqw;
}
.led-round span { color: #8fc3f5; font-weight: 800; font-size: 2.5cqw; }
.led-round b {
  color: #f3f8ff; font-weight: 800; font-size: 2.9cqw; letter-spacing: .15cqw; line-height: 1;
  font-family: "DIN Alternate", ui-monospace, "SF Mono", monospace;
  text-shadow: 0 0 1.3cqw rgba(150, 190, 240, .6);
}
/* 左小槽：结果数字 */
.led-digit {
  position: absolute;
  left: 4%; top: 30.3%; width: 20.9%; height: 60.2%;
  display: grid; place-items: center;
}
.led-digit b {
  color: #fff; font-weight: 800; font-size: 6.4cqw; line-height: 1;
  font-family: "DIN Alternate", ui-monospace, monospace;
  text-shadow: 0 0 1.8cqw rgba(180, 210, 255, .65);
}
/* 中大槽：相位状态 */
.led-phase {
  position: absolute;
  left: 24.9%; top: 30.3%; width: 51.4%; height: 60.2%;
  display: grid; place-items: center;
}
.led-phase span {
  color: #ffd23c; font-weight: 900; font-size: 5.4cqw; line-height: 1; white-space: nowrap;
  text-shadow: 0 0 2cqw rgba(255, 190, 50, .55), 0 .3cqw 0 rgba(120, 70, 0, .45);
}
/* 右槽：倒计时 + 时钟 */
.led-clock {
  position: absolute;
  left: 76.3%; top: 30.3%; width: 19.7%; height: 60.2%;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4cqw;
}
.led-clock span { color: #8fc3f5; font-weight: 800; font-size: 2.4cqw; line-height: 1; }
.led-clock b {
  color: #fff; font-weight: 800; font-size: 3.8cqw; line-height: 1;
  font-family: "DIN Alternate", ui-monospace, monospace;
  text-shadow: 0 0 1.5cqw rgba(180, 210, 255, .6);
}

/* ===== 倒计时足球上的数字（仅数字动态，倒计时/秒 已烤进底图） ===== */
.ball-num {
  --x: 39.9; --y: 50.9; --w: 20.2; --h: 11.36;
  z-index: 4; display: grid; place-items: center; pointer-events: none;
  background: url("./assets/ui-v3/timer-ball.png") center / contain no-repeat;
}
.ball-num.kicking { animation: ballPulse .7s ease-in-out infinite alternate; }
@keyframes ballPulse { from { transform: scale(1); } to { transform: scale(1.06); } }
/* 中间倒计时数字：红底白描边、随秒跳动；最后 3 秒转急促色 */
.ball-num b {
  position: relative;
  color: #ff3b1d; font-weight: 900; font-size: 8.4cqw; line-height: 1;
  font-family: "DIN Alternate", ui-monospace, monospace;
  -webkit-text-stroke: .45cqw #fff;
  paint-order: stroke fill;
  text-shadow: 0 .38cqw 0 rgba(140, 25, 0, .5), 0 0 1.5cqw rgba(255, 120, 40, .55);
  transform-origin: 50% 50%;
  will-change: transform;
}
.ball-num b.tick { animation: ballTick .44s cubic-bezier(.2, 1.5, .45, 1); }
@keyframes ballTick {
  0% { transform: scale(1.5); opacity: .3; }
  50% { transform: scale(.88); }
  100% { transform: scale(1); opacity: 1; }
}
.ball-num b.urgent {
  color: #ff1717;
  text-shadow: 0 .38cqw 0 rgba(150, 0, 0, .55), 0 0 2.2cqw rgba(255, 55, 25, .9);
}

/* ===== 战术卡 ===== */
.card {
  z-index: 5; padding: 0; overflow: visible;
  background: transparent; border: 0; box-shadow: none;
  transition: transform .14s ease;
}
.card img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  /* 非选中：压暗去饱和 + 轻微落地阴影（满幅无边框素材，阴影沿圆角轮廓） */
  filter:
    grayscale(.6) brightness(.8) contrast(.96) saturate(.85)
    drop-shadow(0 .5cqw .5cqw rgba(0, 0, 0, .38));
  transition: filter .18s ease, transform .14s ease;
}
.card.selected {
  transform: translateY(-.85cqw) scale(1.04);
}
/* 选中：卡片已自带边框，不再加金线高亮——仅满色 + 上浮 + 轻落地阴影 */
.card.selected img {
  filter: drop-shadow(0 .6cqw .7cqw rgba(0, 0, 0, .42));
}
.card:active { transform: scale(.96); }

/* ===== 玩法切换：大小单双(卡片) ⇄ 数字 0-9 ===== */
/* 右上角切换钮：赔率文字 + 切换图标 */
.mode-toggle {
  z-index: 7; border: 0; padding: 0 1.1cqw; overflow: hidden;
  border-radius: 99cqw;
  display: flex; align-items: center; justify-content: center; gap: .6cqw;
  background: linear-gradient(180deg, #fff1b2 0%, #ffd24a 48%, #f3a017 100%);
  box-shadow:
    inset 0 .35cqw .12cqw rgba(255, 255, 255, .85),
    inset 0 -.4cqw .5cqw rgba(165, 78, 0, .4),
    0 0 0 .26cqw #ffe687,
    0 0 0 .5cqw #a85f10,
    0 .55cqw .9cqw rgba(0, 30, 10, .4);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.mode-toggle::before {
  content: ""; position: absolute; left: 8%; right: 8%; top: 10%; height: 40%;
  border-radius: 99cqw;
  background: linear-gradient(180deg, rgba(255, 255, 255, .7), rgba(255, 255, 255, 0));
  pointer-events: none;
}
.mode-toggle b {
  color: #6b3300; font-weight: 900; font-size: 2.8cqw; line-height: 1;
  font-family: "DIN Alternate", ui-monospace, sans-serif;
  text-shadow: 0 .18cqw 0 rgba(255, 255, 255, .5);
}
.mode-toggle svg {
  width: 3.4cqw; height: 3.4cqw; flex: 0 0 auto; fill: #6b3300;
  filter: drop-shadow(0 .12cqw 0 rgba(255, 255, 255, .4));
}
.mode-toggle:active { transform: scale(.94); }

/* 数字格 0-9：统一蓝紫糖果高光按钮（选中转金色高亮） */
.digit-cell {
  z-index: 5; border: 0; padding: 0; overflow: hidden;
  border-radius: 3cqw;
  display: grid; place-items: center;
  color: #fff; font-weight: 900; font-size: 5cqw; line-height: 1;
  font-family: "DIN Alternate", ui-monospace, monospace;
  background: linear-gradient(180deg, #9d8ff8 0%, #6a51d6 54%, #4b34b4 100%);
  box-shadow:
    inset 0 .45cqw .2cqw rgba(255, 255, 255, .55),
    inset 0 -.6cqw .7cqw rgba(30, 10, 70, .5),
    0 0 0 .3cqw #fff,
    0 0 0 .58cqw #3a2386,
    0 .6cqw 1cqw rgba(20, 10, 60, .38);
  text-shadow: .14cqw .14cqw 0 rgba(45, 15, 95, .55), -.14cqw .14cqw 0 rgba(45, 15, 95, .55), 0 .32cqw 0 rgba(20, 5, 60, .35);
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: transform .12s ease, box-shadow .12s ease;
}
.digit-cell::before {
  content: ""; position: absolute; left: 12%; right: 12%; top: 8%; height: 40%;
  border-radius: 99cqw;
  background: linear-gradient(180deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0));
  pointer-events: none;
}
.digit-cell.selected {
  background: linear-gradient(180deg, #fff0b0 0%, #ffc94e 52%, #ef9c1c 100%);
  color: #7a3c00;
  text-shadow: 0 .22cqw 0 rgba(255, 255, 255, .6);
  box-shadow:
    inset 0 .45cqw .2cqw rgba(255, 255, 255, .8),
    inset 0 -.55cqw .55cqw rgba(170, 85, 0, .3),
    0 0 0 .3cqw #fff,
    0 0 0 .74cqw #d98a14,
    0 0 1.8cqw rgba(255, 205, 70, .95),
    0 .6cqw 1cqw rgba(0, 25, 10, .32);
  transform: translateY(-.4cqw) scale(1.07);
}
.digit-cell.selected::before { background: linear-gradient(180deg, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0)); }
.digit-cell:active { transform: scale(.94); }

/* 模式切换显隐：只显示当前玩法那一组 */
.stage[data-mode="digit"] .card { display: none; }
.stage[data-mode="card"] .digit-cell { display: none; }

/* ===== 星力票（投注）框：自定义金额 + 多选复式 ===== */
.bet-box {
  position: absolute;
  left: 2.7%; top: 77%; width: 94.6%; height: 11%;
  z-index: 5;
  border-radius: 3.6cqw;
  padding: 1cqw 2cqw;
  display: flex; flex-direction: column; justify-content: center; gap: 1cqw;
  background: linear-gradient(180deg, #1f7d41 0%, #135a31 52%, #0a3a1f 100%);
  box-shadow:
    inset 0 .35cqw .3cqw rgba(255, 255, 255, .28),
    inset 0 -.7cqw 1.2cqw rgba(0, 0, 0, .45),
    0 0 0 .55cqw #9a6416, 0 0 0 .8cqw rgba(255,255,255,.25),
    0 1.2cqw 2.4cqw rgba(0, 28, 10, .42);
}
.bet-row1, .bet-row2 { display: flex; align-items: center; gap: 1cqw; }
.bet-title { color: #ffe24f; font-size: 3cqw; font-weight: 900; white-space: nowrap;
  text-shadow: 0 .25cqw 0 #0c3d20; }
.bet-amount {
  flex: 0 0 17cqw; min-width: 0;
  background: #08311b; color: #ffe24f; border: .2cqw solid rgba(255,220,120,.35);
  border-radius: 1.6cqw; padding: .7cqw .6cqw; text-align: center;
  font-size: 3.4cqw; font-weight: 900; font-family: "DIN Alternate", ui-monospace, sans-serif;
  -webkit-tap-highlight-color: transparent;
}
.bet-amount:focus { outline: 0; border-color: #ffd23c; box-shadow: 0 0 0 .25cqw rgba(255,210,90,.4); }
.bet-amount::-webkit-outer-spin-button, .bet-amount::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.bet-amount { -moz-appearance: textfield; appearance: textfield; }
.bet-unit { color: #c3eccc; font-size: 2.7cqw; font-weight: 800; }
.bet-quick { display: flex; gap: .65cqw; flex: 1; min-width: 0; justify-content: flex-end; }
.bet-quick button {
  border: 0; cursor: pointer; -webkit-tap-highlight-color: transparent; white-space: nowrap;
  background: linear-gradient(180deg, #ffe07a, #f3a31e); color: #6b3300;
  font-size: 2.5cqw; font-weight: 900; padding: .6cqw .9cqw; border-radius: 1.4cqw;
  box-shadow: inset 0 .2cqw 0 rgba(255,255,255,.5), 0 .3cqw .5cqw rgba(0,0,0,.25);
}
.bet-quick button.bet-clear {
  background: linear-gradient(180deg, #547164, #324a3f); color: #eafff2;
  box-shadow: inset 0 .2cqw 0 rgba(255,255,255,.25), 0 0 0 .16cqw rgba(255,255,255,.3);
}
.bet-quick button:active { transform: scale(.94); }
.bet-sum { flex: 1; min-width: 0; color: #dff3e6; font-size: 2.7cqw; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bet-sum b { color: #ffe24f; }
.bet-tickets {
  flex: 0 0 auto; border: 0; cursor: pointer; -webkit-tap-highlight-color: transparent;
  background: #08311b; color: #c3eccc; font-size: 2.6cqw; font-weight: 800; white-space: nowrap;
  padding: .7cqw 1.5cqw; border-radius: 1.6cqw; box-shadow: 0 0 0 .18cqw rgba(255,220,120,.3);
}
.bet-tickets b { color: #ffe24f; font-size: 3.4cqw; font-family: "DIN Alternate", ui-monospace, sans-serif; margin: 0 .3cqw; }
.bet-tickets:active { transform: scale(.97); }
/* 能量格（无边框满幅素材，contain 铺满；高亮用贴合圆角轮廓的金边） */
.energy-cell {
  z-index: 5;
  background: center / contain no-repeat;
  transition: transform .14s cubic-bezier(.3, 1.3, .5, 1), filter .14s ease;
}
.cell-1 { background-image: url("./assets/ui-v3/cell-1.png"); }
.cell-5 { background-image: url("./assets/ui-v3/cell-5.png"); }
.cell-20 { background-image: url("./assets/ui-v3/cell-20.png"); }
.cell-50 { background-image: url("./assets/ui-v3/cell-50.png"); }
.cell-100 { background-image: url("./assets/ui-v3/cell-100.png"); }
.cell-clear { background-image: url("./assets/ui-v3/cell-clear.png"); }
/* 点击加注的轻微弹跳反馈（无持久选中态：投注为累加） */
@keyframes cellBump { 0% { transform: scale(1); } 42% { transform: scale(1.13); } 100% { transform: scale(1); } }
.energy-cell.bump { animation: cellBump .22s ease; }
.energy-cell:active { transform: scale(.93); }

/* ===== 确认开球按钮（CSS 占位实现，已弃用 btn-kick.png） ===== */
.kick {
  z-index: 6; overflow: hidden; border: 0;
  border-radius: 99cqw;
  background: linear-gradient(180deg, #fff1b2 0%, #ffd64e 40%, #ffb934 62%, #ef8f18 100%);
  box-shadow:
    inset 0 .5cqw .15cqw rgba(255, 255, 255, .9),
    inset 0 -.8cqw 1cqw rgba(165, 78, 0, .45),
    0 0 0 .42cqw #ffe687,
    0 0 0 .82cqw #a85f10,
    0 1.1cqw 1.9cqw rgba(0, 30, 10, .45);
  display: grid; place-items: center;
}
.kick::before {
  content: ""; position: absolute; left: 5%; right: 5%; top: 8%; height: 42%;
  border-radius: 99cqw;
  background: linear-gradient(180deg, rgba(255, 255, 255, .75), rgba(255, 255, 255, 0));
  pointer-events: none;
}
.kick span {
  position: relative; z-index: 1; white-space: nowrap;
  font-size: 5.4cqw; font-weight: 900; color: #7a3c00; letter-spacing: .35cqw;
  text-shadow: 0 .3cqw 0 rgba(255, 255, 255, .65), 0 -.12cqw 0 rgba(150, 70, 0, .35);
}
/* 金额变长时分档缩小，避免换行 */
.kick span[data-len="sm"] { font-size: 4.5cqw; letter-spacing: .2cqw; }
.kick span[data-len="xs"] { font-size: 3.9cqw; letter-spacing: .08cqw; }
.kick span[data-len="xxs"] { font-size: 3.3cqw; letter-spacing: 0; }
.kick:disabled {
  background: linear-gradient(180deg, #e2e8ec 0%, #aeb8be 52%, #8a969c 100%);
  box-shadow:
    inset 0 .5cqw .15cqw rgba(255, 255, 255, .75),
    inset 0 -.7cqw .9cqw rgba(60, 70, 80, .35),
    0 0 0 .42cqw #cdd5da,
    0 0 0 .82cqw #717d83,
    0 .9cqw 1.5cqw rgba(0, 0, 0, .3);
  cursor: default;
}
.kick:disabled span { color: #56626a; text-shadow: 0 .24cqw 0 rgba(255, 255, 255, .55); }
.kick:not(:disabled):active { transform: translateY(.25cqw) scale(.99); }

/* ===== 开奖结果弹窗（素材底图 + 槽位叠字） ===== */
.result-modal {
  position: absolute; inset: 0; z-index: 30;
  display: grid; place-items: center;
  background: rgba(0, 0, 0, .55);
  -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.result-modal[hidden] { display: none; }
.result-card {
  position: relative; width: 82%;
  background: center / 100% 100% no-repeat;
  animation: rmPop .32s cubic-bezier(.2, 1.45, .5, 1);
}
.result-modal.win .result-card {
  aspect-ratio: 1051 / 1320;
  background-image: url("./assets/ui-v3/result-hit.png");
}
.result-modal.lose .result-card {
  aspect-ratio: 1070 / 1345;
  background-image: url("./assets/ui-v3/result-miss.png");
}
.result-modal.draw .result-card {
  aspect-ratio: 1025 / 1134;
  background-image: url("./assets/ui-v3/draw-result-panel.png");
}
/* 本期开奖啦面板布局与命中/未中不同，单独对位（无投注 → 无盈亏行） */
.result-modal.draw .rm-period, .result-modal.draw .rm-number { left: 38%; width: 52%; }
.result-modal.draw .rm-period { top: 46.2%; }
.result-modal.draw .rm-number { top: 62.1%; }
.result-modal.draw .rm-delta { display: none; }
.result-modal.draw .rm-again { left: 30%; top: 80.5%; width: 40%; height: 10%; }
@keyframes rmPop { from { transform: scale(.6); opacity: 0; } to { transform: scale(1); opacity: 1; } }
/* 期号 / 号码 / 盈亏 槽位（位于素材标签右侧的留白条内，三行等距对位新底图） */
.rm-period, .rm-number, .rm-delta {
  position: absolute; left: 41%; width: 47%; height: 7%;
  display: flex; align-items: center;
  color: #6f4524; font-weight: 900; line-height: 1; white-space: nowrap;
  font-family: "DIN Alternate", ui-monospace, sans-serif;
  text-shadow: 0 .14cqw 0 rgba(255, 255, 255, .6);
}
.rm-period { top: 47.9%; font-size: 4.6cqw; letter-spacing: -.1cqw; }
.rm-number { top: 59.2%; font-size: 5cqw; }
.rm-delta  { top: 69.2%; font-size: 5cqw; color: #1f9d4d; }   /* 盈：绿；亏 → .neg 转红 */
.rm-number b { color: #c0481c; }
.rm-delta.neg { color: #e23b1d; }
/* 「再射一次」按钮：覆盖在烤进底图的按钮上的透明热区 */
.rm-again {
  position: absolute; left: 17%; top: 80%; width: 66%; height: 11%;
  background: transparent; border: 0; cursor: pointer;
  -webkit-tap-highlight-color: transparent; border-radius: 99cqw;
}
.rm-again:active { transform: scale(.96); }

/* ===== Toast ===== */
.toast {
  position: absolute; left: 50%; bottom: 11%; z-index: 40;
  transform: translateX(-50%);
  min-width: 46%; max-width: 86%; padding: 2.4cqw 4cqw;
  border-radius: 99px; background: rgba(12, 40, 32, .92);
  border: .4cqw solid rgba(255, 255, 255, .35); color: #fff;
  font-weight: 800; font-size: 3.4cqw; text-align: center;
  box-shadow: 0 1.4cqw 3cqw rgba(0, 0, 0, .35);
}

/* ===== 底部弹层（记录 / 战绩 / 验证） ===== */
.sheet-mask {
  position: fixed; inset: 0; z-index: 60;
  background: rgba(0, 0, 0, .5); backdrop-filter: blur(4px);
}
.sheet {
  position: fixed; left: 50%; bottom: 0; z-index: 70;
  width: min(100vw, 480px); max-height: min(82dvh, 760px);
  transform: translate(-50%, 105%);
  border-radius: 22px 22px 0 0;
  background: linear-gradient(#f9fbff, #dcf1ff);
  color: #16406b; border: 4px solid #fff;
  box-shadow: 0 -16px 42px rgba(0, 0, 0, .3);
  transition: transform .26s ease; overflow: hidden;
}
.sheet.open { transform: translate(-50%, 0); }
.sheet-head {
  height: 56px; display: flex; align-items: center; justify-content: space-between;
  padding: 0 14px 0 18px; background: linear-gradient(#3daeff, #2280d8);
  color: #fff; font-size: 19px; font-weight: 900;
}
.sheet-head button {
  width: 34px; height: 34px; border-radius: 50%;
  background: rgba(0, 0, 0, .22); color: #fff; font-size: 22px;
}
.sheet-body { max-height: calc(min(82dvh, 760px) - 56px); overflow: auto; padding: 14px; }
.record-row, .stat-card, .verify-card {
  width: 100%; display: grid; gap: 5px; margin: 0 0 10px; padding: 12px;
  border-radius: 14px; background: #fff; color: #16406b;
  box-shadow: 0 4px 12px rgba(14, 88, 140, .14); text-align: left;
}
.record-row { grid-template-columns: 40px 1fr auto; align-items: center; }
.record-row .digit {
  width: 40px; height: 40px; display: grid; place-items: center; border-radius: 50%;
  background: linear-gradient(#ffe96c, #ff9d2e); color: #963400; font-size: 22px; font-weight: 900;
}
.record-row b, .stat-card b, .verify-card b { font-size: 15px; }
/* 健康娱乐 / 禁赌声明卡：红色警示底 */
.rules-warn {
  background: linear-gradient(180deg, #fff4f1, #ffe9e4);
  box-shadow: 0 4px 12px rgba(180, 40, 20, .16), inset 0 0 0 1.5px #ffb9ab;
}
.rules-warn b { color: #d63417; }
.rules-warn p { color: #8a4438; }
.record-row p, .stat-card p, .verify-card p { margin: 0; color: #5d7891; font-size: 13px; line-height: 1.45; }
.record-row em {
  padding: 5px 9px; border-radius: 99px; color: #fff; background: #39bd62; font-style: normal; font-weight: 900;
}
.record-row.lose em { background: #ff6a55; }
.verify-code {
  margin: 8px 0; padding: 9px; border-radius: 10px; background: #eef8ff; color: #16406b;
  font-family: ui-monospace, monospace; font-size: 12px; overflow-wrap: anywhere;
}
.verify-code a { color: #0a7bd2; text-decoration: none; }
.ticket-del {
  border: 0; cursor: pointer; padding: 6px 12px; border-radius: 99px;
  background: #ff6a55; color: #fff; font-size: 13px; font-weight: 800;
}
.ticket-del:active { transform: scale(.95); }
.verify-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.verify-links a {
  font-size: 13px; color: #0a7bd2; text-decoration: none; font-weight: 700;
  border: 1px solid #cfe2f5; padding: 6px 11px; border-radius: 10px; background: #f4faff;
}
.verify-links a:active { background: #e4f1ff; }
.empty { padding: 26px 10px; color: #5d7891; text-align: center; font-weight: 800; }

/* ===== 每日收益页 ===== */
/* 当日总战绩英雄卡：盈绿 / 亏红 / 未参与灰 */
.today-hero {
  margin: 0 0 12px; padding: 15px 16px 13px; border-radius: 18px; color: #fff;
  background: linear-gradient(135deg, #45bd6d, #2c9d4d);
  box-shadow: 0 8px 20px rgba(20, 120, 60, .3), inset 0 0 0 2px rgba(255, 255, 255, .25);
}
.today-hero.neg {
  background: linear-gradient(135deg, #f5694c, #e23b1d);
  box-shadow: 0 8px 20px rgba(180, 40, 20, .3), inset 0 0 0 2px rgba(255, 255, 255, .25);
}
.today-hero.empty {
  background: linear-gradient(135deg, #9fb8d2, #7f9cbb);
  box-shadow: 0 8px 20px rgba(40, 80, 120, .25), inset 0 0 0 2px rgba(255, 255, 255, .22);
}
.th-top { display: flex; justify-content: space-between; align-items: center; }
.th-top span { font-size: 13px; font-weight: 800; opacity: .96; }
.th-top em { font-style: normal; font-size: 12px; font-weight: 800; background: rgba(255, 255, 255, .22); padding: 3px 10px; border-radius: 99px; }
.th-net { display: block; margin: 7px 0 12px; font-size: 38px; font-weight: 900; line-height: 1; letter-spacing: -.5px; text-shadow: 0 2px 0 rgba(0, 0, 0, .12); }
.th-net i { font-size: 16px; font-style: normal; font-weight: 800; margin-left: 5px; opacity: .9; }
.th-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.th-grid > div { background: rgba(255, 255, 255, .17); border-radius: 12px; padding: 8px 4px; text-align: center; }
.th-grid b { display: block; font-size: 18px; font-weight: 900; line-height: 1; }
.th-grid span { display: block; margin-top: 4px; font-size: 11px; font-weight: 700; opacity: .9; }

.income-hero {
  margin: 0 0 10px; padding: 16px 18px; border-radius: 16px; text-align: center;
  background: linear-gradient(135deg, #fff6da, #ffdf9c);
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .7), 0 6px 16px rgba(214, 150, 20, .25);
}
.income-hero span { color: #a9701a; font-size: 13px; font-weight: 800; }
.income-hero b { display: block; margin: 4px 0 2px; color: #e07a00; font-size: 30px; font-weight: 900; line-height: 1; }
.income-hero b i { font-size: 15px; font-style: normal; }
.income-hero p { margin: 0; color: #b07d2a; font-size: 12px; }
.income-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0 0 10px; }
.income-duo > div {
  padding: 12px; border-radius: 14px; text-align: center; background: #fff;
  box-shadow: 0 4px 12px rgba(14, 88, 140, .14);
}
.income-duo span { display: block; color: #5d7891; font-size: 12px; font-weight: 800; }
.income-duo b { display: block; margin: 3px 0 1px; color: #1f76cb; font-size: 22px; font-weight: 900; line-height: 1; }
.income-duo i { color: #8aa0b5; font-size: 11px; font-style: normal; }