#app {
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
}

.header {
  text-align: center;
  margin-bottom: 20px;
}

.header h1 {
  margin: 0;
  color: #303133;
}

.main-tabs {
  min-height: 500px;
}

.query-form {
  margin-bottom: 16px;
}

.ball {
  display: inline-block;
  width: 28px;
  height: 28px;
  line-height: 28px;
  border-radius: 50%;
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin-right: 6px;
  font-size: 14px;
}

.ball-front {
  background-color: #f56c6c;
}

.ball-back {
  background-color: #409eff;
}

.pagination-wrapper {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
}

.match-result {
  margin-top: 24px;
}

.match-detail-section {
  margin-top: 24px;
}

.match-detail-section h3 {
  margin-bottom: 12px;
  color: #606266;
}

.sync-status-tag {
  font-weight: bold;
}

/* 奖级中奖条件小球 */
.rule-balls {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
}

.rule-combo {
  display: inline-flex;
  align-items: center;
}

.rule-ball {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  margin-right: 3px;
}

.rule-ball-front {
  background-color: #f56c6c;
}

.rule-ball-back {
  background-color: #409eff;
}

.rule-sep {
  margin: 0 8px;
  color: #909399;
  font-size: 12px;
}

.rule-inline {
  margin: 0 8px;
  vertical-align: middle;
}

.empty-text {
  color: #909399;
  padding: 24px 0;
  text-align: center;
}