/* Consistent spacing and touch targets for the tournament workspace. */
.br-event-manager { width: min(92vw,480px); max-height: 85vh; overflow: auto; padding: 24px; border: 1px solid #159beb; border-radius: 16px; background: #061727; color: #eef7ff; }
.br-event-manager::backdrop { background: #000b; }
.br-event-manager h2 { margin-top: 0; }
.br-event-manager p { font-size: 13px; color: #aac3d6; line-height: 1.6; }
.br-event-manager label { display: grid; gap: 8px; margin: 16px 0; }
.br-event-manager input,.br-event-manager select { min-width: 0; width: 100%; min-height: 44px; background: #02101c; color: #fff; border: 1px solid #38779e; border-radius: 6px; padding: 10px; }
.br-event-manager > div { display: flex; gap: 8px; flex-wrap: wrap; }
.br-event-manager button { min-height: 44px; padding: 10px 14px; border: 1px solid #39779d; border-radius: 6px; color: #fff; background: #074a89; }
.br-event-manager [data-event-delete] { background: #6a2432; }
.br-page { --br-icon: 48px; padding-top: 12px; }
.br-top { display: flex; min-height: 68px; gap: 12px; padding: 8px 0 16px; }
.br-top b { position: absolute; left: 50%; transform: translateX(-50%); white-space: nowrap; }
.br-top button { flex: 0 0 auto; min-width: 44px; height: 44px; padding: 0 10px; }
.br-top button[data-br-event] { margin-left: auto; gap: 10px; font-size: 14px; }
.br-top button[data-br-event] { max-width: 26%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.br-top button[data-br-event] span { display: block; width: 8px; height: 8px; font-size: 0; line-height: 0; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin-top: -4px; }
.br-top button:last-child { width: 44px; }
.br-top svg { flex: 0 0 auto; }
.br-hero { padding: 8px 12px 24px; }
.br-hero > .br-cup { margin: 0 auto 8px; }
.br-hero h1 { margin: 0; }
.br-hero p { margin-top: 12px; }
.br-panel { padding: 20px; margin-top: 16px; }
.br-panel > header, .br-panel.result > header { display: grid; grid-template-columns: var(--br-icon) minmax(0,1fr); align-items: center; gap: 14px; margin-bottom: 18px; }
.br-panel > header > i { width: var(--br-icon); height: var(--br-icon); display: grid; place-items: center; }
.br-panel > header > i svg { width: 26px; height: 26px; }
.br-panel h2 { line-height: 1.35; }
.br-panel header p { margin: 4px 0 0; line-height: 1.5; }
.br-panel:has(> #br-name) { grid-template-columns: var(--br-icon) minmax(0,1fr); gap: 8px 14px; align-items: start; }
.br-panel:has(> #br-name) h2 { margin: 0; }
.br-panel:has(> #br-name) i { align-self: center; }
.br-panel > #br-name { min-width: 0; min-height: 48px; }
.br-settings { align-items: stretch; gap: 12px; }
.br-settings > label, .br-settings fieldset { min-width: 0; padding: 14px; }
.br-settings legend, .br-settings > label > span { display: block; line-height: 1.4; margin-bottom: 12px; }
.br-settings fieldset > label { min-height: 34px; margin: 5px 0; }
.team-count { grid-template-columns: 44px minmax(0,1fr) 44px; margin-top: 0; gap: 0; }
.team-count > * { height: 48px; }
.team-count button { padding: 0; }
.team-count button svg { width: 22px; height: 22px; }
.orientation { align-items: stretch; gap: 8px; }
.orientation button { min-height: 76px; align-content: center; gap: 8px; padding: 8px 4px; }
.orientation small { font-size: 11px; line-height: 1.4; }
.br-team-inputs { gap: 20px; }
.br-team-column { min-width: 0; gap: 8px; }
.br-team-head, .br-team-inputs label { grid-template-columns: 36px minmax(0,1fr) 46px; gap: 6px; }
.br-team-head > span { background: transparent; text-align: center; }
.br-team-head > span:nth-child(2) { justify-items: start; padding-left: 10px; }
.br-team-inputs input, .br-team-inputs b, .br-team-inputs label > span { height: 44px; }
.br-team-inputs input { font-size: 13px; }
.br-primary { padding: 14px 18px; gap: 12px; line-height: 1.5; }
.br-primary svg { flex-shrink: 0; width: 24px; height: 24px; }
.br-panel.result > header { grid-template-columns: var(--br-icon) minmax(0,1fr) auto; }
.br-tools { grid-column: auto; gap: 8px; align-items: center; }
.br-tools button { width: 44px; height: 44px; padding: 0; }
.br-tools button svg { width: 23px; height: 23px; }
.br-board { margin: 0; padding: 24px 18px; border-radius: 14px; overscroll-behavior-x: contain; }
.br-board .br-round.champion > .br-trophy { display: flex !important; flex-direction: column !important; justify-content: center; align-items: center; gap: 12px; }
.br-trophy img { display: block; flex: 0 0 auto; }
.br-trophy strong { overflow-wrap: anywhere; }
.br-board.vertical .br-rounds { min-width: 680px; gap: 36px; }
.br-board.vertical .br-round > div:not(.br-trophy) { grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 24px; }
.br-board.vertical .br-round.champion { justify-self: center; width: 200px; }
.br-board.vertical .br-trophy { min-height: 210px; }
.br-page button:focus-visible, .br-page input:focus-visible { outline: 2px solid #53dbff; outline-offset: 3px; }
@media (max-width: 700px) {
  .br-page { --br-icon: 42px; padding: 8px 12px 28px; }
  .br-top b { font-size: 25px; }
  .br-top em { font-size: 38px; }
  .br-panel { padding: 16px; }
  .br-panel h2 { font-size: 14px; }
  .br-panel header p { font-size: 11px; }
  .br-settings { grid-template-columns: 1fr 1fr; }
  .br-settings > label { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr minmax(150px, 50%); align-items: center; gap: 12px; }
  .br-settings > label > span { margin: 0; }
  .br-settings span, .br-settings legend { font-size: 12px; }
  .br-settings fieldset > label { font-size: 12px; gap: 7px; }
  .br-settings input[type=radio] { width: 22px; height: 22px; }
  .br-settings input:checked { border-width: 6px; }
  .br-panel > #br-name { font-size: 14px; }
  .br-primary { min-height: 56px; font-size: 13px; }
}
@media (max-width: 480px) {
  .br-top { display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; gap: 8px; padding-bottom: 8px; }
  .br-top b { position: static; transform: none; grid-column: 2; grid-row: 1; }
  .br-top button:last-child { grid-column: 3; grid-row: 1; }
  .br-top button[data-br-event] { grid-column: 2; grid-row: 2; justify-self: center; margin: 0; min-height: 44px; }
  .br-top button[data-br-event] { max-width: 100%; }
  .br-hero { padding: 4px 0 22px; }
  .br-hero > .br-cup { width: 124px; height: 124px; margin-bottom: 10px; }
  .br-hero h1 { font-size: clamp(34px,9.5vw,44px); word-spacing: 2px; }
  .br-hero p { font-size: 10px; letter-spacing: 1px; padding: 0 10px; }
  .br-panel > header, .br-panel.result > header { gap: 10px; }
  .br-settings { grid-template-columns: minmax(0,1fr); }
  .br-settings > label { grid-column: auto; }
  .br-settings fieldset { padding: 12px; }
  .br-settings fieldset > label { min-height: 40px; font-size: 13px; }
  .orientation button { min-height: 72px; }
  .br-team-inputs { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .br-team-head { font-size: 10px; }
  .br-team-inputs label { grid-template-columns: 36px minmax(0,1fr) 46px; }
  .br-team-inputs input { font-size: 13px; }
  .br-panel.result > header { grid-template-columns: var(--br-icon) minmax(0,1fr); }
  .br-tools { grid-column: 1 / -1; justify-content: flex-end; padding-top: 2px; }
  .br-board { padding: 18px 12px; }
}