/* #################################################################
   MRATM88 · Home Page「CSS」栏(整理版)
   1. 足球卡 HOT MATCHES(v6 仿 100cuci)
   2. BET POPUP 下注弹窗
   3. .box-3-1 背景透明
   4. HOT GAMES / LIVE GAMES 两排卡片尺寸 v8
   整栏换成这一份即可(旧的足球卡样式、后来加的 100cuci 覆盖样式都已合并进第 1 段)
   ################################################################# */

/* =================================================================
   MRATM88 足球卡 · v6 仿 100cuci(紫色版)
   白卡 + 浅紫内框 + 实心紫色赔率键；Show More 在标题列右边
   卡片由站点脚本生成，这里只管样式
   ================================================================= */

/* ====== 平台原本的容器:重置成透明、不挡 layout ====== */
#home .soccer-display.default {
  position: relative !important;
  max-width: 460px !important;
  width: auto !important;
  margin: 8px auto !important;
  padding: 0 !important;
  background: none !important;
  background-color: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  display: block !important;
  min-height: 180px !important;
}
#home .soccer-display.default::before,
#home .soccer-display.default::after {
  display: none !important;
  content: none !important;
}
#home .soccer-display.default .match,
#home .soccer-display.default .show-more {
  display: none !important;
}

/* ====== 标题(跟 HOT GAMES 同风格)====== */
.mr-soccer-wrap {
  font-family: "Poppins", "Segoe UI", sans-serif;
}
.mr-soccer-title {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 4px;
  padding: 0 8px;
  font-size: 13px;
  font-weight: 800;
  color: #5e21a8;
  text-transform: uppercase;
}
.mr-soccer-emoji {
  font-size: 16px;
  line-height: 1;
}
.mr-soccer-titletxt {
  letter-spacing: 0.3px;
}

/* More Info 链接(放到标题右边)*/
.mr-soccer-title #cs-info-link-real {
  margin-left: auto !important;
  position: static !important;
  display: inline-block !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: #5e21a8 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-shadow: none !important;
  padding: 0 !important;
  cursor: pointer !important;
}
.mr-soccer-title #cs-info-link-real:hover {
  color: #8b3fd4 !important;
}

/* ====== 横向滚动容器:卡片 235px，看得到下一张 ====== */
.mr-soccer-scroll {
  display: flex;
  gap: 12px;
  max-width: 100%;
  padding: 4px 8px 12px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
  scroll-snap-type: x mandatory;
  scroll-padding-left: 8px;          /* ★ 要跟上面 padding 左边一致 */
  cursor: grab;
}
.mr-soccer-scroll:active { cursor: grabbing; }
.mr-soccer-scroll::-webkit-scrollbar { display: none; }

/* ====== 每张卡 ====== */
.mr-soccer-card {
  position: relative;                /* Show More 定位用 */
  flex: 0 0 235px;
  max-width: 235px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 4px 10px rgba(46, 16, 110, 0.22);
  scroll-snap-align: start;
}

/* ====== 卡:白色标题列(右边留位置给 Show More)====== */
.mr-sc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 86px 8px 10px;
  background: #fff;
  color: #2e2340;
}
.mr-sc-league {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.2px;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}
.mr-sc-time {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 600;
  color: #5e21a8;
  white-space: nowrap;
}
.mr-sc-time-i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: rgba(94, 33, 168, 0.12);
  color: #5e21a8;
  font-size: 9px;
  font-weight: 700;
  font-style: italic;
  font-family: Georgia, "Times New Roman", serif;
}

/* ====== 卡:Body 左右对阵(浅紫内框:主队 | 日期时间 | 客队)====== */
.mr-sc-body {
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  margin: 0 8px;
  padding: 8px 6px;
  border-radius: 6px;
  background: #efe8fb;
}
.mr-sc-side {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.mr-sc-crest {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 auto 4px;
  padding: 5px;
  box-sizing: border-box;
  border: 0;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(46, 16, 110, 0.15);
  object-fit: contain;
}
div.mr-sc-crest {
  background: #eee;
}
.mr-sc-side-name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  max-width: 100%;
  overflow: hidden;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.2;
  color: #282d33;
  word-break: normal;                /* 长队名在空格换行，不从单字中间断开 */
  overflow-wrap: anywhere;
}
.mr-sc-mid {
  flex: 0 0 auto;
  min-width: 56px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.mr-sc-mid-date {
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  color: #2e2340;
}
.mr-sc-mid-time {
  margin-top: 1px;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.2px;
  color: #2e2340;
  white-space: nowrap;
}
.mr-sc-mid-ball {
  margin-top: 4px;
  font-size: 12px;
  line-height: 1;
}

/* ====== 赔率条(1X2 odds,API ftr 有数据才显示):小标题 + 三颗实心紫色键 ====== */
.mr-sc-odds {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: space-between;
  gap: 6px;
  padding: 0 8px 8px;
}
.mr-sc-odds::before {
  content: "FT. 1X2";
  flex: 0 0 100%;
  margin: 7px 0 -1px;
  text-align: center;
  font-size: 10px;
  font-weight: 700;
  color: #2e2340;
}
.mr-sc-odd {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 3px 6px;
  border-radius: 5px;
  background: linear-gradient(180deg, #6e3697, #5b2a9e);
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
}
.mr-sc-odd:hover {
  background: linear-gradient(180deg, #7d42aa, #5b2a9e);
}
.mr-sc-odd:active {
  transform: scale(0.96);
}
.mr-sc-odd-label {
  font-size: 10px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.82);
  text-transform: lowercase;         /* HOME → Home */
}
.mr-sc-odd-label::first-letter {
  text-transform: uppercase;
}
.mr-sc-odd-value {
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.3px;
  color: #fff;
  font-variant-numeric: tabular-nums;
}

/* ====== 卡:Footer(比分 / 开赛倒数 + WATCH NOW / BET)====== */
.mr-sc-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 8px 8px;
}
/* Show More(行内样式)搬到标题列右上角，变成 Show More ›› */
.mr-sc-footer a[href="#soccer"] {
  position: absolute;
  top: 8px;
  right: 10px;
  padding: 0 !important;
  border: 0 !important;
  background: none !important;
  color: #5e21a8 !important;
  font-size: 10px !important;
  font-weight: 800 !important;
  line-height: 13px;
  letter-spacing: 0 !important;
}
.mr-sc-footer a[href="#soccer"]::after {
  content: " ››";
}
.mr-sc-cd {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 5px;
  min-width: 0;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.15;
  color: #5e21a8;
}
.mr-sc-cd-label {
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.8px;
  color: #8a8494;
  text-transform: uppercase;
}
.mr-sc-cd-time {
  font-family: "Poppins", monospace;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.5px;
  color: #5e21a8;
  font-variant-numeric: tabular-nums;
}
.mr-sc-cd-time.live {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #ff3b3b;
  animation: mrsc-breathe 1.4s ease-in-out infinite;
}
.mr-sc-cd-time.live::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #ff3b3b;
  box-shadow: 0 0 6px rgba(255, 60, 60, 0.9);
}
.mr-sc-cd-time.score {
  color: #9b3fe0;
}
@keyframes mrsc-breathe {
  0%, 100% { opacity: 0.92; }
  50% { opacity: 1; }
}

/* BET NOW(金色)/ WATCH NOW(红色):收小、不闪 */
.mr-sc-bet,
.mr-sc-watch {
  flex-shrink: 0;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}
.mr-sc-bet {
  display: inline-block;
  background: linear-gradient(180deg, #FCE07A 0%, #F4B731 50%, #E89A1C 100%);
  border: 1px solid rgba(255, 255, 255, 0.45);
  color: #3a2600;
  letter-spacing: 0.5px;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);
}
.mr-sc-watch {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: linear-gradient(180deg, #ff6b6b 0%, #e53935 50%, #c62828 100%);
  border: 1px solid rgba(255, 255, 255, 0.35);
  color: #fff;
  letter-spacing: 0.6px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
}
.mr-sc-watch::before {
  content: "\25B6";                  /* ▶ play icon */
  display: inline-block;
  font-size: 8px;
}
.mr-sc-bet:hover,
.mr-sc-watch:hover {
  filter: brightness(1.06);
}

/* ====== Skeleton 占位骨架(消除空白 delay)====== */
.mr-soccer-card.mr-sc-skel .mr-sc-league { opacity: 0.5; }
.mr-soccer-card.mr-sc-skel .mr-sc-side-name {
  width: 70%;
  height: 14px;
  border-radius: 4px;
  background: linear-gradient(90deg, #eee 0%, #f5f5f5 50%, #eee 100%);
  background-size: 200% 100%;
  color: transparent !important;
  animation: mrsc-shimmer 1.4s linear infinite;
}
.mr-soccer-card.mr-sc-skel .mr-sc-mid-date,
.mr-soccer-card.mr-sc-skel .mr-sc-mid-time,
.mr-soccer-card.mr-sc-skel .mr-sc-cd-time { color: #ccc; }
@keyframes mrsc-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ===========================================================
   ===== BET POPUP(自建 Correct Score / FTR 下注弹窗)========
   =========================================================== */

/* Lock body 滚动 */
body.mr-bp-open { overflow: hidden; }

.mr-bp-overlay {
  position: fixed;
  inset: 0;
  background: rgba(22, 8, 42, 0.72);
  z-index: 99999;
  display: flex;
  align-items: center;          /* ★ 垂直居中 */
  justify-content: center;
  padding: 16px 10px;
  animation: mrbp-fadein 0.18s ease;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
}
@keyframes mrbp-fadein { from { opacity: 0; } to { opacity: 1; } }

.mr-bp-modal {
  background: #fff;
  width: 100%;
  max-width: 360px;
  max-height: calc(100vh - 32px);     /* ★ 不能超过屏幕 */
  max-height: calc(100dvh - 32px);    /* iOS 用 dvh 更准 */
  display: flex;                       /* ★ 上下分层 */
  flex-direction: column;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 14px 48px rgba(0, 0, 0, 0.5);
  animation: mrbp-slidein 0.22s cubic-bezier(0.2, 0.9, 0.3, 1);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
}
@keyframes mrbp-slidein {
  from { transform: translateY(-12px); opacity: 0; }
  to   { transform: translateY(0);     opacity: 1; }
}

/* ★ 内部滚动区域 — teams + body + slip 都在这里面 */
.mr-bp-scroll {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0;
  -webkit-overflow-scrolling: touch;
}

/* topbar 和 footer-info 固定不滚 */
.mr-bp-topbar,
.mr-bp-footer-info {
  flex-shrink: 0;
}

/* ---- Topbar ---- */
.mr-bp-topbar {
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #f0f0f0;
}
.mr-bp-league {
  background: linear-gradient(135deg, #8b3fd4, #5e21a8);
  color: #fff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.5px;
  padding: 4px 10px;
  border-radius: 999px;
  text-transform: uppercase;
}
.mr-bp-close {
  background: transparent;
  border: 0;
  width: 28px;
  height: 28px;
  font-size: 22px;
  line-height: 1;
  color: #555;
  cursor: pointer;
  border-radius: 50%;
  transition: background 0.15s;
}
.mr-bp-close:hover { background: #f5f5f5; color: #000; }

/* ---- LIVE 比赛警告条(红色保留)---- */
.mr-bp-live-banner {
  background: linear-gradient(135deg, #e53935 0%, #c62828 100%);
  color: #fff;
  padding: 8px 12px;
  font-size: 10.5px;
  font-weight: 800;
  letter-spacing: 0.6px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-transform: uppercase;
  flex-shrink: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.mr-bp-live-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #fff;
  animation: mrbp-livedot 1.2s infinite ease-in-out;
  flex-shrink: 0;
}
@keyframes mrbp-livedot {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7); }
  50%      { opacity: 0.4; box-shadow: 0 0 0 5px rgba(255, 255, 255, 0); }
}

/* ---- Teams row ---- */
.mr-bp-teams {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 8px;
  padding: 8px 12px 8px;
  align-items: center;
}
.mr-bp-team {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
}
.mr-bp-flag {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #e9e2f3;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08);
  background: #f6f2fb;
}
.mr-bp-team-name {
  font-size: 11px;
  font-weight: 700;
  color: #1a1a1a;
  text-align: center;
  line-height: 1.2;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mr-bp-vs {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.mr-bp-date {
  font-size: 9px;
  font-weight: 700;
  color: #5e21a8;
  letter-spacing: 0.3px;
  border-bottom: 1px solid #e2d4f5;
  padding-bottom: 2px;
}
.mr-bp-time {
  font-size: 14px;
  font-weight: 800;
  color: #5e21a8;
  letter-spacing: 0.4px;
}

/* ---- Body sections ---- */
.mr-bp-body { padding: 0 12px 8px; }

.mr-bp-section-title {
  text-align: center;
  font-size: 10px;
  font-weight: 700;
  color: #555;
  letter-spacing: 0.8px;
  margin: 6px 0 5px;
  position: relative;
  text-transform: capitalize;
}
.mr-bp-section-title::before,
.mr-bp-section-title::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 22%;
  height: 1px;
  background: #d4d4d4;
}
.mr-bp-section-title::before { left: 8%; }
.mr-bp-section-title::after  { right: 8%; }

/* ---- CS toggle button ---- */
.mr-bp-cs-toggle {
  width: 100%;
  margin-top: 8px;
  padding: 8px 12px;
  background: #fff;
  border: 1px dashed #d6c2ee;
  border-radius: 6px;
  color: #5e21a8;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.5px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-transform: uppercase;
  transition: background 0.15s, border-color 0.15s;
}
.mr-bp-cs-toggle:hover {
  background: #f8f3fe;
  border-color: #8b3fd4;
}
.mr-bp-cs-toggle.expanded {
  background: #f8f3fe;
  border-style: solid;
}
.mr-bp-cs-toggle-icon {
  font-size: 10px;
}
.mr-bp-cs-content {
  margin-top: 6px;
}
.mr-bp-cs-empty {
  padding: 18px 12px;
  text-align: center;
  color: #888;
  font-size: 11px;
  line-height: 1.5;
  border: 1px dashed #ddd;
  border-radius: 6px;
  background: #fafafa;
}

/* ---- Tables (FTR + CS) ---- */
.mr-bp-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 3px;
  table-layout: fixed;
}
.mr-bp-table th {
  background: #2a1840;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 6px 4px;
  letter-spacing: 0.3px;
  border-radius: 3px;
  text-transform: uppercase;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mr-bp-odd {
  background: #8b3fd4;
  color: #fff;
  text-align: center;
  padding: 7px 4px;
  border-radius: 3px;
  cursor: pointer;
  vertical-align: middle;
  user-select: none;
  transition: transform 0.12s, background 0.15s, box-shadow 0.15s;
  position: relative;
}
.mr-bp-odd > span {
  display: block;
  font-size: 9px;
  font-weight: 600;
  opacity: 0.85;
  margin-bottom: 1px;
}
.mr-bp-odd > b {
  display: block;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.2px;
}
.mr-bp-odd:hover {
  background: #7a32c4;
  box-shadow: 0 2px 6px rgba(139, 63, 212, 0.4);
}
.mr-bp-odd:active { transform: scale(0.96); }
.mr-bp-odd.selected {
  background: #3a1370;
  box-shadow: 0 0 0 2px rgba(255, 193, 7, 0.5);
}
.mr-bp-odd.mr-bp-disabled {
  background: #c8c8c8;
  cursor: not-allowed;
  opacity: 0.6;
  pointer-events: none;
}

/* CS 网格 — 字小一点,行更紧凑 */
.mr-bp-cs .mr-bp-odd {
  padding: 5px 3px;
}
.mr-bp-cs-score {
  font-size: 10px !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}
.mr-bp-cs .mr-bp-odd > b {
  font-size: 11px;
}
.mr-bp-empty {
  background: transparent;
  pointer-events: none;
}

/* ---- Bet slip ---- */
.mr-bp-slip {
  border-top: 1px solid #e0e0e0;
  background: linear-gradient(180deg, #fafafa, #f5f5f5);
  padding: 10px 12px;
  animation: mrbp-slipin 0.2s ease;
}
@keyframes mrbp-slipin {
  from { transform: translateY(6px); opacity: 0; }
  to   { transform: translateY(0);   opacity: 1; }
}
.mr-bp-slip-inner { display: flex; flex-direction: column; gap: 8px; }

.mr-bp-slip-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  background: #fff;
  border-radius: 6px;
  padding: 8px 10px;
  border: 1px solid #e0e0e0;
}
.mr-bp-slip-pick,
.mr-bp-slip-odd {
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.mr-bp-slip-pick-label,
.mr-bp-slip-odd-label {
  font-size: 8px;
  font-weight: 700;
  color: #888;
  letter-spacing: 0.8px;
}
.mr-bp-slip-pick b { font-size: 12px; color: #1a1a1a; }
.mr-bp-slip-odd { text-align: right; }
.mr-bp-slip-odd b {
  font-size: 16px;
  font-weight: 800;
  color: #8b3fd4;
}

.mr-bp-cs-note {
  background: #fff8e1;
  border: 1px solid #ffe082;
  border-radius: 5px;
  padding: 6px 8px;
  font-size: 10px;
  color: #695300;
  line-height: 1.35;
}

.mr-bp-slip-amt-row {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.mr-bp-slip-amt-label {
  font-size: 8px;
  font-weight: 700;
  color: #888;
  letter-spacing: 0.8px;
}
.mr-bp-amt-input {
  width: 100%;
  height: 38px;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  border: 1.5px solid #d6c2ee;
  border-radius: 6px;
  padding: 0 10px;
  background: #fff;
  color: #1a1a1a;
  outline: none;
  -webkit-appearance: none;
  appearance: none;
}
.mr-bp-amt-input:focus {
  border-color: #8b3fd4;
  box-shadow: 0 0 0 2px rgba(139, 63, 212, 0.18);
}
.mr-bp-amt-input::-webkit-outer-spin-button,
.mr-bp-amt-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.mr-bp-amt-chips {
  display: flex;
  gap: 5px;
}
.mr-bp-amt-chips button {
  flex: 1;
  height: 28px;
  font-size: 11px;
  font-weight: 700;
  background: #fff;
  border: 1px solid #d6c2ee;
  color: #5e21a8;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.15s;
}
.mr-bp-amt-chips button:hover {
  background: #5e21a8;
  color: #fff;
  border-color: #5e21a8;
}

.mr-bp-payout-row {
  font-size: 11px;
  color: #555;
  text-align: center;
  padding: 2px 0;
}
.mr-bp-payout-row b { color: #5e21a8; font-size: 13px; }

.mr-bp-slip-actions {
  display: flex;
  gap: 6px;
}
.mr-bp-slip-actions button {
  flex: 1;
  height: 40px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.4px;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s;
  border: 0;
  text-transform: uppercase;
}
.mr-bp-cancel {
  background: #f0f0f0;
  color: #555;
}
.mr-bp-cancel:hover { background: #e0e0e0; }
.mr-bp-confirm {
  background: linear-gradient(180deg, #8b3fd4, #5e21a8);
  color: #fff;
  box-shadow: 0 2px 6px rgba(94, 33, 168, 0.4);
}
.mr-bp-confirm:hover { filter: brightness(1.08); }
.mr-bp-confirm:disabled {
  background: #888;
  cursor: wait;
  opacity: 0.8;
}
.mr-bp-go-soccer {
  background: linear-gradient(180deg, #ff6b6b, #c62828);
  color: #fff;
  box-shadow: 0 2px 6px rgba(229, 57, 53, 0.4);
}
.mr-bp-go-soccer:hover { filter: brightness(1.08); }

.mr-bp-inline-msg {
  font-size: 11px;
  padding: 6px 10px;
  border-radius: 5px;
  text-align: center;
  font-weight: 600;
}
.mr-bp-inline-warn {
  background: #fff0f0;
  color: #c62828;
  border: 1px solid #f5b7b7;
}

/* ---- Success state ---- */
.mr-bp-success,
.mr-bp-fail {
  text-align: center;
  padding: 6px 4px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}
.mr-bp-success-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #8b3fd4, #5e21a8);
  color: #fff;
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  box-shadow: 0 3px 12px rgba(94, 33, 168, 0.45);
  animation: mrbp-pop 0.35s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes mrbp-pop {
  0% { transform: scale(0); }
  60% { transform: scale(1.15); }
  100% { transform: scale(1); }
}
.mr-bp-success-title {
  font-size: 15px;
  font-weight: 800;
  color: #5e21a8;
  letter-spacing: 0.4px;
}
.mr-bp-success-info {
  width: 100%;
  background: #fff;
  border-radius: 6px;
  border: 1px solid #e0e0e0;
  padding: 8px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.mr-bp-success-row {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
}
.mr-bp-success-row span { color: #888; }
.mr-bp-success-row b { color: #1a1a1a; }
.mr-bp-success-close {
  background: linear-gradient(180deg, #5e21a8, #3a1370);
  color: #fff;
  border: 0;
  padding: 10px 28px;
  border-radius: 6px;
  font-weight: 800;
  font-size: 12px;
  cursor: pointer;
  letter-spacing: 0.4px;
}

/* ---- Fail state(红色保留)---- */
.mr-bp-fail-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(135deg, #ef5350, #c62828);
  color: #fff;
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}
.mr-bp-fail-title {
  font-size: 14px;
  font-weight: 800;
  color: #c62828;
}
.mr-bp-fail-msg {
  font-size: 11px;
  color: #555;
  background: #fff0f0;
  border-radius: 5px;
  padding: 8px 12px;
  border: 1px solid #f5b7b7;
  max-width: 100%;
  word-wrap: break-word;
}
.mr-bp-fail-close {
  background: #f0f0f0;
  color: #555;
  border: 0;
  padding: 9px 24px;
  border-radius: 6px;
  font-weight: 800;
  font-size: 11px;
  cursor: pointer;
}

/* ---- Footer ---- */
.mr-bp-footer-info {
  text-align: center;
  padding: 7px 12px 10px;
  font-size: 10px;
  color: #888;
  border-top: 1px solid #f0f0f0;
}
.mr-bp-footer-info b { color: #5e21a8; font-size: 12px; }

/* ===========================================================
   ===== .box-3-1 背景透明 =====
   =========================================================== */
#home .box-3-1 {
  background: #ffffff00 !important;
}

/* =================================================================
   MRATM88 · 两排卡片尺寸 v8
   ★ 把 v7 那段【删掉】,换成这一整段
   ★ 贴在 CSS 栏最底部
   尺寸沿革:原本 111px → v5 92 → v6 102 → v7 107 → v8 116
   ⚠ 已超过原本 111px,一屏放不满 3 张,第 3 张会露一半边
   ================================================================= */

/* ---------- 卡片 ---------- */
.hotgames-wrap .hg-card,
#hotgames-wrap .hg-card,
.livegames-wrap .lg-card,
#livegames-wrap .lg-card {
  flex: 0 0 116px !important;
  width: 116px !important;
  min-width: 116px !important;
  max-width: 116px !important;
  box-sizing: border-box !important;
  padding: 6px 6px 8px !important;
  border-radius: 12px !important;
}

/* ---------- 图片:完整显示,不裁边 ---------- */
.hotgames-wrap .hg-card img,
#hotgames-wrap .hg-card img,
.livegames-wrap .lg-card img,
#livegames-wrap .lg-card img {
  width: 104px !important;
  height: 104px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: 104px !important;
  max-height: 104px !important;
  object-fit: contain !important;
  object-position: center center !important;
  border-radius: 10px !important;
  margin: 0 auto !important;
  display: block !important;
  background: #f2ecfa !important;
}

/* ---------- 游戏名 ---------- */
.hotgames-wrap .hg-nm,
#hotgames-wrap .hg-nm,
.livegames-wrap .lg-nm,
#livegames-wrap .lg-nm {
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1.22 !important;
  height: 27px !important;
  overflow: hidden !important;
  margin: 6px 0 4px !important;
}

/* ---------- provider + RTP ---------- */
.hotgames-wrap .hg-prov,
#hotgames-wrap .hg-prov,
.livegames-wrap .lg-prov,
#livegames-wrap .lg-prov {
  font-size: 8px !important;
  max-width: 46px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.hotgames-wrap .hg-rt,
#hotgames-wrap .hg-rt,
.livegames-wrap .lg-rt,
#livegames-wrap .lg-rt {
  font-size: 8px !important;
  padding: 2px 6px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* ---------- scroller 间距 ---------- */
.hotgames-wrap .hg-scroll,
#hotgames-wrap .hg-scroll,
.livegames-wrap .lg-scroll,
#livegames-wrap .lg-scroll {
  gap: 8px !important;
}