/* Based on ShowdownParty/static/party.css: original finals cards and connectors.
   Shared unchanged with StormPortal. Row spans support 2 through 64 teams. */
.tb-bracket { --tb-muted:#aabbd6; --tb-text:#edf4ff; --tb-green:#7effc4; --tb-line:rgba(126,255,196,.4); --slot-height:92px; color:var(--tb-text); border:1px solid rgba(106,166,255,.18); border-radius:16px; background:linear-gradient(140deg,rgba(106,166,255,.06),rgba(126,255,196,.025)); padding:20px; min-width:0; margin:1rem 0; }
.tb-bracket-grid { display:grid; grid-auto-flow:column; grid-auto-columns:300px; gap:40px; align-items:stretch; overflow:auto; padding:4px 4px 18px; -webkit-overflow-scrolling:touch; }
.tb-round { min-width:0; display:grid; grid-template-rows:auto 1fr; gap:14px; }
.tb-round h4 { display:flex; justify-content:space-between; align-items:center; margin:0; padding:0 4px 12px; border-bottom:1px solid rgba(106,166,255,.22); color:var(--tb-text); font-size:1rem; }
.tb-round h4 small { font-size:.76rem; letter-spacing:.1em; color:var(--tb-muted); }
.tb-round-matches { display:grid; grid-template-rows:repeat(var(--bracket-rows),var(--slot-height)); position:relative; }
.tb-match { position:relative; align-self:center; box-sizing:border-box; border:1px solid rgba(255,255,255,.13); border-radius:12px; background:#101b2e; padding:12px; display:grid; gap:9px; box-shadow:0 8px 20px rgba(0,0,0,.15); min-width:0; }
.tb-round:not(:last-child) .tb-match:nth-child(odd)::after { content:""; position:absolute; pointer-events:none; top:50%; left:100%; width:20px; height:calc(var(--match-span)*var(--slot-height)); border:2px solid var(--tb-line); border-left:0; border-radius:0 6px 6px 0; box-sizing:border-box; }
.tb-round:not(:first-child) .tb-match::before { content:""; position:absolute; top:50%; right:100%; width:20px; border-top:2px solid var(--tb-line); pointer-events:none; }
.tb-match.done { border-color:rgba(126,255,196,.42); }
.tb-match-head { display:flex; justify-content:space-between; gap:10px; color:var(--tb-muted); font-size:.73rem; font-weight:800; }
.tb-match-head strong { color:var(--tb-green); font-size:.73rem; }
.tb-match-body { display:grid; gap:7px; }
.tb-team-row { display:grid; grid-template-columns:minmax(0,1fr) 28px; align-items:center; gap:8px; border:1px solid rgba(255,255,255,.075); border-radius:9px; padding:8px; background:rgba(255,255,255,.025); min-width:0; }
.tb-team-row.winner { border-color:rgba(126,255,196,.4); background:rgba(126,255,196,.1); }
.tb-score { color:var(--tb-green); font-size:1.2rem; text-align:center; font-variant-numeric:tabular-nums; }
.tb-participant { min-width:0; display:grid; gap:3px; position:relative; }
.tb-participant strong { display:flex; gap:6px; align-items:baseline; min-width:0; font-size:.9rem; line-height:1.3; overflow-wrap:anywhere; }
.tb-participant em { color:#ffd478; font-style:normal; font-size:.72rem; flex:0 0 auto; }
.tb-participant small { color:#8fb7ff; font-size:.72rem; overflow-wrap:anywhere; }
.tb-participant.placeholder strong { color:var(--tb-muted); font-weight:500; }
.tb-match-footer { display:flex; justify-content:space-between; align-items:center; gap:8px; min-height:0; }
.tb-match-footer:empty { display:none; }
.tb-winner-label { font-size:.7rem; color:var(--tb-green); overflow-wrap:anywhere; }
.tb-bracket .tb-score-button { padding:.25rem .5rem; font-size:.72rem; }
.tb-special { color:#f5d0fe; background:#581c87; border:1px solid #c084fc; border-radius:4px; padding:1px 5px; font-size:.68rem; white-space:nowrap; }
.tb-champion { display:flex; align-items:center; gap:16px; padding:18px 20px; margin-bottom:22px; border:1px solid #ffd47899; border-radius:12px; background:linear-gradient(130deg,#ffd47822,#7effc40b); }
.tb-champion > span { color:#ffd478; font-size:3rem; line-height:1; }
.tb-champion div { display:grid; gap:4px; min-width:0; overflow-wrap:anywhere; }
.tb-champion small { color:#ffd478; font-weight:800; }
.tb-champion strong { font-size:1.25rem; }
.tb-score-dialog { width:min(460px,calc(100vw - 32px)); box-sizing:border-box; max-height:85vh; overflow:auto; color:#edf4ff; background:#101b2e; border:1px solid #45627e; border-radius:14px; padding:22px; }
.tb-score-dialog::backdrop { background:#000b; }
.tb-score-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin:20px 0; }
.tb-score-fields label { display:grid; gap:10px; min-width:0; overflow-wrap:anywhere; }
.tb-score-fields input { width:100%; box-sizing:border-box; }
.tb-score-actions { display:flex; flex-wrap:wrap; gap:8px; }
.tb-placement-editor { margin:1rem 0; border:1px solid #45627e; border-radius:12px; padding:14px; }
.tb-placement-editor > summary { cursor:pointer; color:#b4d2ff; font-weight:700; }
.tb-bracket.is-placement { --slot-height:160px; }
.tb-bracket.is-placement .tb-team-row { grid-template-columns:minmax(0,1fr); }
.tb-bracket.is-placement .tb-score { display:none; }
.tb-bracket.is-placement .tournament-slot { margin:0; min-width:0; }
.tb-bracket.is-placement .tournament-team-chip { display:flex; flex-wrap:wrap; align-items:center; gap:5px; padding:3px; }
.tb-bracket.is-placement [data-select-team] { flex:1; min-width:0; text-align:left; }
.tb-bracket.is-placement [data-place-team] { width:100%; margin-top:5px; }
.tb-placement-editor .tournament-pool-panel { position:static; }
.tb-placement-editor .tournament-pool { min-height:80px; border:1px dashed #64748b; padding:10px; margin:10px 0; display:flex; flex-wrap:wrap; gap:8px; }
@media(max-width:600px) { .tb-bracket { padding:12px; } .tb-bracket-grid { grid-auto-columns:270px; } .tb-score-dialog { padding:16px; } }
.tb-bracket { --slot-height:112px; }
.tb-bracket.is-admin { --slot-height:124px; }
.tb-bracket .tb-team-info { width:100%; text-align:left; color:inherit; border:0; border-radius:4px; background:transparent; padding:0; cursor:pointer; font:inherit; }
.tb-bracket .tb-team-info:hover { background:rgba(106,166,255,.1); }
.tb-bracket .tb-team-info:focus-visible { outline:2px solid #8fb7ff; outline-offset:4px; }
.tb-participant strong > span { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.tb-roster-dialog ul { list-style:none; margin:16px 0; padding:0; display:grid; gap:10px; }
.tb-roster-dialog li { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:8px 0; border-bottom:1px solid #ffffff18; overflow-wrap:anywhere; }
/* A compact, stable drag target keeps placement cards within their row spans. */
.tb-bracket.is-placement .tournament-slot { padding:5px; }
.tb-bracket.is-placement .tournament-team-chip { display:grid; grid-template-columns:18px minmax(0,1fr) 32px; gap:4px; width:100%; box-sizing:border-box; }
.tb-bracket.is-placement [data-select-team] { padding:6px; width:100%; }
.tb-bracket.is-placement [data-remove-team] { width:32px; min-width:0; padding:5px 1px; font-size:.65rem; line-height:1.2; }
.tb-bracket.is-placement [data-place-team] { padding:5px; font-size:.7rem; }
.tb-participant > small { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.tb-heading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:baseline; gap:8px 20px; padding:0 4px 20px; }
.tb-heading strong { font-size:1.05rem; letter-spacing:.02em; }
.tb-heading small { color:var(--tb-muted); font-size:.75rem; }
.tb-score-fields input { min-height:54px; border:1px solid #45627e; border-radius:9px; padding:10px; color:#edf4ff; background:#071121; font-size:1.5rem; font-weight:700; text-align:center; color-scheme:dark; }
.tb-score-fields input:focus { outline:2px solid #7effc4; outline-offset:2px; }