/* Arctic CUP reusable knockout bracket component */
.wc-bracket-component {
  background: linear-gradient(135deg, rgba(255,255,255,0.05), rgba(255,255,255,0.02));
  border: 1px solid var(--neon-border);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.32);
  min-width: 720px;
}
.wc-bracket-header { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; margin-bottom:14px; }
.wc-kicker { display:block; color:var(--text-muted); font-size:0.8rem; font-weight:700; margin-bottom:4px; }
.wc-bracket-header h3 { margin:0; font-size:1.35rem; color:var(--text-primary); }
.wc-bracket-note { color:var(--text-muted); font-size:0.72rem; border:1px solid var(--neon-border); border-radius:999px; padding:5px 10px; background:rgba(0,0,0,0.16); }
.wc-round-tabs { display:flex; gap:12px; margin:14px 0 18px; flex-wrap:wrap; }
.wc-round-tab { appearance:none; border:0; background:rgba(255,255,255,0.06); color:var(--text-muted); border-radius:999px; padding:10px 18px; font-weight:800; cursor:pointer; transition:all .18s ease; }
.wc-round-tab:hover { color:var(--text-primary); background:rgba(255,115,0,0.18); }
.wc-round-tab.active { background:#0b0f1c; color:#fff; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.08), 0 0 0 1px rgba(255,115,0,0.2); }
.wc-bracket-scroll { overflow-x:auto; padding-bottom:10px; }
.wc-bracket-columns { display:grid; grid-template-columns:repeat(var(--wc-round-count), minmax(250px, 1fr)); gap:38px; align-items:stretch; min-height:620px; }
.wc-round-column { position:relative; display:flex; flex-direction:column; justify-content:space-around; gap:24px; min-width:250px; }
.wc-round-column:not(:last-child)::after { content:""; position:absolute; top:50%; right:-30px; width:24px; height:1px; background:rgba(255,255,255,0.13); }
.wc-round-column h3 { margin:0 0 10px; color:var(--orange-accent); text-align:center; font-size:0.9rem; letter-spacing:.04em; }
.wc-round-matches { display:flex; flex-direction:column; gap:22px; justify-content:space-around; flex:1; }
.wc-match-card { position:relative; background:rgba(12,18,32,0.94); border:1px solid var(--neon-border); border-radius:12px; overflow:hidden; min-height:104px; box-shadow:0 10px 26px rgba(0,0,0,0.22); }
.wc-match-card::after { content:""; position:absolute; right:-20px; top:50%; width:20px; height:1px; background:rgba(255,255,255,0.15); }
.wc-round-column:last-child .wc-match-card::after { display:none; }
.wc-match-topline { display:flex; justify-content:space-between; gap:10px; align-items:center; background:rgba(0,0,0,0.28); padding:8px 12px; font-size:.78rem; }
.wc-match-status { color:var(--text-muted); font-weight:800; }
.wc-match-status.live { color:#ffdf70; }
.wc-match-status.final { color:#fff; }
.wc-match-status.scheduled { color:var(--text-muted); }
.wc-match-date { color:var(--text-primary); opacity:.9; text-align:right; }
.wc-match-teams { padding:10px 12px; }
.wc-team-row { display:grid; grid-template-columns:24px 34px minmax(0,1fr) auto; gap:7px; align-items:center; padding:7px 0; color:var(--text-muted); }
.wc-team-row + .wc-team-row { border-top:1px solid rgba(255,255,255,0.08); }
.wc-team-row.winner { color:#fff; font-weight:900; }
.wc-team-row.tbd { opacity:.65; }
.wc-team-flag img, .wc-team-flag .flag-icon { width:22px; height:16px; object-fit:cover; border-radius:2px; }
.wc-team-code { font-weight:900; color:inherit; opacity:.9; }
.wc-team-name { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.wc-score { font-weight:900; color:inherit; min-width:28px; text-align:right; }
.wc-pen { color:var(--orange-accent); font-weight:900; }
.wc-empty-round { color:var(--text-muted); border:1px dashed var(--neon-border); border-radius:12px; padding:24px; text-align:center; }
@media (max-width: 780px) {
  .wc-bracket-component { min-width:0; padding:14px; }
  .wc-bracket-scroll { overflow-x:hidden; }
  .wc-bracket-columns { display:block; min-height:0; }
  .wc-round-column { display:none; min-width:0; }
  .wc-round-column.active { display:block; }
  .wc-round-column::after, .wc-match-card::after { display:none !important; }
  .wc-round-matches { gap:14px; }
  .wc-bracket-header { align-items:flex-start; }
  .wc-bracket-note { display:none; }
}

/* v39 bracket interaction and prediction details */
.wc-round-column.selected > h3 {
  text-shadow: 0 0 14px rgba(255,115,0,0.55);
}
.wc-round-column.selected .wc-match-card {
  border-color: rgba(255,115,0,0.38);
}
.wc-team-row.clickable {
  cursor: pointer;
  border-radius: 8px;
  transition: background .16s ease, transform .16s ease;
}
.wc-team-row.clickable:hover {
  background: rgba(255,115,0,0.10);
  transform: translateX(2px);
}
.wc-power {
  color: var(--orange-accent);
  font-weight: 900;
  font-size: .78em;
}
.wc-prediction-line {
  border-top: 1px solid rgba(255,255,255,0.08);
  color: var(--emerald-accent);
  font-size: .74rem;
  font-weight: 800;
  padding: 7px 12px 9px;
  background: rgba(0,0,0,0.10);
}
.wc-prediction-line .upset {
  color: var(--crimson-warn);
}
.back-to-top-btn {
  position: fixed;
  right: 24px;
  bottom: 88px;
  z-index: 9998;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255,115,0,0.55);
  background: rgba(12,18,32,0.92);
  color: #fff;
  font-size: 1.15rem;
  font-weight: 900;
  box-shadow: 0 14px 32px rgba(0,0,0,0.35);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}
.back-to-top-btn.visible {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}
.back-to-top-btn:hover {
  background: var(--orange-accent);
}
@media (max-width: 780px) {
  .back-to-top-btn { right: 16px; bottom: 78px; }
}

/* v41 tree alignment: feeder matches sit beside the round they feed */
.wc-bracket-columns {
  align-items: start;
}
.wc-round-column {
  justify-content: flex-start;
}
.wc-round-column h3 {
  position: sticky;
  top: 78px;
  z-index: 3;
  background: rgba(12,18,32,0.92);
  border-radius: 999px;
  padding: 7px 10px;
}
.wc-tree-matches {
  display: grid;
  grid-template-rows: repeat(100, 22px);
  gap: 0;
  justify-content: stretch;
  align-items: center;
  flex: initial;
  min-height: 2240px;
}
.wc-match-slot {
  min-width: 0;
}
.wc-match-slot .wc-match-card {
  height: 112px;
}
.wc-round-column:not(:last-child)::after {
  display: none;
}
.wc-match-card::after {
  right: -38px;
  width: 38px;
}
.wc-round-column.selected h3 {
  background: rgba(255,115,0,0.16);
  border: 1px solid rgba(255,115,0,0.35);
}
.wc-bracket-component[data-active-round="r32"] .wc-round-column[data-round-column="r32"] .wc-match-card,
.wc-bracket-component[data-active-round="r16"] .wc-round-column[data-round-column="r16"] .wc-match-card,
.wc-bracket-component[data-active-round="qf"] .wc-round-column[data-round-column="qf"] .wc-match-card,
.wc-bracket-component[data-active-round="sf"] .wc-round-column[data-round-column="sf"] .wc-match-card,
.wc-bracket-component[data-active-round="final"] .wc-round-column[data-round-column="final"] .wc-match-card {
  box-shadow: 0 0 0 1px rgba(255,115,0,0.34), 0 12px 30px rgba(0,0,0,0.30);
}
@media (min-width: 781px) {
  .wc-bracket-scroll {
    overflow-x: auto;
    scroll-padding-left: 18px;
  }
  .wc-round-column {
    min-width: 280px;
  }
}
@media (max-width: 780px) {
  .wc-tree-matches {
    display: flex;
    min-height: 0;
    gap: 14px;
  }
  .wc-match-slot .wc-match-card {
    height: auto;
  }
  .wc-round-column h3 {
    position: static;
  }
}
