.rb-dtc-host {
  width: 100% !important;
}

.rb-dtc {
  --dtc-blue: #1b4ebc !important;
  --dtc-maroon: #8b0000 !important;
  --dtc-gold: #f6e052 !important;
  --dtc-green: #388e3c !important;
  --dtc-yellow: #fbc02d !important;
  --dtc-red: #d32f2f !important;
  --dtc-card: #ffffff !important;
  --dtc-text: #1a1a1a !important;
  --dtc-muted: #6e6e6e !important;
  --dtc-border: #dddddd !important;
  --dtc-bg: #f5f5f5 !important;
  --dtc-radius: 8px !important;
  color: var(--dtc-text) !important;
  font-family: "Outfit", Arial, sans-serif !important;
  line-height: 1.5 !important;
  margin: 0 auto !important;
  max-width: 1100px !important;
}

.rb-dtc *,
.rb-dtc *::before,
.rb-dtc *::after {
  box-sizing: border-box !important;
}

.rb-dtc-shell {
  background: var(--dtc-bg) !important;
  border-radius: var(--dtc-radius) !important;
  overflow: hidden !important;
}

.rb-dtc-header {
  background: var(--dtc-blue) !important;
  border-bottom: 4px solid var(--dtc-gold) !important;
  color: #ffffff !important;
  padding: 22px 28px !important;
}

.rb-dtc-header h1 {
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 1.6rem !important;
  letter-spacing: 0.5px !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
}

.rb-dtc-settings {
  align-items: center !important;
  background: var(--dtc-card) !important;
  border: 1px solid var(--dtc-border) !important;
  border-top: 0 !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px 28px !important;
  padding: 14px 24px !important;
}

.rb-dtc-settings-row {
  align-items: center !important;
  display: flex !important;
  gap: 8px !important;
}

.rb-dtc-settings label,
.rb-dtc-checks label {
  color: var(--dtc-text) !important;
  font-size: 0.88rem !important;
  font-weight: 600 !important;
  white-space: nowrap !important;
}

.rb-dtc-settings select,
.rb-dtc-search-input {
  appearance: none !important;
  background: #ffffff !important;
  border: 1px solid var(--dtc-border) !important;
  border-radius: var(--dtc-radius) !important;
  color: var(--dtc-text) !important;
  font-family: "Outfit", Arial, sans-serif !important;
  font-size: 0.9rem !important;
  outline: none !important;
}

.rb-dtc-settings select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236e6e6e' d='M6 8L0 0h12z'/%3E%3C/svg%3E") !important;
  background-position: right 12px center !important;
  background-repeat: no-repeat !important;
  background-size: 12px 8px !important;
  cursor: pointer !important;
  padding: 6px 34px 6px 10px !important;
}

.rb-dtc-checks {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px 14px !important;
}

.rb-dtc-checks label {
  align-items: center !important;
  cursor: pointer !important;
  display: flex !important;
  gap: 6px !important;
  font-weight: 500 !important;
}

.rb-dtc-checks input {
  accent-color: var(--dtc-blue) !important;
  cursor: pointer !important;
  height: 15px !important;
  width: 15px !important;
}

.rb-dtc-columns {
  display: grid !important;
  gap: 0 !important;
  grid-template-columns: 1fr 1fr !important;
  width: 100% !important;
}

.rb-dtc-team {
  background: var(--dtc-card) !important;
  border: 1px solid var(--dtc-border) !important;
  border-top: 0 !important;
  min-width: 0 !important;
  padding: 22px 22px 18px !important;
  width: 100% !important;
}

.rb-dtc-team + .rb-dtc-team {
  border-left: 0 !important;
}

.rb-dtc-team h2 {
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 1.05rem !important;
  letter-spacing: 0.5px !important;
  margin: 0 0 14px !important;
  text-transform: uppercase !important;
}

.rb-dtc-strategy {
  border: 1px solid var(--dtc-border) !important;
  border-radius: var(--dtc-radius) !important;
  display: flex !important;
  margin-bottom: 14px !important;
  overflow: hidden !important;
}

.rb-dtc-strategy button,
.rb-dtc-reset {
  appearance: none !important;
  border: 0 !important;
  cursor: pointer !important;
  font-family: "Oswald", Arial, sans-serif !important;
  letter-spacing: 0.8px !important;
  text-transform: uppercase !important;
}

.rb-dtc-strategy button {
  background: #eeeeee !important;
  color: var(--dtc-muted) !important;
  flex: 1 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  padding: 9px 0 !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}

.rb-dtc-strategy .is-contending {
  background: var(--dtc-blue) !important;
  color: #ffffff !important;
}

.rb-dtc-strategy .is-rebuilding {
  background: var(--dtc-maroon) !important;
  color: #ffffff !important;
}

.rb-dtc-search {
  margin-bottom: 12px !important;
  position: relative !important;
  width: 100% !important;
}

.rb-dtc-search-input {
  padding: 9px 12px !important;
  width: 100% !important;
}

.rb-dtc-search-input:focus {
  border-color: var(--dtc-blue) !important;
}

.rb-dtc-dropdown {
  background: #ffffff !important;
  border: 1px solid var(--dtc-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 var(--dtc-radius) var(--dtc-radius) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12) !important;
  display: none !important;
  left: 0 !important;
  max-height: 280px !important;
  overflow-y: auto !important;
  position: absolute !important;
  right: 0 !important;
  top: 100% !important;
  z-index: 9999 !important;
}

.rb-dtc-dropdown.is-open {
  display: block !important;
}

.rb-dtc-dd-sep {
  background: #f8f8f8 !important;
  border-top: 1px solid #eeeeee !important;
  color: var(--dtc-muted) !important;
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 0.68rem !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  padding: 6px 12px 4px !important;
  text-transform: uppercase !important;
}

.rb-dtc-dd-sep:first-child {
  border-top: 0 !important;
}

.rb-dtc-dd-row {
  align-items: center !important;
  cursor: pointer !important;
  display: flex !important;
  font-size: 0.88rem !important;
  justify-content: space-between !important;
  padding: 8px 12px !important;
  transition: background 0.12s ease !important;
}

.rb-dtc-dd-row:hover {
  background: #f0f4ff !important;
}

.rb-dtc-dd-left {
  align-items: center !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

.rb-dtc-dd-name {
  font-weight: 600 !important;
}

.rb-dtc-dd-team {
  color: var(--dtc-muted) !important;
  font-size: 0.78rem !important;
}

.rb-dtc-dd-badge,
.rb-dtc-dd-tag,
.rb-dtc-pos-badge,
.rb-dtc-impact-tag,
.rb-dtc-franchise-tag {
  border-radius: 3px !important;
  display: inline-block !important;
  font-family: "Oswald", Arial, sans-serif !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
}

.rb-dtc-dd-badge {
  background: #eeeeee !important;
  color: var(--dtc-text) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  padding: 2px 7px !important;
  white-space: nowrap !important;
}

.rb-dtc-dd-tag {
  font-size: 0.5rem !important;
  font-weight: 600 !important;
  margin-left: 5px !important;
  padding: 1px 5px !important;
}

.rb-dtc-dd-tag--stud,
.rb-dtc-impact-tag {
  background: var(--dtc-gold) !important;
  color: #1a1a1a !important;
}

.rb-dtc-dd-tag--franchise,
.rb-dtc-franchise-tag {
  background: var(--dtc-blue) !important;
  color: #ffffff !important;
}

.rb-dtc-hint,
.rb-dtc-sends,
.rb-dtc-empty,
.rb-dtc-summary,
.rb-dtc-powered {
  color: var(--dtc-muted) !important;
}

.rb-dtc-hint {
  display: none !important;
  font-size: 0.75rem !important;
  font-style: italic !important;
  margin: -4px 0 6px !important;
}

.rb-dtc-sends {
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 1px !important;
  margin-bottom: 8px !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
}

.rb-dtc-assets {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  min-height: 30px !important;
  width: 100% !important;
}

.rb-dtc-empty {
  font-size: 0.88rem !important;
  font-style: italic !important;
  padding: 18px 10px !important;
  text-align: center !important;
}

.rb-dtc-card {
  align-items: center !important;
  animation: rbDtcSlideIn 0.2s ease-out !important;
  background: #ffffff !important;
  border: 1px solid var(--dtc-border) !important;
  border-radius: var(--dtc-radius) !important;
  display: flex !important;
  padding: 11px 12px !important;
  position: relative !important;
  width: 100% !important;
}

.rb-dtc-card.is-stud {
  border-color: var(--dtc-gold) !important;
  box-shadow: 0 0 10px rgba(246, 224, 82, 0.45) !important;
}

.rb-dtc-card.is-franchise {
  border-left: 3px solid var(--dtc-blue) !important;
}

.rb-dtc-impact-tag,
.rb-dtc-franchise-tag {
  font-size: 0.5rem !important;
  font-weight: 700 !important;
  left: 8px !important;
  line-height: 1.4 !important;
  padding: 1px 7px !important;
  position: absolute !important;
  top: -7px !important;
}

.rb-dtc-card-body {
  flex: 1 !important;
  min-width: 0 !important;
}

.rb-dtc-card-name {
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.rb-dtc-card-sub {
  color: var(--dtc-muted) !important;
  font-size: 0.78rem !important;
}

.rb-dtc-pos-badge {
  color: #ffffff !important;
  font-size: 0.58rem !important;
  font-weight: 600 !important;
  margin-right: 3px !important;
  padding: 0 5px !important;
  vertical-align: middle !important;
}

.rb-dtc-pos-badge--qb { background: #7b1fa2; }
.rb-dtc-pos-badge--rb { background: #1565c0; }
.rb-dtc-pos-badge--wr { background: #2e7d32; }
.rb-dtc-pos-badge--te { background: #e65100; }
.rb-dtc-pos-badge--pick { background: #555555; }

.rb-dtc-card-value {
  border-radius: 4px !important;
  color: #ffffff !important;
  flex-shrink: 0 !important;
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 0.88rem !important;
  font-weight: 700 !important;
  margin-left: 8px !important;
  min-width: 34px !important;
  padding: 3px 9px !important;
  text-align: center !important;
}

.rb-dtc-card-value--blue { background: var(--dtc-blue); }
.rb-dtc-card-value--maroon { background: var(--dtc-maroon); }

.rb-dtc-card-remove {
  appearance: none !important;
  background: none !important;
  border: 0 !important;
  color: #aaaaaa !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  font-size: 1.15rem !important;
  line-height: 1 !important;
  padding: 0 0 0 8px !important;
}

.rb-dtc-card-remove:hover {
  color: var(--dtc-red) !important;
}

.rb-dtc-total {
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 1.85rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin-top: 10px !important;
  padding-right: 2px !important;
  text-align: right !important;
}

.rb-dtc-total--blue { color: var(--dtc-blue); }
.rb-dtc-total--maroon { color: var(--dtc-maroon); }
.rb-dtc-total.is-winner::after {
  content: "\2713" !important;
  font-size: 0.7em !important;
  margin-left: 6px !important;
  opacity: 0.6 !important;
}

.rb-dtc-verdict {
  background: var(--dtc-bg) !important;
  border: 1px solid var(--dtc-border) !important;
  border-top: 0 !important;
  border-radius: 0 0 var(--dtc-radius) var(--dtc-radius) !important;
  padding: 28px 20px 24px !important;
  text-align: center !important;
}

.rb-dtc-verdict-label {
  color: var(--dtc-text) !important;
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 1.55rem !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  margin-bottom: 10px !important;
  text-transform: uppercase !important;
}

.rb-dtc-verdict-label.is-win { color: var(--dtc-green); }
.rb-dtc-verdict-label.is-fair { color: #b8860b; }
.rb-dtc-verdict-label.is-lose { color: var(--dtc-red); }

.rb-dtc-balance {
  display: none !important;
  margin: 0 auto 18px !important;
  max-width: 400px !important;
}

.rb-dtc-balance-labels {
  color: var(--dtc-muted) !important;
  display: flex !important;
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  justify-content: space-between !important;
  letter-spacing: 0.8px !important;
  margin-bottom: 4px !important;
  text-transform: uppercase !important;
}

.rb-dtc-balance-track {
  background: #e0e0e0 !important;
  border-radius: 4px !important;
  height: 8px !important;
  overflow: hidden !important;
  position: relative !important;
}

.rb-dtc-balance-marker {
  background: var(--dtc-text) !important;
  border-radius: 2px !important;
  height: 14px !important;
  left: 50% !important;
  opacity: 0.3 !important;
  position: absolute !important;
  top: -3px !important;
  transform: translateX(-50%) !important;
  width: 3px !important;
}

.rb-dtc-balance-fill {
  border-radius: 4px !important;
  height: 100% !important;
  left: 0 !important;
  position: absolute !important;
  top: 0 !important;
  transition: background 0.5s ease, left 0.5s ease, width 0.5s ease !important;
}

.rb-dtc-lights {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
  justify-content: center !important;
  margin-bottom: 18px !important;
}

.rb-dtc-light {
  border: 2px solid transparent !important;
  border-radius: var(--dtc-radius) !important;
  font-family: "Oswald", Arial, sans-serif !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.8px !important;
  opacity: 0.32 !important;
  padding: 9px 18px !important;
  text-transform: uppercase !important;
  transition: opacity 0.25s ease, background 0.25s ease, border-color 0.25s ease !important;
}

.rb-dtc-light--bad { background: rgba(211, 47, 47, 0.1); color: var(--dtc-red); }
.rb-dtc-light--fair { background: rgba(251, 192, 45, 0.1); color: #a68600; }
.rb-dtc-light--good { background: rgba(56, 142, 60, 0.1); color: var(--dtc-green); }
.rb-dtc-light.is-on { opacity: 1 !important; }
.rb-dtc-light--bad.is-on { background: rgba(211, 47, 47, 0.13) !important; border-color: var(--dtc-red) !important; }
.rb-dtc-light--fair.is-on { background: rgba(251, 192, 45, 0.15) !important; border-color: var(--dtc-yellow) !important; }
.rb-dtc-light--good.is-on { background: rgba(56, 142, 60, 0.13) !important; border-color: var(--dtc-green) !important; }

.rb-dtc-reset {
  background: #555555 !important;
  border: 2px solid #555555 !important;
  border-radius: var(--dtc-radius) !important;
  color: #ffffff !important;
  display: inline-block !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  margin-top: 10px !important;
  padding: 9px 26px !important;
}

.rb-dtc-reset:hover {
  background: #333333 !important;
  border-color: #333333 !important;
}

.rb-dtc-powered {
  font-size: 0.72rem !important;
  letter-spacing: 0.3px !important;
  line-height: 1.5 !important;
  margin-top: 22px !important;
}

.rb-dtc-powered strong {
  color: #888888 !important;
}

.rb-dtc-unavailable {
  border: 1px solid #dddddd !important;
  border-radius: 8px !important;
  color: #666666 !important;
  font-family: "Outfit", Arial, sans-serif !important;
  padding: 18px 20px !important;
}

.rb-dtc-summary {
    margin-bottom: 15px;
}

@keyframes rbDtcSlideIn {
  from {
    opacity: 0 !important;
    transform: translateY(-8px) !important;
  }

  to {
    opacity: 1 !important;
    transform: translateY(0) !important;
  }
}

@media (max-width: 740px) {
  .rb-dtc-header h1 { font-size: 1.2rem !important; }
  .rb-dtc-columns {
    display: block !important;
    width: 100% !important;
  }
  .rb-dtc-team + .rb-dtc-team { border-left: 1px solid var(--dtc-border) !important; }
  .rb-dtc-settings {
    align-items: flex-start !important;
    flex-direction: column !important;
    gap: 10px !important;
    padding: 12px 16px !important;
  }
  .rb-dtc-settings-row,
  .rb-dtc-checks { flex-wrap: wrap !important; }
  .rb-dtc-settings-row {
    gap: 6px !important;
  }
  .rb-dtc-team {
    padding: 18px 16px 20px !important;
    width: 100% !important;
  }
  .rb-dtc-strategy,
  .rb-dtc-search,
  .rb-dtc-assets,
  .rb-dtc-card {
    width: 100% !important;
  }
  .rb-dtc-total { font-size: 1.5rem !important; }
  .rb-dtc-verdict-label { font-size: 1.2rem !important; }
  .rb-dtc-card-name { font-size: 0.88rem !important; }
  .rb-dtc-lights {
    flex-wrap: nowrap !important;
    gap: 8px !important;
  }
  .rb-dtc-light {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    padding: 8px 10px !important;
    text-align: center !important;
  }
  .rb-dtc-reset {
    margin-top: 14px !important;
  }
  .rb-dtc-powered {
    margin-top: 24px !important;
  }
}

@media (max-width: 420px) {
  .rb-dtc-header { padding: 16px !important; }
  .rb-dtc-header h1 { font-size: 1rem !important; }
  .rb-dtc-settings { padding: 12px 14px !important; }
  .rb-dtc-settings label { font-size: 0.82rem !important; }
  .rb-dtc-settings select {
    font-size: 0.82rem !important;
    padding: 4px 32px 4px 8px !important;
  }
  .rb-dtc-checks { gap: 6px 10px !important; }
  .rb-dtc-checks label { font-size: 0.82rem !important; }
  .rb-dtc-team { padding: 16px 14px 18px !important; }
  .rb-dtc-strategy button {
    font-size: 0.72rem !important;
    padding: 8px 0 !important;
  }
  .rb-dtc-light {
    font-size: 0.62rem !important;
    letter-spacing: 0.4px !important;
    padding: 7px 6px !important;
  }
  .rb-dtc-summary {
    font-size: 0.8rem !important;
    margin-bottom: 18px !important;
  }
  .rb-dtc-reset {
    margin-top: 16px !important;
  }
  .rb-dtc-powered {
    margin-top: 26px !important;
  }
}