.championship-bracket-page { overflow: visible; }
.championship-bracket-toolbar { margin-bottom: 14px; }
.championship-bracket-toolbar .buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.championship-bracket-title { margin: 4px 0 16px; }
.championship-bracket-title h2 { margin: 0; font-size: 2em; }

.championship-bracket-wrap { overflow-x: auto; overflow-y: visible; padding: 12px 0 28px; }
.championship-bracket-shell { position: relative; min-width: 100%; }
.championship-bracket-board { position: relative; margin: 0 auto; }

.championship-round-source { display: none; }
.championship-round-column { position: absolute; top: 0; height: 100%; z-index: 2; }
.championship-round-column-title { height: 58px; box-sizing: border-box; margin: 0 0 0; padding: 8px 10px; text-align: center; color: #7184a5; }
.championship-round-column-title h3 { margin: 0; font-size: 1.1em; color: #5d79a8; }
.championship-round-column-title span { display: block; margin-top: 2px; font-size: .85em; }

.championship-positioned-match { position: absolute; left: 0; width: 245px; min-height: 76px; box-sizing: border-box; background: linear-gradient(180deg, #f1f6fb 0%, #e2edf7 100%); border: 1px solid #c7d8e8; border-radius: 8px; box-shadow: 0 2px 5px rgba(32, 63, 95, .08); overflow: visible; z-index: 3; }
.championship-match-head { display: flex; justify-content: space-between; gap: 6px; padding: 5px 9px; background: rgba(255,255,255,.55); border-bottom: 1px solid #cfdeeb; border-radius: 8px 8px 0 0; font-size: .76em; color: #55719b; font-weight: 700; }
.championship-player { display: flex; align-items: center; justify-content: space-between; min-height: 29px; padding: 0 7px 0 10px; border-bottom: 1px solid rgba(166, 188, 208, .6); }
.championship-player:last-of-type { border-bottom: 0; }
.championship-player-name { font-weight: 700; color: #27364a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding-right: 8px; }
.championship-score { min-width: 30px; align-self: stretch; display: flex; align-items: center; justify-content: center; margin-right: -7px; background: #111c2d; color: #fff; font-weight: 800; }
.championship-winner { background: rgba(219, 244, 226, .75); }
.championship-match-winner { padding: 5px 9px; border-top: 1px solid #c8dfcf; background: #f1fbf4; font-size: .75em; }
.championship-vs { position: absolute; top: 50%; right: 28px; transform: translateY(-50%); z-index: 4; width: 22px; height: 22px; border: 1px solid #c6d7e8; border-radius: 50%; background: #fff; color: #68809f; display: flex; align-items: center; justify-content: center; font-size: 9px; font-weight: 800; }

.championship-final-column .championship-positioned-match { box-shadow: 0 4px 12px rgba(32, 63, 95, .13); }
.championship-final-column .championship-round-column-title h3 { color: #4f6fa8; }

.championship-connector { position: absolute; display: block; pointer-events: none; z-index: 1; background: #9db9d8; }
.championship-connector-horizontal { height: 2px; }
.championship-connector-vertical { width: 2px; }

.championship-game-link { text-decoration: none; }
.championship-game-link:hover { text-decoration: underline; }

.successbox { margin: 12px 0 18px; padding: 12px 14px; border: 1px solid #b8d8b8; border-left: 4px solid #5cb85c; background: #f4faf4; }
.successbox h3 { margin-top: 0; }
.notice { margin: 12px 0 18px; padding: 12px 14px; border: 1px solid #ddd; background: #f8f8f8; }

@media (max-width: 800px) {
    .championship-bracket-wrap { padding-bottom: 22px; }
    .championship-positioned-match { width: 215px; }
}
