/* Broadcast board index cards: isolated from legacy mini-board selectors. */
html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip {
  align-items: start !important;
  background: #06110e !important;
  border: 1px solid rgba(214, 167, 72, .28) !important;
  border-radius: 10px !important;
  display: grid !important;
  gap: 14px !important;
  grid-template-columns: repeat(auto-fill, 226px) !important;
  justify-content: start !important;
  overflow: visible !important;
  padding: 14px !important;
}

html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip > a.pr-broadcast-mini-card {
  align-content: start !important;
  background: #f4e4bf !important;
  border: 1px solid rgba(52, 36, 14, .34) !important;
  border-radius: 7px !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, .18) !important;
  color: #2f2b24 !important;
  display: block !important;
  gap: 6px !important;
  height: 306px !important;
  max-width: 226px !important;
  min-height: 306px !important;
  min-width: 226px !important;
  overflow: hidden !important;
  padding: 7px !important;
  position: relative !important;
  text-decoration: none !important;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease !important;
  width: 226px !important;
}

html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip > a.pr-broadcast-mini-card:hover,
html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip > a.pr-broadcast-mini-card:focus-visible {
  border-color: #d7a43b !important;
  box-shadow: 0 14px 26px rgba(0, 0, 0, .24), 0 0 0 2px rgba(215, 164, 59, .24) !important;
  outline: 0 !important;
  transform: translateY(-1px) !important;
}

html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip > a.pr-broadcast-mini-card.is-active {
  background: #e4f1fb !important;
  border-color: #7dbbe6 !important;
  box-shadow: 0 0 0 2px rgba(125, 187, 230, .65), 0 14px 28px rgba(0, 0, 0, .28) !important;
}

html body.view-broadcasts .pr-broadcast-mini-player {
  align-items: center !important;
  display: grid !important;
  gap: 6px !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  height: 30px !important;
  left: 7px !important;
  min-width: 0 !important;
  position: absolute !important;
  right: 7px !important;
  z-index: 2 !important;
}

html body.view-broadcasts .pr-broadcast-mini-card > .pr-broadcast-mini-player:first-child {
  top: 7px !important;
}

html body.view-broadcasts .pr-broadcast-mini-card > .pr-broadcast-mini-player:last-child {
  bottom: 6px !important;
}

html body.view-broadcasts .pr-broadcast-mini-person {
  align-items: center !important;
  display: flex !important;
  gap: 5px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding-right: 38px !important;
  white-space: nowrap !important;
}

html body.view-broadcasts .pr-broadcast-mini-flag {
  aspect-ratio: 4 / 3 !important;
  background: #fff8e6 !important;
  border: 1px solid rgba(47, 43, 36, .2) !important;
  border-radius: 2px !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .16) !important;
  display: inline-block !important;
  flex: 0 0 19px !important;
  font-family: "Segoe UI Emoji", "Apple Color Emoji", "Noto Color Emoji", sans-serif !important;
  font-size: 0 !important;
  height: 14px !important;
  line-height: 14px !important;
  object-fit: cover !important;
  text-align: center !important;
  vertical-align: -2px !important;
  width: 20px !important;
}

html body.view-broadcasts span.pr-broadcast-mini-flag.is-international {
  background: linear-gradient(135deg, #f7df9b, #0c1d18) !important;
  border-radius: 999px !important;
  color: #fff6d8 !important;
  font-size: 10px !important;
  font-weight: 900 !important;
}

html body.view-broadcasts span.pr-broadcast-mini-flag.is-international::before {
  content: "INT";
}

html body.view-broadcasts .pr-broadcast-mini-name {
  display: block !important;
  flex: 0 1 auto !important;
  font-size: .82rem !important;
  font-weight: 900 !important;
  line-height: 1.05 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html body.view-broadcasts .pr-broadcast-mini-title {
  color: rgba(47, 43, 36, .78) !important;
  display: inline-block !important;
  flex: 0 0 auto !important;
  font-size: .72rem !important;
  font-weight: 900 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

html body.view-broadcasts .pr-broadcast-mini-score {
  align-items: center !important;
  border-radius: 999px !important;
  color: #07120f !important;
  display: inline-flex !important;
  font-size: .74rem !important;
  font-weight: 950 !important;
  height: 22px !important;
  justify-content: center !important;
  line-height: 1 !important;
  min-width: 28px !important;
  padding: 0 7px !important;
  position: absolute !important;
  right: 0 !important;
  text-align: center !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  white-space: nowrap !important;
}

html body.view-broadcasts .pr-broadcast-mini-score.is-win {
  background: #c9f4cf !important;
  border: 1px solid #49a85c !important;
  color: #0c4f1c !important;
}

html body.view-broadcasts .pr-broadcast-mini-score.is-loss {
  background: #ffd6cc !important;
  border: 1px solid #d8664a !important;
  color: #8d230f !important;
}

html body.view-broadcasts .pr-broadcast-mini-score.is-draw {
  background: #e6edf4 !important;
  border: 1px solid #8aa0b5 !important;
  color: #263849 !important;
}

html body.view-broadcasts .pr-broadcast-mini-score.is-pending {
  background: #fff7e4 !important;
  border: 1px solid #d6a23b !important;
  color: #8a5b00 !important;
}

html body.view-broadcasts .pr-broadcast-mini-board-wrap {
  aspect-ratio: 1 / 1 !important;
  background: #2d2113 !important;
  border: 1px solid rgba(66, 43, 18, .45) !important;
  border-radius: 4px !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14) !important;
  display: block !important;
  height: 210px !important;
  left: 7px !important;
  max-height: 210px !important;
  max-width: 210px !important;
  min-height: 210px !important;
  min-width: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  top: 42px !important;
  z-index: 1 !important;
  width: 210px !important;
}

html body.view-broadcasts .pr-broadcast-mini-board {
  aspect-ratio: 1 / 1 !important;
  display: grid !important;
  grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
  grid-template-rows: repeat(8, minmax(0, 1fr)) !important;
  height: 100% !important;
  line-height: 1 !important;
  overflow: hidden !important;
  width: 100% !important;
}

html body.view-broadcasts .pr-broadcast-mini-board > .pr-broadcast-mini-square {
  align-items: center !important;
  aspect-ratio: 1 / 1 !important;
  box-sizing: border-box !important;
  display: flex !important;
  float: none !important;
  height: auto !important;
  justify-content: center !important;
  line-height: 1 !important;
  margin: 0 !important;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: relative !important;
  transform: none !important;
  width: auto !important;
}

html body.view-broadcasts .pr-broadcast-mini-board > .pr-broadcast-mini-square.is-light {
  background: #efd7a2 !important;
}

html body.view-broadcasts .pr-broadcast-mini-board > .pr-broadcast-mini-square.is-dark {
  background: #a96c2d !important;
}

html body.view-broadcasts .pr-broadcast-mini-board .pr-broadcast-mini-piece {
  float: none !important;
  display: block !important;
  height: 88% !important;
  max-height: 88% !important;
  max-width: 88% !important;
  object-fit: contain !important;
  position: static !important;
  transform: none !important;
  width: 88% !important;
}

@media (max-width: 720px) {
  html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip {
    grid-template-columns: repeat(auto-fill, 174px) !important;
    gap: 10px !important;
    padding: 10px !important;
  }

  html body.view-broadcasts .chessora-broadcast-board-index.chessora-observer-strip > a.pr-broadcast-mini-card {
    height: 246px !important;
    max-width: 174px !important;
    min-height: 246px !important;
    min-width: 174px !important;
    width: 174px !important;
  }

  html body.view-broadcasts .pr-broadcast-mini-board-wrap {
    height: 158px !important;
    left: 8px !important;
    max-height: 158px !important;
    max-width: 158px !important;
    min-height: 158px !important;
    top: 36px !important;
    width: 158px !important;
  }

  html body.view-broadcasts .pr-broadcast-mini-player {
    height: 24px !important;
  }

  html body.view-broadcasts .pr-broadcast-mini-name {
    font-size: .76rem !important;
  }
}
