/* Tournament bracket generator (tools.d, 2026-10-11). Every rule under #visu-tools .vt-bracket-generator; 1px hairline
 * borders. Setup on top, board below at full width; the knockout scrolls sideways inside .vt-bg-scroll, never the page. */
#visu-tools .vt-bracket-generator.vt-app { grid-template-columns: minmax(0, 1fr); }
#visu-tools .vt-bracket-generator .vt-out { position: static; }
#visu-tools .vt-bracket-generator .vt-bg-cols { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; }
#visu-tools .vt-bracket-generator :is(.vt-bg-col-names, .vt-bg-col-opts) { display: grid; gap: 12px; align-content: start; min-width: 0; }
#visu-tools .vt-bracket-generator .vt-bg-col-opts > div:not([hidden]) { display: grid; }
#visu-tools .vt-bracket-generator .vt-bg-grid:not([hidden]) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
#visu-tools .vt-bracket-generator .vt-bg-points { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
#visu-tools .vt-bracket-generator .vt-check { min-height: 0; align-items: flex-start; }
#visu-tools .vt-bracket-generator .vt-style { margin-top: 2px; }
#visu-tools .vt-bracket-generator .vt-seg-item span { min-height: 38px; padding: 7px 13px; font-size: 14px; }
#visu-tools .vt-bracket-generator .vt-seg-items { flex-wrap: wrap; overflow: visible; margin: 0; padding: 0; }
#visu-tools .vt-bracket-generator .vt-bg-plan { font-size: 14px; color: var(--vt-muted); min-height: 1.5em; }
#visu-tools .vt-bracket-generator .vt-bg-setup > .vt-actions { margin-top: 18px; }
#visu-tools .vt-bracket-generator .vt-bg-setup > .vt-actions + .vt-hint { margin-top: 10px !important; }
#visu-tools .vt-bracket-generator .vt-bg-view { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 14px; padding: 12px 14px; border-radius: 12px; background: var(--vt-tint); font-size: 14.5px; }
#visu-tools .vt-bracket-generator .vt-bg-view p { flex: 1 1 240px; }
#visu-tools .vt-bracket-generator .vt-bg-empty { padding: 28px 16px; text-align: center; font-size: 15px; color: var(--vt-muted); border: 1px solid var(--vt-line); border-radius: 14px; background: var(--vt-bg); }
#visu-tools .vt-bracket-generator .vt-bg-result:not([hidden]) { display: grid; gap: 10px; min-width: 0; }
#visu-tools .vt-bracket-generator .vt-bg-heading { font-size: 22px; font-weight: 720; color: var(--vt-ink); letter-spacing: -0.02em; overflow-wrap: anywhere; }
#visu-tools .vt-bracket-generator .vt-bg-sub { font-size: 14px; color: var(--vt-muted); margin-top: -6px !important; }
#visu-tools .vt-bracket-generator .vt-bg-podium:not([hidden]) { display: flex; flex-wrap: wrap; gap: 4px 18px; padding: 10px 14px; border-radius: 12px; background: #e7f7ef; color: #064e3b; font-size: 15px; }
#visu-tools .vt-bracket-generator .vt-bg-board { display: grid; gap: 12px; min-width: 0; }
#visu-tools .vt-bracket-generator .vt-bg-section { margin-top: 8px !important; font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--vt-muted); }

/* Knockout: columns per round; the matches of a round spread out so each sits between the two that feed it. */
#visu-tools .vt-bracket-generator .vt-bg-scroll { overflow-x: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; padding: 4px 2px 12px; border-radius: 12px; }
#visu-tools .vt-bracket-generator .vt-bg-bracket { display: flex; align-items: stretch; gap: 22px; width: max-content; min-width: 100%; }
#visu-tools .vt-bracket-generator .vt-bg-roundcol { flex: 0 0 216px; display: flex; flex-direction: column; gap: 8px; }
#visu-tools .vt-bracket-generator .vt-bg-colbody { flex: 1 1 auto; display: flex; flex-direction: column; justify-content: space-around; gap: 10px; }
#visu-tools .vt-bracket-generator .vt-bg-roundname { font-size: 13px; font-weight: 700; color: var(--vt-accent-text); }
#visu-tools .vt-bracket-generator .vt-bg-third { display: grid; gap: 8px; max-width: 216px; }
#visu-tools .vt-bracket-generator .vt-bg-match { border: 1px solid var(--vt-line-2); border-radius: 12px; background: #fff; overflow: hidden; min-width: 0; }
#visu-tools .vt-bracket-generator .vt-bg-side { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 6px; min-height: 44px; padding: 3px 4px 3px 10px; }
#visu-tools .vt-bracket-generator .vt-bg-side + .vt-bg-side { border-top: 1px solid var(--vt-line); }
#visu-tools .vt-bracket-generator .vt-bg-name { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; text-align: left !important;
  min-width: 0; min-height: 0 !important; width: auto !important; margin: 0 !important; padding: 5px 0 !important; border: 0 !important; border-radius: 0 !important; background: none !important; box-shadow: none !important;
  color: var(--vt-ink) !important; font: 600 14.5px/1.25 inherit !important; letter-spacing: 0 !important; text-transform: none !important; white-space: normal !important; }
#visu-tools .vt-bracket-generator button.vt-bg-name:not(:disabled) { cursor: pointer; }
#visu-tools .vt-bracket-generator button.vt-bg-name:disabled { opacity: 1; cursor: default; }
#visu-tools .vt-bracket-generator .vt-bg-ghost .vt-bg-name { color: var(--vt-muted) !important; font-weight: 500 !important; }
#visu-tools .vt-bracket-generator .vt-bg-win { background: var(--vt-tint); }
#visu-tools .vt-bracket-generator .vt-bg-win .vt-bg-name { font-weight: 760 !important; }
#visu-tools .vt-bracket-generator .vt-bg-tick { display: none; color: var(--vt-ok); font-weight: 700; font-size: 14px; }
#visu-tools .vt-bracket-generator .vt-bg-picked .vt-bg-tick { display: inline; }
#visu-tools .vt-bracket-generator input.vt-bg-score { width: 46px !important; min-height: 36px; padding: 4px 2px !important; border-radius: 9px !important; text-align: center; font-weight: 700 !important; font-variant-numeric: tabular-nums; }
#visu-tools .vt-bracket-generator input.vt-bg-score:disabled { background: var(--vt-bg) !important; border-color: var(--vt-line) !important; opacity: 1; -webkit-text-fill-color: var(--vt-ink); }
#visu-tools .vt-bracket-generator .vt-bg-wait { background: var(--vt-bg); }
#visu-tools .vt-bracket-generator .vt-bg-auto { background: var(--vt-bg); border-style: dashed; }

/* League and group matches: a grid of the same boxes. */
#visu-tools .vt-bracket-generator .vt-bg-roundblock { display: grid; gap: 8px; }
#visu-tools .vt-bracket-generator .vt-bg-lgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px; }
#visu-tools .vt-bracket-generator .vt-bg-rest { font-size: 13px; color: var(--vt-muted); }
#visu-tools .vt-bracket-generator .vt-bg-groups { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 14px; }
#visu-tools .vt-bracket-generator .vt-bg-group { display: grid; gap: 10px; align-content: start; padding: 14px; border: 1px solid var(--vt-line); border-radius: 14px; background: var(--vt-bg); min-width: 0; }
#visu-tools .vt-bracket-generator .vt-bg-groupname { font-weight: 720; color: var(--vt-ink); font-size: 16px; }
#visu-tools .vt-bracket-generator .vt-bg-group .vt-table-wrap { background: #fff; }
#visu-tools .vt-bracket-generator .vt-bg-table :is(th, td) { padding: 8px 7px; text-align: right; white-space: nowrap; width: auto; font-variant-numeric: tabular-nums; vertical-align: middle; }
#visu-tools .vt-bracket-generator .vt-bg-table thead th { font-size: 12.5px; }
#visu-tools .vt-bracket-generator .vt-bg-table :is(th, td):first-child { text-align: left; padding-left: 12px; color: var(--vt-muted); }
#visu-tools .vt-bracket-generator .vt-bg-table :is(th, td):nth-child(2) { text-align: left; white-space: normal; overflow-wrap: anywhere; width: 99%; }
#visu-tools .vt-bracket-generator .vt-bg-table tbody th { color: var(--vt-ink); font-weight: 600; }
#visu-tools .vt-bracket-generator .vt-bg-table tbody tr:last-child :is(th, td) { border-bottom: 0; }
#visu-tools .vt-bracket-generator .vt-bg-pts { font-weight: 750; color: var(--vt-accent-text); }
#visu-tools .vt-bracket-generator .vt-bg-top :is(th, td) { background: var(--vt-tint); }
#visu-tools .vt-bracket-generator .vt-bg-linkbox:not([hidden]) { display: grid; gap: 6px; max-width: 640px; }
#visu-tools .vt-bracket-generator .vt-bg-linkbox input { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important; font-size: 13px !important; color: var(--vt-muted) !important; text-overflow: ellipsis; }
@media (max-width: 860px) {
  #visu-tools .vt-bracket-generator .vt-bg-cols { grid-template-columns: minmax(0, 1fr); gap: 16px; }
}
@media (max-width: 600px) {
  #visu-tools .vt-bracket-generator .vt-bg-roundcol { flex-basis: 200px; }
  #visu-tools .vt-bracket-generator .vt-bg-bracket { gap: 14px; }
  #visu-tools .vt-bracket-generator .vt-bg-group { padding: 10px; }
}