/* ── Page layout: use more width ──────────────────────────── */
main { max-width: 1400px !important; }

/* ── Tournament header / tabs ─────────────────────────────── */
.t-header { display:flex; align-items:center; gap:12px; margin-bottom:20px; }
.t-header h2 { font-size:22px; font-weight:700; color:var(--gold); margin:0; flex:1; }
.t-section { background:var(--bg2); border:1px solid var(--border); border-radius:var(--radius); padding:20px; margin-bottom:20px; }
.t-tabs { display:flex; gap:4px; margin-bottom:16px; border-bottom:1px solid var(--border); }
.t-tab { font-size:13px; font-weight:600; color:var(--text2); background:none; border:none; border-bottom:2px solid transparent; padding:8px 16px; cursor:pointer; transition:color 0.15s; }
.t-tab.active { color:var(--gold); border-bottom-color:var(--gold); }
.t-tab-panel { display:none; }
.t-tab-panel.active { display:block; }

/* ── DE section dividers ───────────────────────────────────── */
.bracket-section-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.08em; border-bottom:1px solid var(--border); padding-bottom:6px; margin-bottom:12px; }

/* ── Bracket sizing overrides (bigger than global defaults) ── */
.bracket-col { min-width:210px; position:relative; z-index:1; }
.bracket-col-label { font-size:11px; padding:10px 0 12px; letter-spacing:0.07em; }
.bracket-match { margin:5px 12px; border-radius:8px; }
.bracket-match[data-state="active"] { border-color:rgba(200,169,81,0.55); box-shadow:0 0 0 1px rgba(200,169,81,0.2); }
.bracket-slot { padding:8px 12px; font-size:13px; min-height:32px; }

/* ── Remove CSS connector pseudo-elements (SVG handles this) ─ */
.bracket-pair::before, .bracket-pair::after { display:none !important; }

/* ── SVG connector overlay ────────────────────────────────── */
.bracket { position:relative; }
.connector-svg { position:absolute; top:0; left:0; pointer-events:none; z-index:0; overflow:visible; }
.conn-path { stroke:var(--border); stroke-width:1.5; fill:none; stroke-linecap:round; opacity:0.8; }
.conn-path.conn-done { stroke:rgba(200,169,81,0.35); }

/* ── Bracket UI controls bar ──────────────────────────────── */
.bracket-ui-controls { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:8px; margin-bottom:14px; }
.bracket-zoom-controls { display:flex; align-items:center; gap:4px; }
.bzoom-btn { background:var(--bg3,#1e2030); border:1px solid var(--border); border-radius:5px; color:var(--text); cursor:pointer; font-size:15px; font-weight:700; line-height:1; padding:3px 10px; transition:background 0.1s; }
.bzoom-btn:hover { background:var(--bg4,var(--border)); }
#zoom-pct { font-size:12px; color:var(--text2); min-width:38px; text-align:center; }

/* ── Current-round pill ───────────────────────────────────── */
.current-round-pill { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; color:var(--gold); background:rgba(200,169,81,0.08); border:1px solid rgba(200,169,81,0.25); border-radius:20px; padding:4px 12px; }
.current-round-pill.complete { color:var(--text2); background:transparent; border-color:var(--border); }

/* ── Player path highlight ────────────────────────────────── */
.bracket-slot[data-pid] { cursor:pointer; transition:opacity 0.12s, box-shadow 0.12s; }
.bracket-slot.hl { box-shadow:inset 0 0 0 2px var(--gold); background:rgba(200,169,81,0.13) !important; opacity:1 !important; }
.bracket-slot.hl-dim { opacity:0.15; }

@media (max-width:600px) {
  .bracket-col { min-width:140px; }
  .bracket-slot { font-size:11px; padding:5px 8px; }
  .bracket-match { margin:3px 8px; }
}