/* ============================================================
   足球盘口网站样式
   深色盘口风格，适配桌面与移动端
   ============================================================ */

:root {
  --bg: #0d1117;
  --bg-soft: #161b22;
  --bg-card: #1b222c;
  --bg-hover: #232c38;
  --border: #2d3644;
  --text: #e6edf3;
  --text-dim: #8b98a9;
  --text-mute: #5c6773;

  --accent: #2f81f7;
  --accent-dim: #1f6feb;
  --up: #f85149;      /* 赔率上升 红 */
  --down: #3fb950;    /* 赔率下降 绿 */
  --live: #f85149;
  --warn: #d29922;

  --home: #58a6ff;
  --away: #ff7b72;

  --radius: 8px;
  --radius-sm: 5px;
  --shadow: 0 4px 16px rgba(0, 0, 0, .35);
}

* { box-sizing: border-box; }

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
               "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

.container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 16px;
}

.muted { color: var(--text-dim); }
.spacer { flex: 1; }

/* ---------- 顶部导航 ---------- */
.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--border);
}

.topbar-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 16px;
  height: 54px;
  display: flex;
  align-items: center;
  gap: 20px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .5px;
  flex-shrink: 0;
}
.brand-icon { font-size: 20px; }

.mainnav {
  display: flex;
  align-items: center;
  gap: 4px;
  flex: 1;
}

.mainnav a {
  position: relative;
  padding: 8px 16px;
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-size: 15px;
  font-weight: 500;
  transition: all .15s;
  white-space: nowrap;
}

.mainnav a:hover {
  color: var(--text);
  background: var(--bg-hover);
}

.mainnav a.active {
  color: #fff;
  background: var(--accent-dim);
}

.nav-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 10px;
  background: var(--live);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 16px;
  vertical-align: middle;
}

.topbar-tools {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.tool-field {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-dim);
}

.tool-field select,
.filter-bar select {
  background: var(--bg-card);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 5px 8px;
  font-size: 13px;
  outline: none;
}
.tool-field select:focus,
.filter-bar select:focus { border-color: var(--accent); }

.btn-icon {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-card);
  color: var(--text-dim);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 15px;
  transition: all .15s;
}
.btn-icon:hover { color: var(--text); border-color: var(--accent); }
.btn-icon.spinning { animation: spin .8s linear infinite; }

.nav-toggle { display: none; }

/* ---------- 状态条 ---------- */
.status-strip {
  max-width: 1280px;
  margin: 0 auto;
  padding: 4px 16px;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12px;
  color: var(--text-mute);
  border-top: 1px solid rgba(255,255,255,.03);
}

.dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--text-mute);
  flex-shrink: 0;
}
.dot.ok { background: var(--down); box-shadow: 0 0 6px var(--down); }
.dot.err { background: var(--up); }
.dot.loading { background: var(--warn); animation: pulse 1s infinite; }

/* ---------- 页面通用 ---------- */
.page-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin: 20px 0 14px;
  flex-wrap: wrap;
}

.page-title {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 10px;
}

.page-title .count {
  font-size: 13px;
  font-weight: 500;
  color: var(--text-dim);
  background: var(--bg-card);
  border: 1px solid var(--border);
  padding: 2px 9px;
  border-radius: 12px;
}

.filter-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.section {
  margin-bottom: 26px;
}

.section-head {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border);
}

.section-head h2 {
  margin: 0;
  font-size: 15px;
  font-weight: 600;
}

.section-head .more {
  margin-left: auto;
  font-size: 13px;
  color: var(--accent);
}

/* ---------- 统计卡片 ---------- */
.stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
  margin-bottom: 24px;
}

.stat-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 14px 16px;
}

.stat-card .label {
  font-size: 12px;
  color: var(--text-dim);
  margin-bottom: 6px;
}

.stat-card .value {
  font-size: 24px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.stat-card.live .value { color: var(--live); }

/* ---------- 比赛表格 ---------- */
.league-group {
  margin-bottom: 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
}

.league-bar {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  font-weight: 600;
}

.league-flag {
  width: 3px;
  height: 15px;
  border-radius: 2px;
  flex-shrink: 0;
}

.league-bar .cnt {
  margin-left: auto;
  font-size: 12px;
  font-weight: 400;
  color: var(--text-dim);
}

.match-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}

.match-table thead th {
  padding: 7px 8px;
  background: rgba(255,255,255,.02);
  color: var(--text-mute);
  font-size: 11px;
  font-weight: 500;
  text-align: center;
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

.match-table thead th.th-team { text-align: left; }

.match-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .12s;
  cursor: pointer;
}
.match-table tbody tr:last-child { border-bottom: none; }
.match-table tbody tr:hover { background: var(--bg-hover); }

.match-table td {
  padding: 8px;
  text-align: center;
  vertical-align: middle;
}

/* 时间/状态列 */
.cell-time { width: 76px; }
.cell-time .time { font-variant-numeric: tabular-nums; color: var(--text-dim); font-size: 12px; }
.cell-time .status { font-size: 11px; margin-top: 2px; }
.cell-time .status.live { color: var(--live); font-weight: 700; }
.cell-time .status.done { color: var(--text-mute); }

/* 球队列 */
.cell-teams { text-align: left !important; min-width: 220px; }
.team-row {
  display: flex;
  align-items: center;
  gap: 6px;
  line-height: 1.7;
}
.team-name { flex: 1; }
.team-name.win { font-weight: 600; }
.team-rank {
  font-size: 10px;
  color: var(--text-mute);
  background: rgba(255,255,255,.05);
  padding: 0 4px;
  border-radius: 3px;
}
.red-card {
  display: inline-block;
  width: 8px;
  height: 11px;
  background: var(--up);
  border-radius: 1px;
  font-size: 8px;
  color: #fff;
  line-height: 11px;
  text-align: center;
}

/* 比分列 */
.cell-score { width: 52px; }
.score-main {
  font-size: 15px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.score-main.live { color: var(--live); }
.score-half {
  font-size: 11px;
  color: var(--text-mute);
  font-variant-numeric: tabular-nums;
}

/* 角球列 */
.cell-corner { width: 46px; font-size: 12px; color: var(--text-dim); font-variant-numeric: tabular-nums; }

/* 盘口列 */
.odds-cell { min-width: 108px; }

.odds-trio {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
}

.odds-box {
  min-width: 42px;
  padding: 3px 5px;
  background: rgba(255,255,255,.04);
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  transition: all .12s;
}
.odds-box:hover { border-color: var(--accent); }
.odds-box.line {
  background: rgba(47,129,247,.12);
  color: #79c0ff;
  font-weight: 600;
  min-width: 46px;
}
.odds-box.up { color: var(--up); }
.odds-box.down { color: var(--down); }
.odds-move { display: inline-block; margin-left: 2px; font-size: 8px; font-style: normal; line-height: 1; vertical-align: 1px; }
.odds-box.up .odds-move { color: var(--up); }
.odds-box.down .odds-move { color: var(--down); }
.odds-box.empty { color: var(--text-mute); background: none; }

.odds-closed {
  font-size: 11px;
  color: var(--text-mute);
  font-style: italic;
}

.odds-none { color: var(--text-mute); font-size: 12px; }

.handi-side {
  display: inline-block;
  font-size: 10px;
  padding: 0 3px;
  border-radius: 2px;
  margin-right: 3px;
  vertical-align: middle;
}
.handi-side.home { background: rgba(88,166,255,.2); color: var(--home); }
.handi-side.away { background: rgba(255,123,114,.2); color: var(--away); }

/* 公司标记 */
.company-tag {
  font-size: 10px;
  color: var(--text-mute);
  margin-top: 2px;
}

/* ---------- 加载与空态 ---------- */
.loading-block {
  padding: 60px 20px;
  text-align: center;
  color: var(--text-dim);
}

.spinner {
  width: 28px;
  height: 28px;
  margin: 0 auto 12px;
  border: 3px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}

.empty-block {
  padding: 50px 20px;
  text-align: center;
  color: var(--text-dim);
  background: var(--bg-card);
  border: 1px dashed var(--border);
  border-radius: var(--radius);
}
.empty-block .icon { font-size: 34px; display: block; margin-bottom: 10px; opacity: .5; }

.error-block {
  padding: 20px;
  background: rgba(248,81,73,.08);
  border: 1px solid rgba(248,81,73,.3);
  border-radius: var(--radius);
  color: #ffa198;
}
.error-block h3 { margin: 0 0 8px; font-size: 15px; }
.error-block pre {
  margin: 8px 0 0;
  padding: 8px;
  background: rgba(0,0,0,.3);
  border-radius: var(--radius-sm);
  font-size: 12px;
  overflow-x: auto;
  white-space: pre-wrap;
}

/* ---------- 详情弹窗 ---------- */
.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}

/* hidden 属性默认的 display:none 会被上方 flex 覆盖，需显式声明 */
.modal[hidden] { display: none; }

.modal-mask {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.7);
  backdrop-filter: blur(2px);
}

.modal-panel {
  position: relative;
  width: 100%;
  max-width: 900px;
  max-height: 88vh;
  background: var(--bg-soft);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.modal-close {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 2;
  width: 28px;
  height: 28px;
  background: var(--bg-card);
  color: var(--text-dim);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 14px;
}
.modal-close:hover { color: var(--text); }

.modal-body {
  overflow-y: auto;
  padding: 18px;
}

/* 详情头部 */
.detail-head {
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 16px;
}

.detail-league {
  font-size: 12px;
  color: var(--text-dim);
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}

.detail-vs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.detail-team {
  flex: 1;
  text-align: center;
  font-size: 16px;
  font-weight: 600;
}

.detail-score {
  font-size: 26px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  min-width: 90px;
  text-align: center;
}
.detail-score.live { color: var(--live); }
.detail-score .half { display: block; font-size: 12px; font-weight: 400; color: var(--text-mute); }

.detail-meta {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin-top: 10px;
  font-size: 12px;
  color: var(--text-dim);
  flex-wrap: wrap;
}

/* 详情标签页 */
.tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--border);
  overflow-x: auto;
}

.tabs button {
  padding: 8px 14px;
  background: none;
  border: none;
  border-bottom: 2px solid transparent;
  color: var(--text-dim);
  font-size: 13px;
  font-weight: 500;
  white-space: nowrap;
}
.tabs button:hover { color: var(--text); }
.tabs button.active { color: var(--accent); border-bottom-color: var(--accent); }

.tab-panel { display: none; }
.tab-panel.active { display: block; }

/* 详情表格 */
.detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-bottom: 16px;
}

.detail-table caption {
  text-align: left;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 0;
  color: var(--text);
}

.detail-table th {
  padding: 7px 8px;
  background: var(--bg-card);
  color: var(--text-mute);
  font-size: 11px;
  font-weight: 500;
  text-align: center;
  border-bottom: 1px solid var(--border);
}
.detail-table th:first-child { text-align: left; }

.detail-table td {
  padding: 7px 8px;
  text-align: center;
  border-bottom: 1px solid rgba(255,255,255,.04);
  font-variant-numeric: tabular-nums;
}
.detail-table td:first-child { text-align: left; color: var(--text-dim); }
.detail-table tbody tr:hover { background: rgba(255,255,255,.02); }

.badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 3px;
  font-size: 10px;
  font-weight: 600;
}
.badge.early { background: rgba(210,153,34,.2); color: #e3b341; }
.badge.pre { background: rgba(88,166,255,.2); color: var(--home); }
.badge.live { background: rgba(248,81,73,.2); color: var(--live); }
.badge.closed { background: rgba(139,152,169,.2); color: var(--text-dim); }

/* 波胆网格 */
.score-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(74px, 1fr));
  gap: 6px;
  margin-bottom: 14px;
}

.score-item {
  padding: 7px 4px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  text-align: center;
  transition: all .12s;
}
.score-item:hover { border-color: var(--accent); background: var(--bg-hover); }
.score-item .sc {
  font-size: 13px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.score-item .od {
  font-size: 12px;
  color: var(--accent);
  font-variant-numeric: tabular-nums;
  margin-top: 2px;
}
.score-item.other .sc { color: var(--text-dim); font-size: 12px; }

.load-extra {
  display: block;
  width: 100%;
  padding: 10px;
  background: var(--bg-card);
  color: var(--accent);
  border: 1px dashed var(--border);
  border-radius: var(--radius);
  font-size: 13px;
  text-align: center;
}
.load-extra:hover { background: var(--bg-hover); border-color: var(--accent); }
.load-extra:disabled { color: var(--text-mute); cursor: not-allowed; }

.hint-row {
  font-size: 12px;
  color: var(--text-mute);
  margin: 6px 0 14px;
  padding: 8px 10px;
  background: rgba(255,255,255,.02);
  border-left: 2px solid var(--border);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

/* ---------- 公告弹窗 ---------- */
.announcement-modal-backdrop {
  position: fixed;
  z-index: 130;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 22px;
  background: rgba(2, 7, 14, .68);
  backdrop-filter: blur(4px);
}
.announcement-modal {
  position: relative;
  width: min(100%, 490px);
  max-height: min(720px, calc(100vh - 44px));
  overflow: auto;
  padding: 30px 30px 25px;
  border: 1px solid var(--border);
  border-top: 3px solid var(--accent);
  border-radius: 12px;
  background: var(--bg-card);
  box-shadow: 0 26px 70px rgba(0, 0, 0, .46);
}
.announcement-modal.level-success { border-top-color: var(--down); }
.announcement-modal.level-warning { border-top-color: var(--warn); }
.announcement-modal.level-danger { border-top-color: var(--up); }
.announcement-modal-close {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--text-mute);
  font-size: 22px;
  line-height: 1;
}
.announcement-modal-close:hover { background: var(--bg-hover); color: var(--text); }
.announcement-modal-mark {
  display: grid;
  place-items: center;
  width: 37px;
  height: 37px;
  margin-bottom: 12px;
  border: 1px solid color-mix(in srgb, var(--accent) 65%, var(--border));
  border-radius: 50%;
  color: var(--accent);
  font-family: Georgia, serif;
  font-size: 20px;
  font-weight: 800;
}
.announcement-modal.level-success .announcement-modal-mark { border-color: var(--down); color: var(--down); }
.announcement-modal.level-warning .announcement-modal-mark { border-color: var(--warn); color: var(--warn); }
.announcement-modal.level-danger .announcement-modal-mark { border-color: var(--up); color: var(--up); }
.announcement-modal-kicker { margin: 0 0 4px; color: var(--text-mute); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.announcement-modal h2 { margin: 0; padding-right: 22px; color: var(--text); font-size: 20px; line-height: 1.35; }
.announcement-modal-content { margin: 13px 0 22px; color: var(--text-dim); font-size: 14px; line-height: 1.75; white-space: normal; }
.announcement-modal-confirm { width: 100%; min-height: 38px; }

/* ---------- 页脚 ---------- */
.footer {
  margin-top: 40px;
  padding: 18px 0;
  border-top: 1px solid var(--border);
  background: var(--bg-soft);
}
.footer-inner { text-align: center; font-size: 12px; color: var(--text-mute); }
.footer-inner p { margin: 3px 0; }

/* ---------- 责任使用与信息页脚 ---------- */
.footer {
  margin-top: 48px;
  padding: 0;
  border-top: 1px solid var(--border);
  background: var(--bg-soft);
  color: var(--text-dim);
}
.footer-age-bar {
  background: #1b2028;
  border-bottom: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
}
.footer-age-inner {
  min-height: 62px;
  display: flex;
  align-items: center;
  gap: 13px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.footer-age-mark {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 39px;
  height: 39px;
  border: 2px solid #d95b62;
  border-radius: 50%;
  color: #fff;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -.4px;
}
.footer-age-copy { display: grid; gap: 1px; min-width: 0; }
.footer-age-copy strong { color: var(--text); font-size: 13px; }
.footer-age-copy span { color: var(--text-dim); font-size: 12px; }
.footer-age-link {
  margin-left: auto;
  flex: 0 0 auto;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-hover);
  color: var(--text);
  font-size: 12px;
  font-weight: 700;
}
.footer-age-link:hover { border-color: var(--accent); color: var(--accent); }
.footer-main { padding: 22px 0 18px; }
.footer-data-notice {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin-bottom: 20px;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--bg-card) 78%, transparent);
}
.footer-data-notice p { margin: 0; color: var(--text-dim); font-size: 12px; line-height: 1.65; }
.footer-notice-icon {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border: 1px solid var(--text-mute);
  border-radius: 50%;
  color: var(--text-mute);
  font-size: 12px;
  font-family: Georgia, serif;
  font-weight: 700;
}
.footer-grid {
  display: grid;
  grid-template-columns: minmax(130px, .9fr) minmax(180px, 1fr) minmax(260px, 1.45fr);
  gap: 34px;
  padding: 4px 0 19px;
}
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 7px; min-width: 0; }
.footer-column h2 { margin: 0 0 6px; color: var(--text); font-size: 14px; font-weight: 750; }
.footer-column a { color: var(--text-dim); font-size: 13px; line-height: 1.4; }
.footer-column a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
.footer-external { display: inline-block; margin-left: 3px; font-size: 11px; text-decoration: none; }
.footer-link-note { margin-top: 3px; color: var(--text-mute); font-size: 11px; line-height: 1.5; }
.footer-help-column {
  padding-left: 19px;
  border-left: 2px solid color-mix(in srgb, var(--accent) 50%, var(--border));
}
.footer-help-column p { margin: 0; color: var(--text-dim); font-size: 12px; line-height: 1.72; }
.footer-help-link { margin-top: 3px; color: var(--text) !important; font-weight: 700; }
.footer-virtual-note {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 38px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}
.footer-virtual-badge {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 20px;
  height: 20px;
  border: 1px solid var(--down);
  border-radius: 50%;
  color: var(--down);
  font-size: 14px;
}
.footer-virtual-note p { margin: 0; color: var(--text-dim); font-size: 12px; }
.footer-sync { margin-left: auto; color: var(--text-mute); font-size: 11px; white-space: nowrap; }
.footer-policy-bar { border-top: 1px solid var(--border); background: color-mix(in srgb, var(--bg) 62%, var(--bg-soft)); }
.footer-policy-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 47px;
  color: var(--text-mute);
  font-size: 11px;
}
.footer-policy-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0; }
.footer-policy-links a { padding: 0 10px; border-left: 1px solid var(--border); color: var(--text-dim); }
.footer-policy-links a:first-child { border-left: 0; }
.footer-policy-links a:hover { color: var(--accent); }
:root[data-theme="light"] .footer-age-bar { background: #1d232d; }
:root[data-theme="light"] .footer-policy-bar { background: #edf1f6; }

/* ---------- 页脚说明页 ---------- */
.info-page { width: 100%; max-width: 980px; margin: 0 auto; padding: 30px 0 44px; }
.info-back { display: inline-flex; align-items: center; gap: 5px; margin-bottom: 18px; color: var(--text-dim); font-size: 13px; }
.info-back:hover { color: var(--accent); }
.info-hero { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 20px; padding: 22px; border: 1px solid var(--border); border-radius: var(--radius); background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 15%, var(--bg-card)), var(--bg-card)); }
.info-hero-icon { display: grid; flex: 0 0 auto; place-items: center; width: 43px; height: 43px; border: 1px solid color-mix(in srgb, var(--accent) 65%, var(--border)); border-radius: 50%; color: var(--accent); font-size: 16px; font-weight: 800; }
.info-hero .page-title { margin: 0; }
.info-hero p { max-width: 760px; margin: 6px 0 0; color: var(--text-dim); line-height: 1.7; }
.info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.info-card { position: relative; min-height: 150px; padding: 21px 19px 18px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-card); }
.info-card-index { position: absolute; top: 12px; right: 14px; color: color-mix(in srgb, var(--accent) 65%, var(--text-mute)); font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.info-card h2 { margin: 0 28px 10px 0; color: var(--text); font-size: 15px; }
.info-card p { margin: 0; color: var(--text-dim); font-size: 13px; line-height: 1.72; }
.info-disclaimer { margin: 16px 0 0; padding: 11px 13px; border-left: 3px solid var(--down); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: color-mix(in srgb, var(--down) 9%, transparent); color: var(--text-dim); font-size: 12px; line-height: 1.6; }

/* ---------- 动画 ---------- */
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 0%,100% { opacity: 1; } 50% { opacity: .3; } }
@keyframes flash {
  0% { background: rgba(47,129,247,.35); }
  100% { background: transparent; }
}
.flash { animation: flash 1s ease-out; }

/* ---------- 响应式 ---------- */
@media (max-width: 900px) {
  .cell-corner, .th-corner { display: none; }
  .odds-cell.half-col, .th-half { display: none; }
}

@media (max-width: 720px) {
  .topbar-inner { height: auto; padding: 8px 12px; flex-wrap: wrap; gap: 10px; }
  .nav-toggle { display: inline-flex; }
  .mainnav {
    order: 3;
    width: 100%;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
  }
  .mainnav.open { display: flex; }
  .mainnav a { padding: 10px 12px; }
  .brand-text { font-size: 15px; }
  .tool-field span { display: none; }

  .container { padding: 0 10px; }
  .status-strip { padding: 4px 12px; }

  .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .stat-card { padding: 10px 12px; }
  .stat-card .value { font-size: 19px; }

  /* 窄屏下只保留时间/对阵/比分/让球/大小球五列，
     其余盘口到详情弹窗查看，避免横向溢出与队名频繁换行 */
  .match-table { font-size: 12px; table-layout: fixed; }
  .match-table td { padding: 6px 3px; }
  .match-table th { padding: 6px 3px; font-size: 10px; }
  .th-eu, .odds-cell.eu-col { display: none; }

  .cell-time { width: 46px; }
  .cell-teams { width: auto; min-width: 0; }
  .cell-score { width: 44px; }
  .odds-cell { width: 84px; min-width: 84px; }

  .team-name {
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
  }
  .team-row { gap: 3px; }
  /* 联赛简称徒标在窄屏下会挤压队名，隐藏 */
  .team-rank { display: none; }

  .odds-trio { gap: 1px; }
  .odds-box { min-width: 0; flex: 1; padding: 2px 1px; font-size: 10px; }
  .odds-box.line { font-size: 10px; }
  .handi-side { font-size: 9px; margin-right: 1px; }

  .league-bar { font-size: 12px; padding: 7px 10px; }
  .page-title { font-size: 17px; }
  .filter-bar { width: 100%; }
  .filter-bar select { flex: 1; min-width: 0; }

  .detail-vs { gap: 8px; }
  .detail-team { font-size: 14px; }
  .detail-score { font-size: 22px; min-width: 70px; }
  .modal { padding: 8px; }
  .modal-body { padding: 14px; }
  .score-grid { grid-template-columns: repeat(auto-fill, minmax(62px, 1fr)); }
  /* 详情弹窗内的多列对比表允许内部横向滚动 */
  .tab-panel { overflow-x: auto; }
  .detail-table { min-width: 480px; }
}

/* ============================================================
   合买大厅
   复用顶部 :root 中的配色变量，保持与盘口页面一致的视觉语言
   ============================================================ */

/* ---------- 顶栏用户区 ---------- */
.user-area { position: relative; display: flex; align-items: center; }

.btn-login {
  padding: 5px 14px;
  background: transparent;
  color: var(--accent);
  border: 1px solid var(--accent);
  border-radius: var(--radius-sm);
  font-size: 13px;
  white-space: nowrap;
  transition: all .15s;
}
.btn-login:hover { background: var(--accent); color: #fff; }

.user-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  cursor: pointer;
  font-size: 13px;
  white-space: nowrap;
  transition: all .15s;
}
.user-chip:hover { border-color: var(--accent); }
.user-name { color: var(--text); }
.user-credits {
  color: var(--warn);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.user-credits::before { content: '◆'; margin-right: 3px; font-size: 9px; opacity: .7; }
.user-chip .chev { color: var(--text-mute); font-size: 10px; }

.admin-tag {
  display: inline-block;
  margin-left: 4px;
  padding: 0 4px;
  background: var(--up);
  color: #fff;
  border-radius: 2px;
  font-size: 10px;
  font-style: normal;
  vertical-align: 1px;
}

.user-menu {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 60;
  min-width: 132px;
  padding: 4px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  box-shadow: var(--shadow);
}
.user-menu a, .user-menu button {
  display: block;
  width: 100%;
  padding: 8px 12px;
  background: none;
  border: 0;
  color: var(--text-dim);
  font-size: 13px;
  text-align: left;
}
.user-menu a:hover, .user-menu button:hover { background: var(--bg-hover); color: var(--text); }

.nav-badge.accent { background: var(--warn); color: #14181f; }

/* ---------- 登录注册 ---------- */
.modal-narrow .modal-panel { max-width: 420px; }

.auth-tabs {
  display: flex;
  gap: 4px;
  margin-bottom: 18px;
  border-bottom: 1px solid var(--border);
}
.auth-tabs button {
  flex: 1;
  padding: 10px;
  background: none;
  border: 0;
  border-bottom: 2px solid transparent;
  color: var(--text-dim);
  font-size: 15px;
}
.auth-tabs button.active { color: var(--accent); border-bottom-color: var(--accent); }

.auth-form label { display: block; margin-bottom: 13px; }
.auth-form label > span {
  display: block;
  margin-bottom: 5px;
  color: var(--text-dim);
  font-size: 12px;
}
.auth-form input {
  width: 100%;
  padding: 9px 11px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 14px;
  outline: none;
}
.auth-form input:focus { border-color: var(--accent); }

.auth-msg, .gb-msg {
  margin-bottom: 12px;
  padding: 8px 11px;
  background: rgba(248, 81, 73, .1);
  border-left: 2px solid var(--up);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: #ffa198;
  font-size: 13px;
}

.btn-block { width: 100%; padding: 11px; font-size: 15px; }

.auth-note {
  margin: 14px 0 0;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  color: var(--text-mute);
  font-size: 12px;
  line-height: 1.8;
}
.auth-note strong { color: var(--warn); }

/* ---------- 按钮 ---------- */
.btn-primary {
  padding: 8px 18px;
  background: var(--accent-dim);
  border: 1px solid var(--accent);
  border-radius: var(--radius-sm);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  transition: all .15s;
}
.btn-primary:hover { background: var(--accent); }
.btn-primary:disabled {
  background: var(--bg-card);
  border-color: var(--border);
  color: var(--text-mute);
  cursor: not-allowed;
}

.btn-ghost {
  padding: 6px 13px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-size: 13px;
  transition: all .15s;
}
.btn-ghost:hover { border-color: var(--accent); color: var(--text); }
.btn-ghost.danger { border-color: rgba(248, 81, 73, .4); color: #ffa198; }
.btn-ghost.danger:hover { background: rgba(248, 81, 73, .15); border-color: var(--up); }
.btn-ghost:disabled { opacity: .4; cursor: not-allowed; }

.btn-sm { padding: 5px 12px; font-size: 13px; }
.btn-xs { padding: 3px 8px; font-size: 12px; }

/* 钱包页 CTA 按钮：更醒目，方便手机端操作 */
.wallet-cta {
  display: block;
  width: 100%;
  padding: 12px 18px;
  font-size: 15px;
  font-weight: 700;
  text-align: center;
  margin-top: 8px;
}

/* ---------- 合买统计条 ---------- */
.gb-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(98px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.gb-stat {
  padding: 12px 10px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  text-align: center;
}
.gb-stat b {
  display: block;
  margin-bottom: 3px;
  color: var(--accent);
  font-size: 20px;
  font-variant-numeric: tabular-nums;
}
.gb-stat span { color: var(--text-dim); font-size: 12px; }

/* ---------- 方案卡片 ---------- */
.plan-list { display: flex; flex-direction: column; gap: 12px; }

.plan-card {
  padding: 14px 16px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  transition: border-color .15s;
}
.plan-card:hover { border-color: #3a4553; }

.plan-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 10px;
  font-size: 12px;
}
.plan-id { color: var(--text-mute); font-variant-numeric: tabular-nums; }
.plan-title { color: var(--text); font-size: 14px; font-weight: 600; }
.plan-owner { color: var(--text-dim); }

.plan-status {
  padding: 2px 8px;
  border-radius: 3px;
  background: rgba(255, 255, 255, .06);
  color: var(--text-dim);
  font-size: 12px;
}
.plan-status.st-open { background: rgba(63, 185, 80, .16); color: var(--down); }
.plan-status.st-locked { background: rgba(210, 153, 34, .16); color: #e3b341; }
.plan-status.st-settled { background: rgba(47, 129, 247, .16); color: #79c0ff; }
.plan-status.st-cancel { background: rgba(139, 152, 169, .14); color: var(--text-dim); }

.plan-hidden-tag {
  padding: 2px 7px;
  background: rgba(163, 113, 247, .16);
  border-radius: 3px;
  color: #d2a8ff;
  font-size: 11px;
}

.plan-match {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.plan-match .teams { color: var(--text); font-size: 15px; }
.plan-match .teams em { color: var(--text-mute); font-style: normal; margin: 0 4px; font-size: 12px; }

.plan-score {
  padding: 1px 8px;
  background: rgba(248, 81, 73, .18);
  border-radius: 3px;
  color: var(--live);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.plan-time { color: var(--text-mute); font-size: 12px; font-variant-numeric: tabular-nums; }
.started-tag {
  padding: 1px 7px;
  background: rgba(248, 81, 73, .14);
  border-radius: 3px;
  color: #ffa198;
  font-size: 11px;
}

.league-chip {
  padding: 2px 8px;
  border-left: 3px solid var(--lc, var(--border));
  background: rgba(255, 255, 255, .04);
  border-radius: 0 3px 3px 0;
  color: var(--text-dim);
  font-size: 12px;
  white-space: nowrap;
}

/* 盘口区 */
.plan-bet {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  padding: 9px 12px;
  margin-bottom: 10px;
  background: rgba(0, 0, 0, .25);
  border-radius: var(--radius-sm);
  font-size: 13px;
}
.bet-tag {
  padding: 1px 7px;
  background: rgba(47, 129, 247, .14);
  border-radius: 3px;
  color: #79c0ff;
}
.bet-period { color: var(--text-dim); }
.bet-sel { color: var(--text); font-weight: 600; }
.plan-bet b { color: var(--warn); font-variant-numeric: tabular-nums; }
.bet-odds {
  margin-left: auto;
  color: var(--down);
  font-weight: 700;
  font-size: 15px;
  font-variant-numeric: tabular-nums;
}
.bet-comp { color: var(--text-mute); font-size: 12px; }

.plan-bet-hidden { color: var(--text-dim); font-style: italic; }
.plan-bet-hidden .lock-icon { font-style: normal; }

/* 结算结果 */
.plan-settle {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 9px 12px;
  margin-bottom: 10px;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: 13px;
}
.plan-settle.res-win { background: rgba(63, 185, 80, .1); border-left: 3px solid var(--down); }
.plan-settle.res-lose { background: rgba(248, 81, 73, .1); border-left: 3px solid var(--up); }
.plan-settle.res-push { background: rgba(139, 152, 169, .1); border-left: 3px solid var(--text-dim); }
.res-badge { font-weight: 700; }
.plan-settle b { font-variant-numeric: tabular-nums; }
.settle-block { display: block; line-height: 1.9; }

.res-win { color: var(--down); }
.res-lose { color: var(--up); }
.res-push { color: var(--text-dim); }

/* 份额进度 */
.plan-shares { margin-bottom: 11px; }
.share-bar {
  height: 6px;
  margin-bottom: 7px;
  overflow: hidden;
  background: rgba(255, 255, 255, .06);
  border-radius: 3px;
}
.share-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--accent-dim), var(--warn));
  transition: width .3s;
}
.share-meta {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  color: var(--text-dim);
  font-size: 12px;
}
.share-meta b { color: var(--text); font-variant-numeric: tabular-nums; }
.share-meta .remain { color: var(--warn); }

.my-badge {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  padding: 7px 11px;
  margin-bottom: 10px;
  background: rgba(47, 129, 247, .07);
  border-left: 3px solid var(--accent);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  font-size: 12px;
  color: var(--text-dim);
}

/* 操作区 */
.plan-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  padding-top: 11px;
  border-top: 1px solid rgba(255, 255, 255, .05);
}
.follow-inline { display: flex; align-items: center; gap: 8px; }
.share-input {
  width: 62px;
  padding: 5px 8px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 13px;
  text-align: center;
  outline: none;
}
.share-input:focus { border-color: var(--accent); }
.follow-cost { color: var(--text-dim); font-size: 12px; }

/* ---------- 发起合买表单 ---------- */
.gb-entry {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}
.gb-entry-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.gb-entry-head .sub-title { margin: 0; border: 0; padding: 0; }

.gb-form-login {
  padding: 18px;
  background: var(--bg-card);
  border-radius: var(--radius);
  text-align: center;
}
.gb-form-login p { margin: 0 0 12px; color: var(--text-dim); }

.gb-form { margin-top: 12px; }

.gb-section { margin-bottom: 18px; }
.gb-section-title {
  margin-bottom: 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
  color: var(--accent);
  font-size: 13px;
  font-weight: 600;
}

.mk-group { margin-bottom: 12px; }
.mk-label { margin-bottom: 6px; color: var(--text-dim); font-size: 12px; }
.mk-label b { color: var(--warn); font-variant-numeric: tabular-nums; }

.mk-options { display: flex; gap: 8px; flex-wrap: wrap; }
.mk-opt {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-size: 13px;
  transition: all .15s;
}
.mk-opt:hover { border-color: #47535f; color: var(--text); }
.mk-opt.active {
  background: rgba(47, 129, 247, .14);
  border-color: var(--accent);
  color: var(--text);
}
.opt-odds { color: var(--down); font-weight: 700; font-variant-numeric: tabular-nums; }

.gb-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.gb-grid label, .gb-full { display: block; }
.gb-span2 { grid-column: span 2; }
.gb-full { margin-top: 12px; }

.gb-grid label > span, .gb-full > span {
  display: block;
  margin-bottom: 5px;
  color: var(--text-dim);
  font-size: 12px;
}
.gb-grid input, .gb-grid select, .gb-full input {
  width: 100%;
  padding: 8px 10px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 14px;
  outline: none;
}
.gb-grid input:focus, .gb-grid select:focus, .gb-full input:focus { border-color: var(--accent); }

.gb-calc {
  margin-top: 12px;
  padding: 10px 12px;
  background: rgba(0, 0, 0, .25);
  border-radius: var(--radius-sm);
  font-size: 13px;
}
.calc-row {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 4px;
  color: var(--text-dim);
}
.calc-row b { color: var(--text); font-variant-numeric: tabular-nums; }
.picked-row { padding-top: 6px; border-top: 1px dashed var(--border); }
.calc-warn { margin-top: 6px; color: #ffa198; font-size: 12px; }

.gb-submit-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}
.gb-submit-row b { color: var(--warn); font-variant-numeric: tabular-nums; }

/* ---------- 内联标签页与数据表 ---------- */
.tabs-inline { display: flex; gap: 4px; flex-wrap: wrap; }
.tabs-inline button {
  padding: 7px 15px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text-dim);
  font-size: 13px;
  transition: all .15s;
}
.tabs-inline button:hover { color: var(--text); }
.tabs-inline button.active {
  background: rgba(47, 129, 247, .14);
  border-color: var(--accent);
  color: #79c0ff;
}
.tabs-inline.sm button { padding: 5px 11px; font-size: 12px; }
.tabs-inline { margin-bottom: 14px; }

.data-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.data-table th, .data-table td {
  padding: 9px 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .05);
  text-align: left;
}
.data-table th {
  background: var(--bg-card);
  color: var(--text-mute);
  font-weight: 500;
  font-size: 11px;
}
.data-table td { color: var(--text-dim); }
.data-table td.num, .data-table th.num { text-align: right; font-variant-numeric: tabular-nums; }
.data-table tbody tr:hover { background: rgba(255, 255, 255, .02); }
.data-table .sm { font-size: 12px; color: var(--text-mute); }

.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.detail-table.striped tbody tr:nth-child(even) { background: rgba(255, 255, 255, .02); }
.owner-row { background: rgba(210, 153, 34, .06) !important; }
.owner-tag {
  padding: 0 5px;
  background: rgba(255, 255, 255, .07);
  border-radius: 2px;
  color: var(--text-dim);
  font-size: 11px;
  font-style: normal;
}
.self-row { background: rgba(63, 185, 80, .06) !important; }
.ledger-reason { color: var(--text-mute); font-size: 12px; }

.sub-title {
  margin: 20px 0 10px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  font-size: 15px;
}

.detail-sub {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 8px;
  color: var(--text-dim);
  font-size: 13px;
}
.detail-head h2 { margin: 0; font-size: 17px; }

/* ---------- 后台管理 ---------- */
.admin-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 14px;
  padding: 10px 12px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.admin-toolbar input {
  padding: 6px 9px;
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 13px;
  outline: none;
}
.admin-toolbar .tabs-inline { margin-bottom: 0; }

.admin-table { font-size: 12px; }
.admin-table th, .admin-table td { padding: 8px; white-space: nowrap; }
.admin-table .cell-match { white-space: normal; min-width: 170px; }
.mini-league { color: var(--text-mute); font-size: 11px; }
.cell-actions { display: flex; gap: 4px; flex-wrap: wrap; }

.invite-code {
  padding: 2px 8px;
  background: var(--bg);
  border-radius: 3px;
  color: var(--warn);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 13px;
  letter-spacing: 1px;
}

/* ---------- 操作日志 ---------- */
.log-list { display: flex; flex-direction: column; gap: 10px; }
.log-item {
  padding: 11px 13px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.log-head {
  display: flex;
  align-items: center;
  gap: 9px;
  flex-wrap: wrap;
  margin-bottom: 8px;
  font-size: 12px;
}
.log-action {
  padding: 2px 8px;
  background: rgba(47, 129, 247, .16);
  border-radius: 3px;
  color: #79c0ff;
  font-weight: 600;
}
.log-target { color: var(--text-mute); }
.log-admin { color: var(--warn); }

.log-diff { width: 100%; border-collapse: collapse; font-size: 12px; }
.log-diff td { padding: 4px 8px; border-bottom: 1px solid rgba(255, 255, 255, .04); }
.log-diff td:first-child { width: 100px; color: var(--text-dim); }
.log-from { color: #ffa198; text-decoration: line-through; opacity: .75; }
.log-arrow { width: 20px; color: var(--text-mute); text-align: center; }
.log-to { color: var(--down); font-weight: 600; }

.log-note { margin-top: 7px; color: var(--text-dim); font-size: 12px; }
.log-ip { margin-top: 4px; font-size: 11px; }

/* ---------- 提示条 ---------- */
.toast-box {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 300;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.toast {
  min-width: 200px;
  max-width: 340px;
  padding: 11px 15px;
  background: var(--bg-hover);
  border: 1px solid var(--border);
  border-left: 3px solid var(--down);
  border-radius: var(--radius-sm);
  color: var(--text);
  font-size: 13px;
  box-shadow: var(--shadow);
  animation: toastIn .22s ease-out;
}
.toast-err { border-left-color: var(--up); }
.toast.out { opacity: 0; transform: translateX(16px); transition: all .3s; }

@keyframes toastIn {
  from { opacity: 0; transform: translateX(24px); }
  to { opacity: 1; transform: translateX(0); }
}

/* ---------- 合买模块响应式 ---------- */
@media (max-width: 720px) {
  .user-chip { padding: 3px 7px; font-size: 12px; gap: 5px; }
  .user-name { max-width: 62px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  .gb-stats { grid-template-columns: repeat(3, 1fr); gap: 7px; }
  .gb-stat { padding: 9px 5px; }
  .gb-stat b { font-size: 16px; }
  .gb-stat span { font-size: 11px; }

  .plan-card { padding: 11px 12px; }
  .plan-match .teams { font-size: 13px; }
  .plan-bet { gap: 6px; padding: 8px 10px; font-size: 12px; }
  .bet-odds { font-size: 14px; }
  .share-meta { gap: 9px; font-size: 11px; }
  .plan-actions { gap: 7px; }
  .my-badge { gap: 8px; font-size: 11px; }

  .gb-grid { grid-template-columns: 1fr 1fr; }
  .gb-span2 { grid-column: span 2; }
  .mk-options { gap: 6px; }
  .mk-opt { padding: 7px 11px; font-size: 12px; }

  .gb-submit-row { flex-direction: column; align-items: stretch; }
  .gb-submit-row .btn-primary { width: 100%; }

  .modal-narrow .modal-panel { max-width: 100%; }

  .toast-box { right: 10px; left: 10px; bottom: 10px; }
  .toast { max-width: none; }

  /* 后台表格列多，窄屏下依赖 .table-wrap 横向滚动 */
  .admin-table { font-size: 11px; }
  .admin-table th, .admin-table td { padding: 6px 5px; }

  .data-table { font-size: 12px; }
  .data-table th, .data-table td { padding: 7px 6px; }
}

/* 表单字段下方的补充说明 */
.gb-hint {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  line-height: 1.5;
  color: var(--text-dim);
}

/* ---------- 个人中心 ---------- */
.page-subtitle {
  margin: 4px 0 0;
  color: var(--text-dim);
  font-size: 13px;
}

.user-center-head { align-items: center; }

.profile-hero {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  padding: 20px 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: linear-gradient(115deg, rgba(47, 129, 247, .16), rgba(27, 34, 44, .98) 48%, rgba(63, 185, 80, .08));
  box-shadow: var(--shadow);
}

.profile-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 56px;
  width: 56px;
  height: 56px;
  border: 2px solid rgba(88, 166, 255, .7);
  border-radius: 50%;
  background: linear-gradient(145deg, #2f81f7, #1f6feb);
  color: #fff;
  font-size: 19px;
  font-weight: 700;
  letter-spacing: 1px;
}

.profile-main { min-width: 0; }
.profile-name { display: flex; align-items: center; gap: 6px; font-size: 20px; font-weight: 700; }
.profile-meta { margin-top: 4px; color: var(--text-dim); font-size: 13px; }

.profile-credit {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-left: auto;
  padding-left: 20px;
  border-left: 1px solid var(--border);
}
.profile-credit span, .profile-credit small { color: var(--text-dim); font-size: 12px; }
.profile-credit b { margin: 1px 0; color: #8cc8ff; font-size: 27px; line-height: 1.2; }

.user-kpi-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 18px;
}

.user-kpi {
  min-width: 0;
  padding: 15px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
}
.user-kpi span, .user-kpi small { display: block; color: var(--text-dim); font-size: 12px; }
.user-kpi b { display: block; margin: 3px 0; font-size: 22px; line-height: 1.25; }

.user-tabs { margin-bottom: 16px; }
.tab-count {
  display: inline-block;
  min-width: 18px;
  margin-left: 3px;
  padding: 0 5px;
  border-radius: 999px;
  background: rgba(88, 166, 255, .16);
  color: #8cc8ff;
  font-size: 11px;
  line-height: 18px;
}

.center-section-head {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 12px;
}
.center-section-head h2 { margin: 0; font-size: 17px; }
.center-inline-stats { display: flex; gap: 14px; margin-left: auto; color: var(--text-dim); font-size: 12px; }
.center-inline-stats b { color: var(--text); }
.text-btn { margin-left: auto; padding: 3px 0; border: 0; background: none; color: var(--accent); font-size: 13px; }
.text-btn:hover { color: #8cc8ff; text-decoration: underline; }

.overview-grid, .settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.account-info-card {
  padding: 17px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
}
.account-info-card h3 { margin: 0 0 12px; font-size: 15px; }
.account-info-card dl { margin: 0 0 15px; }
.account-info-card dl > div {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(45, 54, 68, .7);
}
.account-info-card dl > div:last-child { border-bottom: 0; }
.account-info-card dt { color: var(--text-dim); }
.account-info-card dd { max-width: 65%; margin: 0; color: var(--text); overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; }

.settings-note { margin: 12px 0 0; color: var(--text-dim); font-size: 12px; }
.password-form { display: flex; flex-direction: column; gap: 11px; }
.password-form label { display: flex; flex-direction: column; gap: 5px; color: var(--text-dim); font-size: 12px; }
.password-form input {
  width: 100%;
  min-height: 36px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  outline: 0;
  background: var(--bg);
  color: var(--text);
}
.password-form input:focus { border-color: var(--accent); }
.password-form .btn-primary { align-self: flex-start; margin-top: 2px; }

.empty-block.compact { min-height: 96px; display: grid; place-items: center; }
.table-scroll { overflow-x: auto; }

@media (max-width: 760px) {
  .profile-hero { gap: 12px; padding: 15px; }
  .profile-avatar { flex-basis: 44px; width: 44px; height: 44px; font-size: 15px; }
  .profile-name { font-size: 17px; }
  .profile-meta { font-size: 11px; }
  .profile-credit { padding-left: 10px; }
  .profile-credit b { font-size: 21px; }
  .user-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .user-kpi { padding: 12px; }
  .user-kpi b { font-size: 19px; }
  .center-section-head { flex-wrap: wrap; }
  .center-inline-stats { width: 100%; margin-left: 0; gap: 9px; flex-wrap: wrap; }
  .overview-grid, .settings-grid { grid-template-columns: 1fr; gap: 10px; }
  .user-tabs { overflow-x: auto; flex-wrap: nowrap; padding-bottom: 2px; }
  .user-tabs button { white-space: nowrap; }
}

@media (max-width: 420px) {
  .profile-hero { align-items: flex-start; flex-wrap: wrap; }
  .profile-credit { align-items: flex-start; width: 100%; margin-left: 56px; padding: 8px 0 0; border-top: 1px solid var(--border); border-left: 0; }
  .profile-credit b { font-size: 23px; }
}

/* ---------- 个人中心结束 ---------- */

/* ---------- 赛事搜索与收藏 ---------- */
.match-filter-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.match-search {
  position: relative;
  min-width: 190px;
}
.match-search input {
  width: 100%;
  height: 34px;
  padding: 7px 28px 7px 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  outline: 0;
  background: var(--bg);
  color: var(--text);
}
.match-search input:focus { border-color: var(--accent); }
.match-search input::placeholder { color: var(--text-mute); }
.search-clear {
  position: absolute;
  top: 4px;
  right: 4px;
  width: 26px;
  height: 26px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--text-dim);
  font-size: 18px;
  line-height: 1;
}
.search-clear:hover { background: var(--bg-hover); color: var(--text); }
.favorite-only-toggle {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--bg-card);
  color: var(--text-dim);
  font-size: 12px;
}
.favorite-only-toggle.active { border-color: rgba(210, 153, 34, .75); color: #f2cc60; background: rgba(210, 153, 34, .12); }
.favorite-only-toggle:disabled { cursor: not-allowed; opacity: .55; }
.favorite-btn {
  display: inline-grid;
  place-items: center;
  width: 22px;
  height: 22px;
  margin: 2px 0 0;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--text-mute);
  font-size: 18px;
  line-height: 1;
}
.favorite-btn:hover { color: #f2cc60; background: rgba(210, 153, 34, .1); }
.favorite-btn.active { color: #f2cc60; }
.favorite-btn.league-favorite { width: 24px; height: 24px; margin: 0 0 0 4px; }
.favorite-btn:disabled { cursor: wait; opacity: .55; }
.filter-result-note { margin: -3px 0 12px; color: var(--text-dim); font-size: 12px; }

@media (max-width: 760px) {
  .match-filter-bar { width: 100%; }
  .match-search { flex: 1 1 150px; min-width: 0; }
  .match-filter-bar select { flex: 1 1 130px; min-width: 0; }
  .favorite-only-toggle { flex: 0 0 auto; }
}

/* ---------- 合买互动、排行与评论 ---------- */
.plan-social {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 9px 0 2px;
}
.social-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 27px;
  padding: 3px 8px;
  border: 1px solid transparent;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-dim);
  font-size: 12px;
}
.social-btn:hover { border-color: var(--border); background: var(--bg-hover); color: var(--text); }
.social-btn.active { border-color: rgba(210, 153, 34, .6); color: #f2cc60; background: rgba(210, 153, 34, .1); }
.social-btn span { color: inherit; font-variant-numeric: tabular-nums; }
.social-btn:disabled { cursor: wait; opacity: .55; }

.ranking-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
  margin: 14px 0 18px;
}
.ranking-card {
  min-width: 0;
  padding: 14px 15px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--bg-card);
}
.ranking-card h3 { display: flex; align-items: baseline; gap: 8px; margin: 0 0 10px; font-size: 15px; }
.ranking-card h3 span { color: var(--text-dim); font-size: 11px; font-weight: 400; }
.ranking-list { margin: 0; padding: 0; list-style: none; }
.ranking-list li {
  display: grid;
  grid-template-columns: 22px minmax(60px, 1fr) minmax(95px, 1.4fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 29px;
  border-top: 1px solid rgba(45, 54, 68, .65);
  font-size: 12px;
}
.ranking-list li:first-child { border-top: 0; }
.rank-no { color: var(--text-mute); text-align: center; font-weight: 700; }
.rank-no.top1 { color: #f2cc60; }.rank-no.top2 { color: #c9d1d9; }.rank-no.top3 { color: #d29962; }
.rank-user { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.rank-meta { overflow: hidden; color: var(--text-dim); text-overflow: ellipsis; white-space: nowrap; }
.ranking-list b { font-variant-numeric: tabular-nums; text-align: right; }
.rank-empty { padding: 11px 0; color: var(--text-dim); font-size: 12px; text-align: center; }
.rank-pager { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 10px; }
.rank-pager button {
  min-width: 28px; padding: 3px 8px; border-radius: 6px; cursor: pointer;
  border: 1px solid var(--border, #2a3040); background: transparent;
  color: var(--text-dim); font-size: 12px; line-height: 1.4;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.rank-pager button:hover { border-color: var(--accent, #4a7dff); color: var(--text); }
.rank-pager button.active {
  background: var(--accent, #4a7dff); border-color: var(--accent, #4a7dff);
  color: #fff; font-weight: 600;
}

.detail-social-actions { display: flex; gap: 6px; margin-top: 10px; }
.comment-section { margin: 20px 0; }
.comment-section .sub-title { display: flex; align-items: center; gap: 6px; }
.comment-section .count { padding: 1px 6px; border-radius: 99px; background: var(--bg-hover); color: var(--text-dim); font-size: 12px; font-weight: 400; }
.comment-list { border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; }
.comment-item { padding: 10px 12px; border-top: 1px solid var(--border); background: var(--bg-card); }
.comment-item:first-child { border-top: 0; }
.comment-meta { display: flex; align-items: center; gap: 7px; color: var(--text-dim); font-size: 12px; }
.comment-meta b { color: var(--text); }.comment-meta span { margin-left: auto; color: var(--text-mute); }
.comment-item p { margin: 5px 0 0; white-space: pre-wrap; word-break: break-word; }
.empty-comment, .comment-restricted, .comment-login { padding: 13px; border: 1px dashed var(--border); border-radius: var(--radius-sm); color: var(--text-dim); font-size: 13px; text-align: center; }
.comment-restricted { color: #d29922; background: rgba(210, 153, 34, .06); }
.comment-login { display: flex; align-items: center; justify-content: center; gap: 8px; }
.comment-form { margin-top: 10px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-soft); }
.comment-form textarea { display: block; width: 100%; min-height: 72px; resize: vertical; padding: 8px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); outline: none; background: var(--bg); color: var(--text); font: inherit; }
.comment-form textarea:focus { border-color: var(--accent); }
.comment-form > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; font-size: 11px; }

@media (max-width: 760px) {
  .ranking-grid { grid-template-columns: 1fr; gap: 8px; }
  .ranking-list li { grid-template-columns: 20px minmax(55px, 1fr) auto; gap: 5px; }
  .ranking-list .rank-meta { display: none; }
  .plan-social { flex-wrap: wrap; }
  .comment-form > div { align-items: flex-start; flex-direction: column; }
  .comment-form > div .btn-primary { align-self: flex-end; }
}

/* ---------- 串关模拟器 ---------- */
.gb-submit-actions { display: flex; align-items: center; gap: 8px; }
.parlay-leg-list { margin: 14px 0; border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; }
.parlay-leg { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-top: 1px solid var(--border); background: var(--bg-card); }
.parlay-leg:first-child { border-top: 0; }
.parlay-leg > div { min-width: 0; }.parlay-leg > div:first-child { display: grid; gap: 3px; }
.parlay-leg b { font-size: 13px; }.parlay-leg span { overflow: hidden; color: var(--text-dim); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.parlay-leg > div:last-child { display: flex; align-items: center; flex: 0 0 auto; gap: 8px; }
.parlay-calc { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--border); }
.parlay-calc > div, .parlay-calc > label { display: flex; flex-direction: column; gap: 3px; min-height: 58px; padding: 9px 11px; background: var(--bg-soft); color: var(--text-dim); font-size: 12px; }
.parlay-calc b { color: var(--text); font-size: 15px; }.parlay-calc input { width: 100%; border: 1px solid var(--border); border-radius: 4px; background: var(--bg); color: var(--text); padding: 4px 6px; }
.parlay-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; color: var(--text-dim); font-size: 11px; }

@media (max-width: 760px) {
  .gb-submit-row { align-items: flex-start; flex-direction: column; }.gb-submit-actions { width: 100%; }.gb-submit-actions > * { flex: 1; }
  .parlay-calc { grid-template-columns: 1fr 1fr; }.parlay-foot { align-items: flex-start; flex-direction: column; }
  .parlay-leg { align-items: flex-start; flex-direction: column; }.parlay-leg > div:last-child { width: 100%; justify-content: space-between; }
}

/* ---------- 赔率分析与异动提醒 ---------- */
.modal.modal-odds .modal-panel { width: min(900px, calc(100vw - 28px)); }
.gb-entry-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.odds-modal, .alert-modal { display: grid; gap: 14px; }.odds-modal .detail-head, .alert-modal .detail-head { padding-right: 34px; }
.odds-controls { display: flex; flex-wrap: wrap; gap: 10px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-soft); }
.odds-controls label { display: flex; align-items: center; gap: 7px; color: var(--text-dim); font-size: 12px; }.odds-controls select, .alert-form input, .alert-form select { border: 1px solid var(--border); border-radius: 5px; background: var(--bg); color: var(--text); padding: 6px 8px; }
.odds-analysis-section { padding: 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-card); }.odds-analysis-section h3 { display: flex; align-items: baseline; gap: 8px; margin: 0 0 10px; font-size: 14px; }.odds-analysis-section h3 small { color: var(--text-dim); font-size: 12px; font-weight: 400; }
.odds-chart-wrap { overflow: hidden; }.odds-chart-legend { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; color: var(--text-dim); font-size: 12px; }.odds-chart-legend span { display: inline-flex; align-items: center; gap: 4px; }.odds-chart-legend i { width: 9px; height: 9px; border-radius: 99px; }.odds-chart-legend em { margin-left: auto; font-style: normal; }
.odds-chart { display: block; width: 100%; height: 200px; border-radius: 5px; background: var(--bg-soft); }.odds-grid { stroke: var(--border); stroke-width: 1; }.odds-axis { fill: var(--text-dim); font-size: 10px; }.odds-line { fill: none; stroke-width: 2.25; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.odds-compare tr[data-odds-company] { cursor: pointer; }.odds-compare tr.selected { outline: 1px solid var(--blue); background: color-mix(in srgb, var(--blue) 8%, transparent); }.odds-delta { margin-left: 3px; color: var(--text-dim); font-size: 10px; }
.alert-explain { margin: 0; padding: 9px 10px; border-left: 3px solid var(--blue); border-radius: 3px; background: var(--bg-soft); color: var(--text-dim); font-size: 12px; line-height: 1.55; }.alert-form { display: grid; gap: 12px; }.alert-form > label { display: grid; gap: 6px; font-size: 12px; color: var(--text-dim); }.alert-form .gb-grid label { display: grid; gap: 6px; font-size: 12px; color: var(--text-dim); }
.alert-list { display: grid; gap: 8px; }.alert-card { display: grid; grid-template-columns: minmax(180px, 1fr) auto auto; align-items: center; gap: 12px; padding: 11px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-card); }.alert-card > div:first-child { display: grid; gap: 4px; }.alert-card b { font-size: 13px; }.alert-card span { color: var(--text-dim); font-size: 12px; }.alert-values { display: flex; flex-wrap: wrap; gap: 8px; color: var(--text-dim); font-size: 12px; }.alert-values strong { font-size: 13px; }.alert-status { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }.alert-status em { padding: 3px 6px; border-radius: 4px; background: var(--bg-soft); color: var(--text-dim); font-size: 11px; font-style: normal; white-space: nowrap; }.alert-status .state-active { color: #1976d2; }.alert-status .state-triggered { color: var(--green); }.alert-status .state-cancelled { color: var(--text-dim); }

@media (max-width: 760px) {
  .gb-entry-head { align-items: flex-start; flex-direction: column; }.gb-entry-actions { justify-content: flex-start; }
  .odds-controls { display: grid; grid-template-columns: 1fr; }.odds-controls label { justify-content: space-between; }.odds-controls select { min-width: 175px; }
  .odds-chart { height: 160px; }.alert-card { grid-template-columns: 1fr; gap: 7px; }.alert-status { justify-content: flex-start; }
}

/* ---------- 后台运营增强 ---------- */
.admin-search-form { margin-top: 10px; }.admin-search-form .tool-field input { min-width: 190px; }.admin-kpis .gb-stat { min-width: 100px; }.admin-trend-card { margin: 12px 0 18px; padding: 13px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-card); }.admin-trend-card .center-section-head { margin-bottom: 4px; }.admin-trend-bars { display: grid; grid-template-columns: repeat(7, minmax(46px, 1fr)); gap: 8px; align-items: end; min-height: 138px; padding: 5px 4px 0; }.admin-trend-day { display: grid; grid-template-rows: 86px auto auto auto; justify-items: center; gap: 3px; min-width: 0; }.admin-trend-stacks { display: flex; align-items: flex-end; justify-content: center; gap: 4px; width: 100%; height: 86px; border-bottom: 1px solid var(--border); }.admin-trend-stacks i { display: block; width: min(16px, 38%); min-height: 3px; border-radius: 4px 4px 0 0; }.admin-trend-stacks .new-users, .admin-trend-legend .new-users { background: var(--blue); }.admin-trend-stacks .new-plans, .admin-trend-legend .new-plans { background: var(--green); }.admin-trend-day b { font-size: 11px; color: var(--text); }.admin-trend-day small, .admin-trend-day em { overflow: hidden; max-width: 100%; color: var(--text-dim); font-size: 10px; white-space: nowrap; text-overflow: ellipsis; font-style: normal; }.admin-trend-legend { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 9px; color: var(--text-dim); font-size: 11px; }.admin-trend-legend span { display: inline-flex; align-items: center; gap: 4px; }.admin-trend-legend i { width: 9px; height: 9px; border-radius: 2px; }
@media (max-width: 760px) { .admin-search-form .tool-field input { min-width: 140px; }.admin-trend-bars { gap: 3px; }.admin-trend-day { min-width: 34px; }.admin-trend-day em { display: none; } }

/* ---------- 安全验证与公告运营 ---------- */
.auth-forgot { width: 100%; margin-top: -2px; text-align: center; }.auth-msg.success { border-color: var(--green); color: var(--green); }.announcement-strip { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--border); background: var(--bg-soft); }.announcement-inner { display: flex; align-items: center; gap: 14px; min-height: 38px; padding-top: 7px; padding-bottom: 7px; }.announcement-inner > div:first-child { display: flex; flex: 1; flex-wrap: wrap; align-items: baseline; gap: 8px; min-width: 0; }.announcement-inner b { font-size: 13px; }.announcement-inner span { overflow: hidden; color: var(--text-dim); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }.announcement-actions { display: flex; align-items: center; gap: 4px; }.announcement-inner.level-success { border-left: 3px solid var(--green); }.announcement-inner.level-warning { border-left: 3px solid #d9a441; }.announcement-inner.level-danger { border-left: 3px solid var(--red); }.announcement-preview { max-width: 360px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 760px) { .announcement-inner { align-items: flex-start; }.announcement-inner > div:first-child { display: grid; gap: 2px; }.announcement-inner span { white-space: normal; }.announcement-preview { max-width: 190px; } }

/* ---------- 移动端赔率格式切换 ---------- */
.mobile-format-bar { display: none; }

/* ---------- 第 8 项：主题、移动导航与反馈体验 ---------- */
:root { --green: var(--down); --red: var(--up); }
:root[data-theme="light"] {
  --bg: #f5f7fb; --bg-soft: #ffffff; --bg-card: #ffffff; --bg-hover: #eef4ff; --border: #d9e1ee;
  --text: #172033; --text-dim: #5f6d82; --text-mute: #8491a3; --accent: #1f6feb; --accent-dim: #1f6feb;
  --up: #cf3f38; --down: #167b45; --live: #d63d36; --warn: #9c6600; --home: #136ad5; --away: #cf463e;
  --shadow: 0 7px 20px rgba(35, 51, 77, .12);
}
html { background: var(--bg); color-scheme: dark; }
:root[data-theme="light"] { color-scheme: light; }
html, body, .topbar, .footer, .league-group, .stat-card, .modal-panel, .plan-card, .user-menu, .announcement-strip { transition: background-color .18s ease, border-color .18s ease, color .18s ease; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.theme-toggle { font-size: 16px; }
.mobile-bottom-nav { display: none; }
.skeleton-loading { display: grid; align-content: start; gap: 16px; width: 100%; max-width: 1080px; padding: 22px 0; text-align: left; }.skeleton-loading p { justify-self: center; margin: 2px 0; color: var(--text-dim); }.skeleton-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }.skeleton-summary i, .skeleton-list i { display: block; border-radius: var(--radius-sm); background: linear-gradient(90deg, var(--bg-card) 20%, var(--bg-hover) 38%, var(--bg-card) 60%); background-size: 200% 100%; animation: skeleton-shimmer 1.25s infinite linear; }.skeleton-summary i { height: 75px; }.skeleton-list { display: grid; gap: 7px; padding: 14px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--bg-soft); }.skeleton-list i { height: 31px; }.skeleton-list i:nth-child(2) { width: 93%; }.skeleton-list i:nth-child(3) { width: 96%; }.skeleton-list i:nth-child(4) { width: 88%; }.skeleton-list i:nth-child(5) { width: 91%; }@keyframes skeleton-shimmer { to { background-position: -200% 0; } }
.empty-block { display: grid; justify-items: center; gap: 5px; padding: 46px 18px; text-align: center; }.empty-block .icon { display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid var(--border); border-radius: 50%; background: var(--bg-hover); font-size: 23px; }.empty-block h3 { margin: 7px 0 0; font-size: 15px; }.empty-block p { margin: 0; }.empty-block .empty-tip { color: var(--text-mute); font-size: 12px; }
@media (max-width: 760px) {
  body { padding-bottom: 66px; }.mobile-format-bar { display: flex; align-items: center; gap: 9px; min-height: 41px; padding: 6px 12px; border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); background: var(--bg-soft); }.mobile-format-bar label { flex: 0 0 auto; color: var(--text-dim); font-size: 12px; font-weight: 700; }.mobile-format-bar select { width: min(220px, calc(100vw - 86px)); min-height: 29px; padding: 4px 28px 4px 9px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--bg-card); color: var(--text); font-size: 12px; }.announcement-modal-backdrop { align-items: end; padding: 12px; }.announcement-modal { width: 100%; max-height: calc(100vh - 84px); padding: 25px 19px 18px; border-radius: 11px; }.announcement-modal h2 { font-size: 18px; }.announcement-modal-content { margin-bottom: 17px; font-size: 13px; }.info-page { padding: 19px 0 30px; }.info-hero { gap: 12px; padding: 17px; }.info-hero-icon { width: 37px; height: 37px; font-size: 13px; }.info-grid { grid-template-columns: 1fr; gap: 10px; }.info-card { min-height: 0; padding: 18px 16px; }.info-card p { font-size: 12px; }.topbar-inner { gap: 8px; }.footer { margin-top: 28px; }.footer-age-inner { align-items: flex-start; gap: 10px; padding-top: 12px; padding-bottom: 12px; }.footer-age-mark { width: 35px; height: 35px; font-size: 11px; }.footer-age-copy { padding-top: 1px; }.footer-age-copy span { line-height: 1.45; }.footer-age-link { margin-top: 2px; padding: 6px 8px; white-space: nowrap; }.footer-main { padding: 18px 0 15px; }.footer-grid { grid-template-columns: 1fr 1fr; gap: 24px 18px; }.footer-help-column { grid-column: 1 / -1; padding: 16px 0 0; border-top: 1px solid var(--border); border-left: 0; }.footer-virtual-note { align-items: flex-start; }.footer-virtual-note p { line-height: 1.5; }.footer-sync { display: none; }.footer-policy-inner { flex-direction: column; align-items: flex-start; justify-content: center; gap: 7px; padding-top: 10px; padding-bottom: 10px; line-height: 1.45; }.footer-policy-links { justify-content: flex-start; }.footer-policy-links a { padding: 0 8px; }.topbar-inner { gap: 8px; }.brand-text { display: none; }.topbar-tools { gap: 5px; }.topbar-tools .tool-field { display: none; }.theme-toggle { display: inline-flex; }.mainnav { padding-bottom: 72px; }.mobile-bottom-nav { position: fixed; inset: auto 0 0; z-index: 70; display: grid; grid-template-columns: repeat(5, 1fr); min-height: 61px; padding: 5px env(safe-area-inset-right) calc(5px + env(safe-area-inset-bottom)) env(safe-area-inset-left); border-top: 1px solid var(--border); background: color-mix(in srgb, var(--bg-soft) 94%, transparent); box-shadow: 0 -5px 18px rgba(0,0,0,.1); backdrop-filter: blur(10px); }.mobile-bottom-nav a { display: grid; place-items: center; gap: 1px; min-width: 0; color: var(--text-mute); font-size: 18px; }.mobile-bottom-nav small { font-size: 10px; }.mobile-bottom-nav a.active { color: var(--accent); font-weight: 700; }.mobile-bottom-nav a.active span { transform: translateY(-1px); }.footer { padding-bottom: 10px; }.skeleton-summary { grid-template-columns: repeat(2, 1fr); }.skeleton-summary i { height: 58px; }.skeleton-loading { padding: 12px 0; }.announcement-strip { top: 124px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }

/* ---------- 用户端国际化 ---------- */
.language-field select { min-width: 105px; }
.language-field[hidden] { display: none !important; }
:root[data-language="de"] .mainnav a, :root[data-language="es"] .mainnav a, :root[data-language="pt"] .mainnav a { white-space: nowrap; }
@media (max-width: 760px) {
  .topbar-tools .language-field { display: inline-flex; }
  .language-field > span { display: none; }
  .language-field select { min-width: 64px; max-width: 70px; padding-left: 5px; padding-right: 3px; font-size: 11px; }
  .topbar-tools .odds-format-field { display: none; }
}


/* ---------- 代理 / 业务员工作台 ---------- */
.staff-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.staff-kpis { margin: 0 0 18px; }
.staff-table td { vertical-align: middle; }
.role-pill { display: inline-flex; align-items: center; border-radius: 999px; padding: 3px 8px; font-size: 12px; line-height: 1.2; white-space: nowrap; background: var(--bg-soft); color: var(--text-dim); border: 1px solid var(--border); }
.role-super_admin { color: #a36bff; border-color: rgba(163,107,255,.42); background: rgba(163,107,255,.1); }
.role-agent { color: var(--accent); border-color: rgba(47,129,247,.42); background: rgba(47,129,247,.1); }
.role-salesperson { color: #23b58a; border-color: rgba(35,181,138,.42); background: rgba(35,181,138,.1); }
.role-user { color: var(--text-dim); }
.status-danger { color: var(--up); }
.promotion-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 14px; }
.promotion-card { border: 1px solid var(--border); background: var(--bg-card); border-radius: 12px; padding: 15px; box-shadow: var(--shadow); }
.promotion-card.inactive { opacity: .62; }
.promotion-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; }
.promo-code { display: inline-block; margin: 9px 0 5px; padding: 5px 9px; border-radius: 6px; letter-spacing: .08em; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-weight: 800; color: var(--accent); background: var(--bg-soft); }
.promotion-link { display: flex; gap: 6px; align-items: center; margin-top: 10px; }
.promotion-link input { min-width: 0; flex: 1; height: 31px; font-size: 11px; border: 1px solid var(--border); border-radius: 6px; background: var(--bg-soft); color: var(--text-dim); padding: 0 7px; }
@media (max-width: 700px) {
  .page-head:has(.staff-actions) { align-items: flex-start; }
  .staff-actions { width: 100%; }
  .staff-actions .btn-sm { flex: 1; }
  .staff-table { min-width: 760px; }
  .promotion-grid { grid-template-columns: 1fr; }
}

/* 今日与早盘赛事使用浏览器本地时区；显式标注当前时区，避免跨地区用户误解开赛时间。 */
.timezone-note{display:inline-flex;align-items:center;max-width:100%;margin:8px 0 0;padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:color-mix(in srgb,var(--bg-card) 82%,var(--accent) 18%);color:var(--text-dim);font-size:12px;line-height:1.35}.timezone-note::before{content:'◷';margin-right:6px;color:var(--accent);font-size:14px}.cell-time .time{cursor:help}@media(max-width:640px){.timezone-note{margin-top:7px;white-space:normal;border-radius:9px}.timezone-note::before{flex:0 0 auto}}

/* 个人中心、订单与积分流水时间按浏览器当地时区显示。 */
time.local-time{font-variant-numeric:tabular-nums;cursor:help;white-space:nowrap}.profile-timezone-note{margin:12px 0 4px}.data-table time.local-time{font-size:12px}@media(max-width:640px){.profile-timezone-note{display:flex;margin-top:10px}.data-table time.local-time{font-size:11px}}

/* 个人虚拟积分单注 */
.single-bet-form{margin-top:10px;border-color:color-mix(in srgb,var(--accent) 45%,var(--border))}.single-bet-form .form-disclaimer{margin:0;color:var(--text-dim);font-size:12px;line-height:1.55}.single-bet-table td{vertical-align:top}.single-bet-table .plan-status{display:inline-block}@media(max-width:640px){.gb-entry-actions{gap:6px}.single-bet-form{padding:12px}.single-bet-table{min-width:720px}}

/* ---------- 滚球实时数据新鲜度 ---------- */
.live-stale-notice {
  margin: 10px 0 12px;
  padding: 10px 12px;
  border: 1px solid color-mix(in srgb, var(--warn) 55%, var(--border));
  border-left: 3px solid var(--warn);
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--warn) 10%, transparent);
  color: var(--text-dim);
  font-size: 13px;
  line-height: 1.55;
}
@media (max-width: 640px) {
  .live-stale-notice { margin: 8px 0 10px; padding: 9px 10px; font-size: 12px; }
}

/* ============================================================
   手机端滚球盘口卡片布局
   仅在 /live 导航激活且视口不超过 720px 时生效；保留原有 HTML、数据与下单逻辑。
   ============================================================ */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app {
    padding-left: 6px;
    padding-right: 6px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .page-head {
    margin: 12px 4px 8px;
    gap: 8px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .page-title {
    font-size: 18px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .hint-row {
    margin: 0 4px 9px;
    padding: 7px 9px;
    border-radius: 7px;
    background: rgba(255,255,255,.025);
    color: var(--text-mute);
    font-size: 11px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-group {
    overflow: hidden;
    margin: 0 0 11px;
    border: 1px solid color-mix(in srgb, var(--border) 88%, #fff 12%);
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(0,0,0,.05));
    box-shadow: 0 5px 16px rgba(0,0,0,.16);
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar {
    min-height: 40px;
    padding: 8px 10px;
    border-bottom: 1px solid var(--border);
    background: rgba(255,255,255,.025);
    font-size: 13px;
    font-weight: 700;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar .league-flag {
    width: 3px;
    height: 17px;
    border-radius: 99px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar .cnt {
    margin-left: 3px;
    color: var(--text-mute);
    font-size: 11px;
    font-weight: 600;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar .league-favorite {
    margin-left: auto;
  }

  /* 表头和每一场比赛共用同一列轨道：时间 / 对阵 / 比分 / 三项全场主盘口。 */
  body:has(.mainnav a[data-nav="live"].active) #app .match-table {
    display: block;
    width: 100%;
    table-layout: auto;
    border-collapse: separate;
    border-spacing: 0;
    background: transparent;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody {
    display: block;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    display: grid;
    grid-template-columns: 38px minmax(72px, 1fr) 38px repeat(3, minmax(0, 1fr));
    column-gap: 3px;
    align-items: stretch;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr {
    min-height: 28px;
    padding: 0 6px;
    border-bottom: 1px solid rgba(255,255,255,.06);
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead th {
    display: block;
    min-width: 0;
    padding: 7px 1px 5px;
    border: 0;
    background: transparent;
    color: var(--text-dim);
    font-size: 10px;
    font-weight: 650;
    line-height: 1.2;
    text-align: center;
    white-space: normal;
  }

  /* 不重复显示时间、队伍、比分三个表头，让三项盘口标题成为视觉焦点。 */
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead th:nth-child(-n+3) {
    color: transparent;
    user-select: none;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    min-height: 78px;
    padding: 5px 6px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.055);
    background: transparent;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr:last-child {
    border-bottom: 0;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr:hover {
    background: rgba(255,255,255,.025);
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table td {
    display: flex;
    min-width: 0;
    padding: 0;
    border: 0;
    align-items: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table .cell-corner,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-corner,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .half-col,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-half {
    display: none !important;
  }

  /* 旧样式在窄屏隐藏独赢；新版手机滚球需要三项完整主盘口，因此只在此视觉范围恢复。 */
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-eu,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .odds-cell.eu-col {
    display: flex !important;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-eu {
    display: block !important;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-time {
    width: auto;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    gap: 1px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .time {
    color: var(--text-dim);
    font-size: 10px;
    line-height: 1.2;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .status {
    margin: 0;
    font-size: 10px;
    line-height: 1.2;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .favorite-btn {
    margin-top: 2px;
    transform: scale(.8);
    transform-origin: left center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams {
    width: auto;
    min-width: 0;
    align-items: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-row {
    width: 100%;
    min-width: 0;
    line-height: 1.75;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    font-size: 12px;
    font-weight: 600;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score {
    width: auto;
    justify-content: center;
    flex-direction: column;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .score-main {
    font-size: 16px;
    line-height: 1.1;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .score-half {
    margin-top: 3px;
    font-size: 9px;
    white-space: nowrap;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-cell {
    width: auto;
    min-width: 0;
    align-items: stretch;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-trio {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: minmax(20px, auto);
    width: 100%;
    gap: 2px;
    align-content: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-box {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 20px;
    padding: 2px 3px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 4px;
    background: rgba(255,255,255,.045);
    font-size: 10px;
    line-height: 1.15;
    white-space: nowrap;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-box.line {
    background: rgba(47,129,247,.16);
    color: #9bcaff;
    font-weight: 700;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-box.empty {
    background: rgba(255,255,255,.018);
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-none {
    width: 100%;
    padding: 7px 1px;
    border-radius: 4px;
    background: rgba(255,255,255,.025);
    font-size: 10px;
    text-align: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .handi-side {
    display: none;
  }
}

@media (max-width: 375px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 34px minmax(64px, 1fr) 34px repeat(3, minmax(0, 1fr));
    column-gap: 2px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    padding-left: 4px;
    padding-right: 4px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-box,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-none {
    font-size: 9px;
  }
}

/* 手机端滚球：主客队名与主客比分逐行对应，不影响桌面比分展示。 */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams {
    display: grid;
    grid-template-rows: repeat(2, minmax(21px, 1fr));
    align-content: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row {
    min-height: 21px;
    align-self: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score {
    justify-content: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-main {
    display: grid;
    grid-template-rows: repeat(2, minmax(21px, 1fr));
    width: 100%;
    min-height: 42px;
    line-height: 1;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-home,
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-away {
    display: flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-divider,
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-half {
    display: none;
  }
}

/* 手机端滚球：优先保障两队名称可读，适度压缩三项盘口的列宽。 */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 32px minmax(112px, 1.85fr) 34px repeat(3, minmax(0, .72fr));
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    white-space: normal;
    text-overflow: clip;
    line-height: 1.28;
    overflow-wrap: anywhere;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row {
    align-items: center;
  }
}

@media (max-width: 375px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 30px minmax(98px, 1.75fr) 32px repeat(3, minmax(0, .72fr));
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    font-size: 11px;
  }
}

/* 手机端滚球：主、客队各自拥有独立的两行高度，避免较长主队名称挤掉客队。 */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 28px minmax(138px, 1fr) 26px repeat(3, minmax(34px, .46fr));
    column-gap: 3px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    min-height: 74px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams {
    grid-template-rows: 32px 32px;
    min-height: 64px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row {
    height: 32px;
    min-height: 32px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    max-height: 30px;
    font-size: 11px;
    line-height: 1.28;
    -webkit-line-clamp: 2;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-main {
    grid-template-rows: 32px 32px;
    min-height: 64px;
  }
}

@media (max-width: 375px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 27px minmax(128px, 1fr) 25px repeat(3, minmax(32px, .44fr));
    column-gap: 2px;
  }
}

/* 手机端滚球：参考紧凑比分板，时间 / 宽队名双行 / 主客比分，优先保证两队名称一行可读。 */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 29px minmax(150px, 1fr) 25px repeat(3, minmax(30px, .38fr));
    column-gap: 2px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams {
    grid-template-rows: 27px 27px;
    min-height: 54px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row {
    height: 27px;
    min-height: 27px;
    gap: 2px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    display: block;
    min-width: 0;
    max-height: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
    font-weight: 650;
    line-height: 27px;
    -webkit-line-clamp: unset;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-main {
    grid-template-rows: 27px 27px;
    min-height: 54px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-home,
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-away {
    justify-content: flex-end;
    padding-right: 1px;
    font-size: 15px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .time,
  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .status {
    font-size: 9px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-box,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-none {
    padding-left: 1px;
    padding-right: 1px;
    font-size: 9px;
  }
}

@media (max-width: 375px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 27px minmax(140px, 1fr) 24px repeat(3, minmax(28px, .36fr));
  }

  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    font-size: 11px;
  }
}

/* 修复：td 的通用 flex 规则优先级较高；此处明确强制队名单元格为两行网格。 */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table td.cell-teams {
    display: grid !important;
    grid-template-rows: 27px 27px;
    grid-auto-flow: row;
    align-items: stretch;
    align-content: center;
    min-height: 54px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table td.cell-teams .team-row {
    display: flex;
    grid-column: 1;
    width: 100%;
    height: 27px;
    min-height: 27px;
    align-items: center;
    overflow: hidden;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table td.cell-teams .team-row:nth-child(1) { grid-row: 1; }
  body:has(.mainnav a[data-nav="live"].active) #app .match-table td.cell-teams .team-row:nth-child(2) { grid-row: 2; }
}

/* 每场实际主盘口机构覆盖：仅提示上游该场可用报价数量，不改变列表优先盘口来源。 */
.company-coverage {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-width: 26px;
  padding: 1px 4px;
  border: 1px solid rgba(96, 165, 250, .28);
  border-radius: 999px;
  color: #9bcaff;
  background: rgba(37, 99, 235, .10);
  font-size: 9px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  line-height: 1.2;
  white-space: nowrap;
}

@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app .company-coverage {
    font-size: 8px;
    padding: 1px 3px;
  }
}

/* 隐藏合买方案的跟单确认：站内弹窗固定在视口正中央，替代浏览器原生顶部确认框。 */
.modal.modal-follow-confirm {
  align-items: center !important;
  justify-content: center !important;
  padding: 18px;
}
.modal.modal-follow-confirm .modal-panel {
  width: min(440px, calc(100vw - 36px));
  max-height: min(560px, calc(100vh - 36px));
  margin: 0;
  transform: none;
}
.follow-confirm-card {
  display: grid;
  justify-items: center;
  gap: 13px;
  padding: 8px 4px 3px;
  text-align: center;
}
.follow-confirm-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(96, 165, 250, .38);
  border-radius: 50%;
  background: rgba(37, 99, 235, .13);
  font-size: 21px;
}
.follow-confirm-card h2 { margin: 0; color: var(--text); font-size: 19px; line-height: 1.35; }
.follow-confirm-card p { max-width: 360px; margin: 0; color: var(--text-dim); font-size: 13px; line-height: 1.62; }
.follow-confirm-card .follow-confirm-question { padding-top: 4px; color: var(--text); font-weight: 750; }
.follow-confirm-actions { display: flex; width: 100%; gap: 9px; padding-top: 5px; }
.follow-confirm-actions button { flex: 1; min-height: 39px; }
@media (max-width: 520px) {
  .modal.modal-follow-confirm { padding: 12px; }
  .modal.modal-follow-confirm .modal-panel { width: min(100%, calc(100vw - 24px)); max-height: calc(100vh - 24px); }
  .follow-confirm-card { gap: 11px; padding: 3px 0 0; }
  .follow-confirm-card h2 { font-size: 17px; }
  .follow-confirm-card p { font-size: 12px; }
}

/* 列表赔率框快捷个人下注 */
.odds-box.odds-quick {
  appearance: none;
  min-width: 0;
  border: 0;
  cursor: pointer;
  font: inherit;
  text-align: center;
  transition: transform .12s ease, box-shadow .12s ease, background-color .12s ease;
}
.odds-box.odds-quick:hover { background: color-mix(in srgb, var(--accent) 18%, var(--bg-hover)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--accent) 48%, transparent); }
.odds-box.odds-quick:active { transform: scale(.96); }
.odds-box.odds-quick:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }

.quick-bet-sheet { position: fixed; inset: 0; z-index: 260; display: flex; align-items: flex-end; justify-content: center; pointer-events: auto; }
.quick-bet-sheet[hidden] { display: none; }
.quick-bet-mask { position: absolute; inset: 0; background: rgba(2, 6, 18, .62); backdrop-filter: blur(2px); }
.quick-bet-panel { position: relative; z-index: 1; width: min(680px, calc(100vw - 28px)); max-height: min(78vh, 620px); overflow: auto; border: 1px solid var(--border); border-bottom: 0; border-radius: 16px 16px 0 0; background: var(--bg-soft); box-shadow: 0 -18px 48px rgba(0, 0, 0, .36); }
.quick-bet-card { position: relative; display: grid; gap: 11px; padding: 19px 22px 21px; }
.quick-bet-card h2 { margin: 0; padding-right: 28px; color: var(--text); font-size: 17px; line-height: 1.35; }
.quick-bet-card h2 span { color: var(--text-mute); font-size: 13px; font-weight: 500; }
.quick-bet-card p { margin: 0; }
.quick-bet-close { position: absolute; top: 12px; right: 13px; display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid var(--border); border-radius: 7px; background: var(--bg-card); color: var(--text-dim); font-size: 17px; line-height: 1; cursor: pointer; }
.quick-bet-close:hover { color: var(--text); border-color: var(--text-mute); }
.quick-bet-kicker { color: var(--accent); font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.quick-bet-league { color: var(--text-dim); font-size: 12px; }
.quick-bet-league b { color: var(--text-mute); font-weight: 650; }
.quick-bet-selection { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; padding: 11px 12px; border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--border)); border-radius: 9px; background: color-mix(in srgb, var(--accent) 8%, var(--bg-card)); }
.quick-bet-selection span { color: var(--text-mute); font-size: 11px; }
.quick-bet-selection b { min-width: 0; color: var(--text); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.quick-bet-selection em { color: var(--accent); font-size: 12px; font-style: normal; font-weight: 750; white-space: nowrap; }
.quick-bet-form label { display: grid; gap: 6px; color: var(--text-dim); font-size: 12px; font-weight: 700; }
.quick-bet-form input { min-height: 40px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-card); color: var(--text); padding: 8px 10px; font: inherit; }
.quick-bet-actions { display: flex; justify-content: flex-end; gap: 9px; padding-top: 2px; }
.quick-bet-actions button { min-width: 110px; min-height: 39px; }
.quick-bet-loading, .quick-bet-error { min-height: 150px; place-items: center; text-align: center; color: var(--text-dim); }
.quick-bet-error h2 { color: var(--text); }

@media (max-width: 760px) {
  .quick-bet-sheet { align-items: flex-end; padding-bottom: calc(61px + env(safe-area-inset-bottom)); }
  .quick-bet-panel { width: 100%; max-height: min(70vh, 560px); border-radius: 15px 15px 0 0; }
  .quick-bet-card { gap: 9px; padding: 17px 14px 16px; }
  .quick-bet-card h2 { font-size: 15px; }
  .quick-bet-selection { grid-template-columns: 1fr auto; gap: 4px 8px; padding: 9px 10px; }
  .quick-bet-selection span { grid-column: 1 / -1; }
  .quick-bet-selection b { font-size: 12px; }
  .quick-bet-selection em { font-size: 11px; }
  .quick-bet-actions { display: grid; grid-template-columns: 1fr 1.25fr; }
  .quick-bet-actions button { min-width: 0; }
}

/* ---------- ProvideSupport 移动端客服入口 ---------- */
.mobile-support-link { display: none; }
@media (max-width: 760px) {
  .mobile-format-bar .mobile-support-link {
    display: inline-flex;
    flex: 0 0 64px;
    align-items: center;
    justify-content: center;
    width: 64px;
    min-height: 42px;
    margin-left: auto;
    padding: 2px;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm);
    background: var(--bg-card);
    line-height: 0;
  }
  .mobile-format-bar .mobile-support-link:hover { border-color: var(--accent); background: var(--bg-hover); }
  .mobile-format-bar .mobile-support-link img { display: block; width: 56px; max-height: 36px; object-fit: contain; }
  .mobile-format-bar select { width: min(220px, calc(100vw - 170px)); }
}

/* 主脚本默认生成右下角浮动入口；仅保留平台指定的移动端顶部入口。 */
.psmtc_s5rx {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ============================================================
   手机端滚球紧凑赛事板（参考卡片布局）
   仅覆盖 /live 窄屏展示；不改变列表数据、赔率按钮、收藏、详情或底部导航逻辑。
   ============================================================ */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="live"].active) #app {
    padding: 0 6px calc(74px + env(safe-area-inset-bottom));
  }

  body:has(.mainnav a[data-nav="live"].active) #app .page-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    margin: 10px 4px 8px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .page-title {
    gap: 8px;
    font-size: 19px;
    line-height: 1.2;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .page-title .count {
    padding: 3px 8px;
    border-color: rgba(96, 165, 250, .24);
    background: rgba(96, 165, 250, .1);
    color: #a9cdfd;
    font-size: 11px;
  }

  /* 搜索、联赛筛选与收藏筛选保持可用，但采用手机端两列紧凑排布。 */
  body:has(.mainnav a[data-nav="live"].active) #app .match-filter-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    gap: 7px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-filter-bar .match-search,
  body:has(.mainnav a[data-nav="live"].active) #app .match-filter-bar select {
    width: 100%;
    min-width: 0;
    min-height: 33px;
    margin: 0;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-filter-bar .favorite-only-toggle {
    grid-column: 1 / -1;
    justify-self: start;
    min-height: 28px;
    padding: 4px 9px;
    font-size: 11px;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .hint-row {
    margin: 0 4px 8px;
    padding: 7px 9px;
    border-color: rgba(255,255,255,.06);
    border-left-color: rgba(47, 129, 247, .72);
    border-radius: 6px;
    background: rgba(255,255,255,.02);
    color: var(--text-mute);
    font-size: 11px;
    line-height: 1.45;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-group {
    margin: 0 0 9px;
    overflow: hidden;
    border-color: #303946;
    border-radius: 9px;
    background: #111720;
    box-shadow: none;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar {
    min-height: 39px;
    padding: 8px 10px;
    border-bottom-color: #303946;
    background: linear-gradient(90deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
    color: #e7edf5;
    font-size: 12px;
    font-weight: 750;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar .league-flag {
    width: 3px;
    height: 18px;
    box-shadow: 0 0 7px color-mix(in srgb, var(--lc, var(--accent)) 58%, transparent);
  }

  body:has(.mainnav a[data-nav="live"].active) #app .league-bar .cnt {
    margin-left: 2px;
    color: #788596;
    font-size: 10px;
  }

  /* 表头与比赛行使用统一六列：时间、队名、比分、让球、大小球、独赢。 */
  body:has(.mainnav a[data-nav="live"].active) #app .match-table,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody {
    display: block;
    width: 100%;
    table-layout: auto;
    background: transparent;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    display: grid;
    grid-template-columns: 32px minmax(112px, 1.8fr) 27px repeat(3, minmax(38px, .62fr));
    column-gap: 3px;
    align-items: stretch;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr {
    min-height: 29px;
    padding: 0 6px;
    border-bottom: 1px solid rgba(255,255,255,.075);
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead th {
    display: block;
    min-width: 0;
    padding: 8px 0 5px;
    border: 0;
    background: transparent;
    color: #a7b1be;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.1;
    text-align: center;
    white-space: nowrap;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead th:nth-child(-n+3) {
    color: transparent;
    user-select: none;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    min-height: 72px;
    padding: 5px 6px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.07);
    background: transparent;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr:last-child { border-bottom: 0; }
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr:hover { background: rgba(255,255,255,.024); }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table td {
    display: flex;
    min-width: 0;
    padding: 0;
    border: 0;
    align-items: center;
  }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table .cell-corner,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-corner,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .half-col,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-half { display: none !important; }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table .th-eu { display: block !important; }
  body:has(.mainnav a[data-nav="live"].active) #app .match-table .odds-cell.eu-col { display: flex !important; }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-time {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2px;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .time { color: #9ca9b9; font-size: 9px; line-height: 1; }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .status { margin: 0; color: #ff7d7a; font-size: 10px; font-weight: 750; line-height: 1; }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .company-coverage { display: none; }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-time .favorite-btn { margin-top: 1px; transform: scale(.76); transform-origin: left center; }

  body:has(.mainnav a[data-nav="live"].active) #app .match-table td.cell-teams {
    display: grid !important;
    grid-template-rows: 28px 28px;
    grid-auto-flow: row;
    align-content: center;
    min-height: 56px;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row {
    display: flex;
    grid-column: 1;
    width: 100%;
    min-width: 0;
    height: 28px;
    min-height: 28px;
    align-items: center;
    gap: 3px;
    overflow: hidden;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row:nth-child(1) { grid-row: 1; }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-teams .team-row:nth-child(2) { grid-row: 2; }
  body:has(.mainnav a[data-nav="live"].active) #app .team-name {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: #e6edf5;
    font-size: 12px;
    font-weight: 650;
    line-height: 28px;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .team-rank { display: none; }
  body:has(.mainnav a[data-nav="live"].active) #app .red-card { flex: 0 0 auto; transform: scale(.82); transform-origin: right center; }

  body:has(.mainnav a[data-nav="live"].active) #app .cell-score {
    flex-direction: column;
    justify-content: center;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-main {
    display: grid;
    grid-template-rows: 28px 28px;
    width: 100%;
    min-height: 56px;
    color: #f07178;
    font-size: 16px;
    line-height: 1;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-home,
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-away {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding-right: 1px;
    font-variant-numeric: tabular-nums;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-divider,
  body:has(.mainnav a[data-nav="live"].active) #app .cell-score .score-half { display: none; }

  body:has(.mainnav a[data-nav="live"].active) #app .odds-cell {
    width: auto;
    min-width: 0;
    align-items: stretch;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .odds-trio {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: 18px;
    width: 100%;
    gap: 2px;
    align-content: center;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .odds-box,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-none {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 18px;
    padding: 1px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 3px;
    background: rgba(255,255,255,.045);
    font-size: 9px;
    line-height: 1;
    white-space: nowrap;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .odds-box.line {
    background: rgba(32, 104, 190, .24);
    color: #a7d0ff;
    font-weight: 800;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-none {
    color: var(--text-mute);
    background: rgba(255,255,255,.025);
  }
  body:has(.mainnav a[data-nav="live"].active) #app .handi-side { display: none; }
}

@media (max-width: 375px) {
  body:has(.mainnav a[data-nav="live"].active) #app .match-table thead tr,
  body:has(.mainnav a[data-nav="live"].active) #app .match-table tbody tr {
    grid-template-columns: 29px minmax(103px, 1.72fr) 24px repeat(3, minmax(34px, .58fr));
    column-gap: 2px;
  }
  body:has(.mainnav a[data-nav="live"].active) #app .team-name { font-size: 11px; }
  body:has(.mainnav a[data-nav="live"].active) #app .odds-box,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="live"].active) #app .odds-none { font-size: 8px; }
}

/* ============================================================
   手机端主页 / 今日赛事 / 早盘独立赛事卡片
   使用现有表格和赔率按钮，仅在窄屏把每场比赛重排为信息头 + 三类全场主盘口。
   ============================================================ */
@media (max-width: 720px) {
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app {
    padding: 0 7px calc(78px + env(safe-area-inset-bottom));
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .page-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    margin: 10px 3px 8px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .page-title {
    font-size: 19px;
    line-height: 1.2;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .page-title .count {
    padding: 3px 8px;
    border-color: rgba(96, 165, 250, .24);
    background: rgba(96, 165, 250, .1);
    color: #a9cdfd;
    font-size: 11px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-filter-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    gap: 7px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-filter-bar .match-search,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-filter-bar select {
    width: 100%;
    min-width: 0;
    min-height: 33px;
    margin: 0;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-filter-bar .favorite-only-toggle {
    grid-column: 1 / -1;
    justify-self: start;
    min-height: 28px;
    padding: 4px 9px;
    font-size: 11px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .hint-row {
    margin: 0 3px 8px;
    padding: 7px 9px;
    border-color: rgba(255,255,255,.06);
    border-left-color: rgba(47, 129, 247, .72);
    border-radius: 6px;
    background: rgba(255,255,255,.02);
    color: var(--text-mute);
    font-size: 11px;
    line-height: 1.45;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .timezone-note {
    margin: 0 3px 8px;
    padding: 7px 10px;
    border-color: rgba(71, 139, 247, .3);
    background: linear-gradient(90deg, rgba(47,129,247,.18), rgba(47,129,247,.06));
    color: #a8bfdc;
    font-size: 11px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .league-group {
    overflow: hidden;
    margin: 0 0 10px;
    border-color: #303946;
    border-radius: 9px;
    background: #111720;
    box-shadow: none;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .league-bar {
    min-height: 39px;
    padding: 8px 10px;
    border-bottom-color: #303946;
    background: linear-gradient(90deg, rgba(255,255,255,.045), rgba(255,255,255,.015));
    color: #e7edf5;
    font-size: 12px;
    font-weight: 750;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .league-bar .league-flag {
    width: 3px;
    height: 18px;
    border-radius: 99px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .league-bar .cnt {
    margin-left: 2px;
    color: #788596;
    font-size: 10px;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .league-bar .league-favorite {
    margin-left: auto;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table thead,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table tbody {
    display: block;
    width: 100%;
    table-layout: auto;
    background: transparent;
  }

  /* 卡片内已由 data-mobile-market 标明盘口种类，因此隐藏桌面表头。 */
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table thead { display: none; }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table tbody tr {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-template-areas:
      "meta meta meta"
      "teams teams score"
      "europe handicap total";
    gap: 5px 8px;
    min-height: 0;
    padding: 10px;
    border: 0;
    border-bottom: 1px solid rgba(255,255,255,.075);
    background: transparent;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table tbody tr:last-child { border-bottom: 0; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table tbody tr:hover { background: rgba(255,255,255,.024); }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table td {
    display: flex;
    min-width: 0;
    padding: 0;
    border: 0;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table .cell-corner,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table .th-corner,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table .half-col,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table .th-half { display: none !important; }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-time {
    grid-area: meta;
    width: auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    min-height: 16px;
    color: var(--text-mute);
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-time .time {
    color: #a8b2bf;
    font-size: 10px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-time .status {
    margin: 0;
    color: #8490a0;
    font-size: 10px;
    line-height: 1;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-time .company-coverage { display: none; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-time .favorite-btn {
    margin-left: 1px;
    transform: scale(.82);
    transform-origin: left center;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .match-table td.cell-teams {
    grid-area: teams;
    display: grid !important;
    grid-template-rows: 27px 27px;
    grid-auto-flow: row;
    align-content: center;
    min-height: 54px;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-teams .team-row {
    display: flex;
    grid-column: 1;
    width: 100%;
    min-width: 0;
    height: 27px;
    min-height: 27px;
    align-items: center;
    gap: 3px;
    overflow: hidden;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-teams .team-row:nth-child(1) { grid-row: 1; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-teams .team-row:nth-child(2) { grid-row: 2; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .team-name {
    display: block;
    min-width: 0;
    overflow: hidden;
    color: #edf2f7;
    font-size: 14px;
    font-weight: 760;
    line-height: 27px;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .team-rank { display: none; }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-score {
    grid-area: score;
    width: auto;
    align-items: center;
    justify-content: center;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-score .score-main {
    color: #dbe5f0;
    font-size: 16px;
    font-weight: 800;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .cell-score .score-half { display: none; }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-cell {
    position: relative;
    width: auto;
    min-width: 0;
    display: block;
    padding-top: 20px !important;
    border-top: 1px solid rgba(255,255,255,.09) !important;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-cell::before {
    content: attr(data-mobile-market);
    position: absolute;
    top: 5px;
    left: 0;
    right: 0;
    color: #9aa8b9;
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-cell:nth-of-type(5) { grid-area: handicap; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-cell:nth-of-type(6) { grid-area: total; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-cell.eu-col {
    grid-area: europe;
    display: block !important;
    max-width: none;
    justify-self: stretch;
    width: 100%;
  }

  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-trio {
    display: grid;
    grid-template-columns: 1fr;
    grid-auto-rows: 25px;
    width: 100%;
    gap: 3px;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-box,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-none {
    display: flex;
    width: 100%;
    min-width: 0;
    min-height: 25px;
    padding: 2px 4px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 5px;
    background: rgba(255,255,255,.055);
    color: #edf2f7;
    font-size: 12px;
    font-weight: 720;
    line-height: 1;
    white-space: nowrap;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-box.line {
    background: rgba(51, 76, 135, .35);
    color: #e9eef8;
    font-size: 13px;
    font-weight: 850;
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-none {
    color: var(--text-mute);
    background: rgba(255,255,255,.025);
  }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .handi-side { display: none; }
}

@media (max-width: 375px) {
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .team-name { font-size: 13px; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-cell.eu-col { max-width: none; }
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-box,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-closed,
  body:has(.mainnav a[data-nav="home"].active, .mainnav a[data-nav="today"].active, .mainnav a[data-nav="early"].active) #app .odds-none { font-size: 11px; }
}

.wallet-page{padding:24px 0 80px}.wallet-hero{margin-bottom:20px}.wallet-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.wallet-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:18px;margin-bottom:16px}.wallet-card h2{margin:0 0 14px}.wallet-balance{padding:14px 0;border-bottom:1px solid var(--border);display:grid;gap:4px}.wallet-balance b{font-size:24px}.wallet-balance span,.wallet-balance small{color:var(--text-dim)}.wallet-address{margin-top:14px;padding:14px;border:1px dashed var(--border);border-radius:var(--radius-sm);display:grid;gap:10px}.wallet-address code{word-break:break-all;font-size:13px}.wallet-card .form-stack label{display:grid;gap:7px;margin-bottom:12px}.wallet-card input,.wallet-card select{width:100%;padding:11px;border:1px solid var(--border);border-radius:6px;background:var(--bg-soft);color:var(--text)}
@media(max-width:900px){.wallet-grid{grid-template-columns:1fr}.wallet-card{padding:14px}}

/* 品牌名样式：蓝色加粗 */
.brand-text {
  color: #1e5fff !important;
  font-weight: 900 !important;
}

/* 页脚认证编号 / 注册地址 */
.footer-licence,
.footer-office {
  margin: 8px 0 0;
  font-size: 12px;
  line-height: 1.5;
  color: var(--text-mute);
}
.footer-office {
  margin-top: 4px;
}

/* 页脚认证 Logo 行 */
.footer-badges {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  justify-content: center;
  flex-wrap: nowrap;
  margin: 0 8px;
  overflow: hidden;
}
.footer-badges img {
  height: 22px;
  width: auto;
  opacity: 0.9;
  transition: opacity 0.2s;
  flex-shrink: 0;
}
.footer-badges img:hover { opacity: 1; }
@media (max-width: 1200px) {
  .footer-badges { gap: 8px; margin: 0 4px; }
  .footer-badges img { height: 18px; }
}
@media (max-width: 900px) {
  .footer-badges {
    flex-basis: 100%;
    justify-content: center;
    margin: 10px 0 0;
    gap: 10px;
    flex-wrap: wrap;
    overflow: visible;
  }
  .footer-badges img { height: 20px; }
}

/* ---------- 球队队徽 ---------- */
.team-logo-wrap {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 5px;
  vertical-align: middle;
  position: relative;
}
.team-logo {
  width: 100%;
  height: 100%;
  object-fit: contain;
  vertical-align: middle;
}
.team-logo-fallback {
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  background: #2a3040;
  color: #8ea1bd;
  border-radius: 50%;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
}