.local-predictions {
  padding: 16px 12px;
  border: 1px solid #e0e9e4;
  background: #f7fbf8;
  margin: 18px 0;
  font:
    14px/1.6 -apple-system,
    "Microsoft YaHei",
    sans-serif;
  color: #293b31;
}
.local-predictions h3 {
  font-size: 16px;
  color: #126843;
  margin: 0 0 12px;
}
.prediction-row {
  background: #fff;
  border: 1px solid #e2e8e4;
  border-radius: 7px;
  padding: 12px;
  margin: 10px 0;
}
.prediction-row header {
  display: flex;
  justify-content: space-between;
  gap: 10px;
}
.prediction-row header span {
  color: #687c70;
  white-space: nowrap;
}
.prediction-row.hit header span {
  color: #ce263d;
  font-weight: bold;
}
.prediction-row p {
  margin: 10px 0;
}
.pick {
  display: inline-block;
  min-width: 30px;
  text-align: center;
  background: #f0f3f1;
  border-radius: 4px;
  padding: 3px 8px;
  margin: 0 5px 5px 0;
  color: #314d3b;
}
.pick.matched {
  background: #ffe2e5;
  color: #d20f2c;
  font-weight: bold;
  box-shadow: inset 0 0 0 1px #f8b1bd;
}
.prediction-row small,
.judgment-note {
  font-size: 11px !important;
  color: #7b8b80 !important;
}
.draw-body {
  margin: 0;
  font:
    12px/1.4 -apple-system,
    "Microsoft YaHei",
    sans-serif;
  background: white;
}
.local-draw {
  padding: 4px 5px;
}
.draw-caption {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #65786b;
  margin-bottom: 5px;
  font-size: 12px;
}
.draw-caption small {
  font-size: 10px;
  color: #81968a;
}
.draw-balls {
  display: flex;
  gap: 5px;
  align-items: center;
}
.draw-ball {
  flex: 1;
  text-align: center;
  border: 1px solid;
  border-radius: 2px;
  overflow: hidden;
}
.draw-ball b {
  display: block;
  color: white;
  font:
    bold 25px/1.2 Arial,
    sans-serif;
}
.draw-ball small {
  display: block;
  background: white;
  font-size: 12px;
  line-height: 18px;
  white-space: nowrap;
}
.draw-ball.red {
  color: #e21c32;
  background: #e21c32;
}
.draw-ball.blue {
  color: #147be1;
  background: #147be1;
}
.draw-ball.green {
  color: #079e3d;
  background: #079e3d;
}
.plus {
  font-size: 16px;
  color: #8ca195;
}
.local-draw.compact {
  display: flex;
  padding: 2px;
  gap: 5px;
  align-items: center;
  height: 48px;
  box-sizing: border-box;
}
.compact .draw-caption {
  display: block;
  width: 19%;
  margin: 0;
  text-align: center;
  font-size: 11px;
}
.compact .draw-caption small {
  display: block;
}
.compact .draw-balls {
  flex: 1;
  gap: 2px;
}
.compact .draw-ball b {
  font-size: 20px;
  line-height: 21px;
}
.compact .draw-ball small {
  font-size: 12px;
  line-height: 15px;
}
.compact .plus {
  display: none;
}
.prediction-row.miss header span {
  color: #7d7d7d;
}

.draw-tabs {
  display: flex;
  gap: 6px;
  padding: 2px 5px;
}
.draw-tabs button {
  width: 50%;
  border: 0;
  border-radius: 4px;
  background: #fff7cd;
  line-height: 20px;
  font-size: 12px;
  cursor: pointer;
}
.draw-tabs .active {
  background: #e82535;
  color: #fff;
}
