/* BP reuses the entry lobby's team, slot, portrait and filter components. */
#bpBoard.bp-board { display:flex; justify-content:center; align-items:center; background:#070e16; }
#bpBoard .bp-workspace.bp-arena {
  --arena-blue:#67c5fc; --arena-red:#f48b9a; --arena-line:#293b4e;
  color:#e4eaf0; width:min(1480px,calc(100% - 64px)); height:calc(100% - 44px);
  min-height:0; max-height:1100px; margin:auto; padding:20px 28px 28px;
  border:1px solid #47566b; border-radius:16px;
  background:radial-gradient(ellipse at 50% 0,#1d2d40 0,transparent 65%),#0b131e;
  box-shadow:0 25px 80px #0006;
}
#bpBoard .bp-workspace.bp-arena .bp-toolbar { display:flex; flex-wrap:wrap; align-content:center; align-items:center; gap:6px; flex-shrink:0; height:68px; min-height:68px; padding:0 0 16px; border-bottom:1px solid #283749; background:transparent; }
#bpBoard .bp-arena #bpTitle { position:relative; font-size:23px; letter-spacing:1px; line-height:1.35; margin:0 auto 0 0; }
#bpBoard .bp-arena #bpTitle .lobby-eyebrow { display:block; font-size:8px; line-height:1.6; letter-spacing:2px; margin-bottom:2px; }
#bpBoard .bp-arena #bpTitle small { font-size:11px; letter-spacing:0; color:#8b9eb2; font-weight:400; }
#bpBoard .bp-arena .bp-toolbar button { width:auto; min-height:29px; padding:5px 8px; border-radius:5px; background:#101c29; border:1px solid #334357; color:#b6c5d4; font-size:10px; }
#bpBoard .bp-arena .bp-toolbar button:hover { border-color:#a98e5d; background:#1c2b3b; }
#bpBoard .bp-arena #bpSaveStatus { font-size:9px; color:#8faaa2; margin:0 4px; }
#bpBoard .bp-arena .bp-tabs { display:none; }
#bpBoard .bp-workspace.bp-arena .bp-columns,
#bpBoard .bp-workspace.bp-arena[data-complete="true"] .bp-columns {
  flex:1; display:grid; min-height:0; grid-template-columns:225px minmax(0,1fr) 225px;
  grid-template-rows:110px minmax(0,1fr); grid-template-areas:'progress progress progress' 'blue heroes red';
  gap:22px 26px; padding:20px 0 18px; overflow:hidden; position:relative;
}
#bpBoard .bp-workspace.bp-arena .bp-draft,#bpBoard .bp-workspace.bp-arena .bp-draft-content,#bpBoard .bp-workspace.bp-arena .bp-matchup,
#bpBoard .bp-workspace.bp-arena .bp-columns[data-panel] > .bp-draft { display:contents; }
#bpBoard .bp-workspace.bp-arena .bp-team { display:grid; grid-area:blue; grid-template-rows:30px minmax(0,1fr) 55px; min-height:0; padding:0; border:0; border-radius:0; box-shadow:none; background:transparent; overflow:hidden; }
#bpBoard .bp-workspace.bp-arena .bp-team[data-side="red"] { grid-area:red; }
#bpBoard .bp-arena .bp-team-heading.lobby-team-title { height:25px; padding:0; margin:0 0 5px; }
#bpBoard .bp-arena .bp-team-heading h3 { font-size:14px; white-space:nowrap; }
#bpBoard .bp-arena .bp-team-heading .bp-pick-count { font-size:10px; }
#bpBoard .bp-arena .bp-team[data-active="true"] .lobby-side-dot { box-shadow:0 0 12px #e3c586; background:#e3c586; }
#bpBoard .bp-workspace.bp-arena .bp-slots.lobby-slots { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(5,minmax(0,1fr)); gap:9px; min-height:0; }
#bpBoard .bp-workspace.bp-arena .bp-slot.lobby-slot-row { display:block; min-height:0; height:100%; padding:0; border:0; background:transparent; }
#bpBoard .bp-workspace.bp-arena .bp-pick-cell.lobby-slot { width:100%; height:100%; min-height:0; min-width:0; overflow:hidden; padding:11px; border-color:color-mix(in srgb,var(--side) 36%,#304052); cursor:grab; touch-action:none; user-select:none; container-type:normal; }
#bpBoard .bp-workspace.bp-arena .bp-pick-cell.lobby-slot.is-empty { cursor:default; }
#bpBoard .bp-workspace.bp-arena .bp-pick-cell .bp-portrait { zoom:1; transform:none; flex-shrink:0; }
#bpBoard .bp-workspace.bp-arena .bp-team[data-active="true"] .lobby-slot[aria-pressed="true"] { border-color:var(--side); }
#bpBoard .bp-workspace.bp-arena .is-pick-target .bp-pick-cell { border-color:#e4c583; box-shadow:inset 0 0 0 2px #bfa16b; }
#bpBoard .bp-workspace.bp-arena .is-pick-dragging { opacity:.25; }
.bp-pick-ghost { position:fixed; z-index:20000; pointer-events:none; transform:translate(-50%,-50%) scale(1.04); display:flex; align-items:center; justify-content:center; gap:10px; padding:8px; border:1px solid #d9bf84; border-radius:6px; background:#1b3040; box-shadow:0 8px 24px #0008; }
.bp-pick-ghost > span:not(.bp-portrait) { display:none; }
#bpBoard .bp-workspace.bp-arena .bp-team-bans { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; padding-top:10px; align-items:start; min-height:0; container-type:inline-size; }
#bpBoard .bp-arena .bp-bans-label { display:none; }
#bpBoard .bp-workspace.bp-arena .bp-team-ban { width:100%; aspect-ratio:1; height:auto; min-height:0; display:flex; justify-content:center; align-items:center; background:#152130; border:1px solid color-mix(in srgb,var(--side) 34%,#304052); border-radius:4px; overflow:hidden; }
#bpBoard .bp-arena .bp-team-ban[data-next="true"] { border-color:#d3b575; box-shadow:inset 0 0 0 1px #a38a56; }
#bpBoard .bp-arena .bp-team-ban .bp-portrait { zoom:calc(((100cqw - 24px)/5 - 5px)/32px); transform:none; }
#bpBoard .bp-workspace.bp-arena .bp-selector,
#bpBoard .bp-workspace.bp-arena .bp-columns[data-panel] > .bp-selector {
  grid-area:heroes; display:flex; flex-direction:column; gap:12px; width:auto; height:auto;
  min-width:0; min-height:0; padding:0; border:0; border-radius:0; background:transparent; overflow:hidden;
}
#bpBoard .bp-arena .bp-selector-tools { flex-shrink:0; display:grid; grid-template-columns:1fr auto; grid-template-rows:36px 26px 26px; gap:6px 8px; min-width:0; }
#bpBoard .bp-arena .bp-selector-tools h2 { grid-column:2; grid-row:1; font-size:9px; font-weight:400; color:#72849a; align-self:center; margin:0; }
#bpBoard .bp-arena #bpSearch { grid-column:1; grid-row:1; width:100%; min-width:0; min-height:36px; height:36px; padding:8px 12px; background:#0c1623; border:1px solid #334357; border-radius:5px; font-size:12px; }
#bpBoard .bp-arena #bpLane,#bpBoard .bp-arena .bp-class-filter { grid-column:1/-1; display:flex; gap:4px; justify-content:flex-start; align-items:center; overflow-x:auto; scrollbar-width:none; width:100%; padding:0; border:0; background:transparent; }
#bpBoard .bp-arena #bpLane { grid-row:2; } #bpBoard .bp-arena .bp-class-filter { grid-row:3; }
#bpBoard .bp-arena #bpLane button,#bpBoard .bp-arena .bp-class-filter button { width:auto; flex:0 0 auto; min-height:25px; height:25px; padding:3px 8px; border:1px solid transparent; border-radius:4px; background:transparent; color:#8496ac; font-size:10px; white-space:nowrap; }
#bpBoard .bp-arena #bpLane button[aria-pressed="true"],#bpBoard .bp-arena .bp-class-filter button[aria-pressed="true"] { border-color:#8e7851; background:#372f23; color:#e3cb9c; box-shadow:none; }
#bpBoard .bp-arena .bp-focus { flex:0 1 auto; min-height:0; max-height:33%; display:flex; flex-direction:column; gap:7px; padding-bottom:12px; border-bottom:1px solid #283749; }
#bpBoard .bp-arena .bp-focus header { display:flex; align-items:center; gap:10px; height:22px; min-height:22px; flex-shrink:0; background:transparent; padding:0; border:0; }
#bpBoard .bp-arena .bp-focus h3 { margin:0; font-size:11px; color:#c4d0df; font-weight:500; }
#bpBoard .bp-arena .bp-focus h3 small { color:#7f91a7; font-size:10px; font-weight:400; margin-left:5px; }
#bpBoard .bp-arena #bpEditFocus { margin-left:auto; min-height:23px; padding:2px 6px; border:0; background:transparent; color:#bca475; font-size:10px; }
#bpBoard .bp-arena .bp-focus-grid { display:grid; grid-template-columns:repeat(var(--bp-catalog-cols,1),minmax(0,1fr)); grid-auto-rows:var(--bp-catalog-size,54px); align-content:start; gap:var(--bp-catalog-gap,7px); min-height:calc(var(--bp-catalog-size,54px) + 7px); padding:2px 5px 5px 2px; margin:0; overflow:auto; scrollbar-width:thin; scrollbar-gutter:stable; scrollbar-color:#425267 transparent; flex-shrink:1; border:0; border-radius:5px; touch-action:none; }
#bpBoard .bp-arena .bp-focus-empty { grid-column:1/-1; font-size:11px; color:#62768c; padding:13px 0; pointer-events:none; }
#bpBoard .bp-arena .bp-focus-grid:has(.bp-focus-placeholder) .bp-focus-empty { display:none; }
#bpBoard .bp-arena .bp-focus-hero,#bpBoard .bp-arena .bp-focus-placeholder { width:100%; height:100%; min-height:0; min-width:0; padding:2px; border:1px solid #3b4c60; border-radius:5px; background:#152334; display:grid; place-items:center; touch-action:none; cursor:grab; }
#bpBoard .bp-arena .bp-focus-hero .bp-portrait { zoom:calc((var(--bp-catalog-size,54px) - 6px)/48px); transform:none; }
#bpBoard .bp-arena .bp-focus-hero.unavailable { opacity:.35; }
#bpBoard .bp-arena .bp-focus-hero.unavailable .bp-portrait { filter:grayscale(1); }
#bpBoard .bp-arena .bp-focus-placeholder { border:1px dashed #c4aa76; background:#273344; }
#bpBoard .bp-arena .bp-focus-grid.is-drop-target { outline:1px solid #b89a65; outline-offset:-1px; background:#1d2b3c; }
#bpBoard .bp-arena .bp-focus-grid .is-dragging,#bpBoard .bp-arena .bp-catalog-item.is-dragging { opacity:.18; }
#bpBoard .bp-arena .is-landing { visibility:hidden; }
.bp-focus-ghost { display:grid; place-items:center; background:#17283b; border-color:#c4aa76; }
.bp-focus-ghost .bp-portrait { zoom:calc(var(--bp-focus-portrait,48px)/48px); transform:none; }
#bpBoard .bp-workspace.bp-arena #bpGrid { flex:1; display:grid; align-content:start; min-height:72px; overflow-y:auto; overflow-x:hidden; scrollbar-width:thin; scrollbar-gutter:stable; scrollbar-color:#425267 transparent; padding:2px 5px 5px 2px; }
#bpBoard .bp-arena .bp-catalog-item { display:block; min-width:0; min-height:0; touch-action:none; user-select:none; }
#bpBoard .bp-workspace.bp-arena #bpGrid .bp-hero { display:flex; align-items:center; justify-content:center; width:100%; height:100%; min-height:0; padding:2px; border:1px solid #28384a; border-radius:5px; background:#131f2e; }
#bpBoard .bp-workspace.bp-arena #bpGrid .bp-hero > .bp-portrait { zoom:calc((var(--bp-catalog-size,64px) - 6px)/40px); transform:none; flex-shrink:0; }
#bpBoard .bp-arena .bp-catalog-item > .bp-hero:disabled { pointer-events:none; }
#bpBoard .bp-arena #bpGrid .bp-hero.unavailable { opacity:.28; }
#bpBoard .bp-arena .bp-search-empty { grid-column:1/-1; font-size:11px; color:#8295aa; }
.bp-empty-ban { display:block; position:relative; flex-shrink:0; width:22px; height:22px; border:2.5px solid #cf7769; border-radius:50%; box-sizing:border-box; }
.bp-empty-ban:after { content:''; position:absolute; left:50%; top:50%; width:112%; height:2.5px; background:#cf7769; transform:translate(-50%,-50%) rotate(45deg); border-radius:2px; }
#bpBoard .bp-arena #bpGrid .bp-empty-ban { width:30px; height:30px; }
#bpBoard .bp-arena .bp-progress { flex-shrink:0; }
#bpBoard .bp-arena .bp-progress { grid-area: progress; overflow: hidden; background: #0d1a26; border: 1px solid #294051; border-radius: 7px; padding: 8px 10px; display: grid; grid-template-rows: 26px minmax(0, 1fr); gap: 8px; }
#bpBoard .bp-arena .bp-progress-heading { display: flex; align-items: center; gap: 12px; min-width: 0; }
#bpBoard .bp-arena .bp-progress-heading > b { flex: 0 0 auto; font-size: 13px; letter-spacing: .3px; }
#bpBoard .bp-arena .bp-progress-heading > b span { color: #839eaf; font-weight: 400; margin-left: 5px; font-size: 11px; }
#bpBoard .bp-arena .bp-branches { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; min-width: 0; flex: 1; }
#bpBoard .bp-arena .bp-branches button { display: flex; align-items: center; gap: 6px; height: 25px; min-height: 25px; flex: 0 0 auto; padding: 2px 7px; border-radius: 4px; background: #102431; border: 1px solid #2b4657; font-size: 10px; }
#bpBoard .bp-arena .bp-branches button[aria-pressed="true"] { background: #264050; border-color: #7898aa; color: #e5eff6; }
#bpBoard .bp-arena .bp-branches small { color: #8aabbe; font-size: 9px; }
#bpBoard .bp-arena .bp-progress-reset { min-height: 24px; height: 24px; padding: 2px 7px; background: transparent; border-color: #2b4657; font-size: 10px; }
#bpBoard .bp-arena .bp-progress-track { display: grid; grid-template-columns: repeat(20, minmax(0, 1fr)); gap: 5px; min-height: 0; }
#bpBoard .bp-arena .bp-progress-step { --side: var(--arena-blue); position: relative; border: 1px solid #2d4656; border-bottom: 3px solid var(--side); border-radius: 3px; background: #152532; padding: 0; min-width: 0; min-height: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; gap: 2px; }
#bpBoard .bp-arena .bp-progress-step.red { --side: var(--arena-red); }
#bpBoard .bp-arena .bp-progress-step:disabled { opacity: 1; background: #0c1822; border-top-color: #1d303e; border-left-color: #1d303e; border-right-color: #1d303e; border-bottom-color: color-mix(in srgb, var(--side) 35%, #122330); }
#bpBoard .bp-arena .bp-progress-step .bp-portrait { zoom: 1; transform: none; flex-shrink: 0; max-width: 100%; }
#bpBoard .bp-arena .bp-progress-step small { font-size: 8px; color: #91aaba; line-height: 10px; letter-spacing: .5px; }
#bpBoard .bp-arena .bp-step-number { color: #405d71; font: 500 17px ui-monospace, monospace; }
#bpBoard .bp-arena .bp-progress-step.future { opacity: .48; }
#bpBoard .bp-arena .bp-progress-step[aria-current="step"] { outline: 1px solid #dfc58e; outline-offset: -2px; background: #3b3b31; }
#bpBoard .bp-arena .bp-progress-step:hover:enabled { border-color: #b8d7e5; }

#bpBoard .bp-arena .bp-progress-phase { display: grid; grid-template-columns: repeat(var(--steps), minmax(0,1fr)); gap: 4px; min-width: 0; min-height: 0; }
#bpBoard .bp-workspace.bp-arena .bp-progress-track { --phase-gap:14px; grid-template-columns:6fr 6fr 4fr 4fr; gap:var(--phase-gap); }
#bpBoard .bp-arena .bp-progress-phase { position:relative; }
#bpBoard .bp-arena .bp-progress-phase + .bp-progress-phase:before { content:''; position:absolute; top:6%; bottom:6%; left:calc(var(--phase-gap)*-.5 - 1px); width:2px; border-radius:2px; background:#70c8ae; box-shadow:0 0 4px #70c8ae40; pointer-events:none; }
#bpBoard .bp-arena .bp-game-switch select { min-height:25px; height:25px; padding:3px 24px 3px 8px; width:110px; font-size:10px; }
#bpBoard .bp-workspace.bp-arena .bp-columns[data-panel] > .bp-tree { display:none; }
#bpBoard .bp-workspace.bp-arena[data-tree-open="true"] .bp-columns[data-panel] > .bp-tree { display:flex; flex-direction:column; position:absolute; top:0; left:0; bottom:18px; width:300px; max-width:calc(100% - 40px); z-index:30; padding:16px 12px 12px; background:#10212f; border:1px solid #426174; box-shadow:0 12px 40px #0009; border-radius:7px; overflow:auto; }
#bpBoard .bp-arena #bpTreeClose { position:absolute; right:8px; top:6px; min-height:26px; width:28px; padding:0; font-size:20px; background:transparent; }
#bpBoard .bp-arena .bp-tree #bpTree { flex:1; min-height:70px; overflow-y:auto; margin:8px 0; }
#bpBoard .bp-arena .bp-history-drawer { border-top:1px solid #304756; padding-top:5px; }
#bpBoard .bp-arena .bp-history-drawer summary { cursor:pointer; padding:6px 2px; font-size:12px; }
#bpBoard .bp-arena .bp-history { height:auto; max-height:none; overflow:auto; border:0; padding:5px 0; }
#bpBoard .bp-arena .bp-history-games { display:grid; grid-template-columns:minmax(0,1fr); gap:8px; }
#bpBoard .bp-arena .bp-history-timeline { grid-template-columns:repeat(20,24px); width:100%; overflow-x:auto; }
#bpBoard .bp-workspace.bp-arena .bp-selector .bp-next-details { margin: 0; min-height: 0; overflow: hidden; border: 1px solid #7e704f; border-left:3px solid #c8ab70; border-radius: 6px; background:linear-gradient(105deg,#1a2b3a,#142331); }
#bpBoard .bp-workspace.bp-arena .bp-selector .bp-next-details #bpNextGame { position:static; display:grid; grid-template-columns:repeat(3,minmax(90px,1fr)) max-content max-content; align-items:end; gap:8px; padding:12px; margin:0; width:100%; min-height:max(72px,var(--bp-catalog-size,64px)); max-height:none; overflow:auto; box-shadow:none; background:transparent; border:0; }
#bpBoard .bp-workspace.bp-arena .bp-next-game label { display:flex; flex-direction:column; gap:5px; font-size:10px; min-width:0; white-space:nowrap; }
#bpBoard .bp-workspace.bp-arena .bp-next-game select { min-height:34px; height:34px; font-size:11px; padding:3px 20px 3px 7px; }
#bpBoard .bp-workspace.bp-arena .bp-next-game button { min-height:34px; height:34px; padding:5px 10px; font-size:11px; white-space:nowrap; }
#bpBoard .bp-workspace.bp-arena .bp-next-game button[type="submit"] { grid-column:auto; border:1px solid #c3a66c; background:#d3b77c; color:#172230; font-size:14px; font-weight:650; padding:5px 16px; }
#bpBoard .bp-workspace.bp-arena .bp-next-game button[type="submit"]:hover:not(:disabled) { background:#e1c78e; }
#bpBoard .bp-workspace.bp-arena .bp-next-game button[type="submit"]:disabled { opacity:.5; }
#bpBoard .bp-workspace.bp-arena .bp-next-game p { grid-column:1/-1; font-size:11px; line-height:1.5; margin:0; }
#bpBoard .bp-workspace.bp-arena #bpGrid[data-draft-locked="true"] .bp-hero:disabled { cursor: default; opacity: 1; }
#bpBoard .bp-workspace.bp-arena #bpGrid[data-draft-locked="true"] .bp-hero.unavailable { opacity: .32; }

#bpBoard .bp-arena .bp-next-details { flex-shrink:0; }
#bpBoard .bp-arena :is(button,input,select):focus-visible { outline:2px solid #e5ca8b; outline-offset:2px; }
@media(max-width:1200px) {
  #bpBoard .bp-workspace.bp-arena { width:calc(100% - 32px); padding:16px 20px 24px; height:calc(100% - 28px); }
  #bpBoard .bp-workspace.bp-arena .bp-columns,#bpBoard .bp-workspace.bp-arena[data-complete="true"] .bp-columns { grid-template-columns:180px minmax(0,1fr) 180px; gap:16px; }
  #bpBoard .bp-arena #bpTitle { font-size:20px; }
  #bpBoard .bp-arena #bpSaveStatus { display:none; }
}
@media(max-width:900px) {
  #bpBoard .bp-workspace.bp-arena { width:calc(100% - 24px); padding:12px 14px 22px; border-radius:12px; }
  #bpBoard .bp-workspace.bp-arena .bp-columns,#bpBoard .bp-workspace.bp-arena[data-complete="true"] .bp-columns { grid-template-columns:155px minmax(0,1fr) 155px; grid-template-rows:96px minmax(0,1fr); gap:14px 12px; padding-top:14px; }
  #bpBoard .bp-arena #bpTitle small { display:block; }
  #bpBoard .bp-arena #bpTitle .lobby-eyebrow { font-size:7px; }
  #bpBoard .bp-arena .bp-toolbar { gap:4px; }
  #bpBoard .bp-arena .bp-toolbar button { font-size:9px; padding:4px; }
  #bpBoard .bp-arena .bp-team-heading h3 { font-size:12px; letter-spacing:0; }
  #bpBoard .bp-arena .bp-progress-track { --phase-gap:10px; }
  #bpBoard .bp-arena .bp-progress-phase { gap:3px; }
  #bpBoard .bp-arena .bp-progress-step .bp-portrait { zoom:.8; }
}
@media(max-height:800px) {
  #bpBoard .bp-workspace.bp-arena { padding-top:12px; padding-bottom:18px; }
  #bpBoard .bp-workspace.bp-arena .bp-toolbar { height:57px; min-height:57px; padding-bottom:10px; }
  #bpBoard .bp-workspace.bp-arena .bp-columns,#bpBoard .bp-workspace.bp-arena[data-complete="true"] .bp-columns { grid-template-rows:94px minmax(0,1fr); padding-top:12px; gap:14px 16px; }
  #bpBoard .bp-workspace.bp-arena .bp-pick-cell.lobby-slot { padding:7px; gap:7px; }
  #bpBoard .bp-arena .bp-selector-tools { grid-template-rows:30px 23px 23px; gap:4px; }
  #bpBoard .bp-arena #bpSearch { height:30px; min-height:30px; }
  #bpBoard .bp-arena .bp-focus { gap:4px; padding-bottom:7px; }
}
@media(max-width:720px) {
  #bpBoard .bp-workspace.bp-arena { width:calc(100% - 12px); padding:10px; }
  #bpBoard .bp-workspace.bp-arena .bp-columns,#bpBoard .bp-workspace.bp-arena[data-complete="true"] .bp-columns { grid-template-columns:90px minmax(140px,1fr) 90px; gap:10px 8px; }
  #bpBoard .bp-workspace.bp-arena .bp-team[data-lobby-team="red"] { grid-row:2; grid-column:3; }
  #bpBoard .bp-arena .bp-team-heading h3 { font-size:10px; }
  #bpBoard .bp-arena .bp-team-heading .bp-pick-count { font-size:8px; }
  #bpBoard .bp-arena .lobby-side-dot { display:none; }
  #bpBoard .bp-workspace.bp-arena .bp-pick-cell.lobby-slot { padding:6px; gap:5px; }
  #bpBoard .bp-workspace.bp-arena .bp-pick-cell .bp-portrait { zoom:.7; }
  #bpBoard .bp-arena .bp-selector-tools h2 { display:none; }
  #bpBoard .bp-arena .bp-selector-tools #bpSearch { grid-column:1/-1; }
  #bpBoard .bp-arena .bp-progress { overflow-x:auto; }
  #bpBoard .bp-arena .bp-progress-track { min-width:600px; }
  #bpBoard .bp-arena #bpTitle { font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { #bpBoard .bp-arena * { transition:none!important; } }

#bpBoard .bp-workspace.bp-arena .bp-team[data-active="true"] { outline:0; border:0; box-shadow:none; }
#bpBoard .bp-workspace.bp-arena .bp-team:before,#bpBoard .bp-workspace.bp-arena .bp-team:after { display:none; }
#bpBoard .bp-arena .bp-history-drawer { flex:0 0 auto; min-height:0; max-height:min(220px,32vh); overflow:auto; }
#bpBoard .bp-arena .bp-history .bp-history-action { width:24px; height:27px; }
#bpBoard .bp-arena .bp-history .bp-history-action .bp-portrait { zoom:.75; transform:none; }

@media(max-width:650px) { #bpBoard .bp-workspace.bp-arena .bp-toolbar { height:96px; min-height:96px; } #bpBoard .bp-arena #bpTitle { width:100%; } }

@media(min-width:1201px) {
  #bpBoard .bp-arena .bp-selector-tools { grid-template-columns:200px minmax(0,1fr); grid-template-rows:36px 26px; gap:8px; }
  #bpBoard .bp-arena .bp-selector-tools h2 { display:none; }
  #bpBoard .bp-arena .bp-selector-tools #bpSearch { grid-column:1/-1; }
  #bpBoard .bp-arena #bpLane { grid-column:1; grid-row:2; }
  #bpBoard .bp-arena .bp-class-filter { grid-column:2; grid-row:2; border-left:1px solid #344355; padding-left:10px; }
}

#bpBoard .bp-arena .bp-slot { container-type:size; }
#bpBoard .bp-workspace.bp-arena .bp-pick-cell .bp-portrait { zoom:clamp(.4,calc((100cqh - 16px)/48px),1); }
#bpBoard .bp-arena .bp-pick-cell .lobby-portrait { width:clamp(20px,calc(100cqh - 16px),48px); height:clamp(20px,calc(100cqh - 16px),48px); flex-basis:clamp(20px,calc(100cqh - 16px),48px); }
@media(max-height:680px) {
  #bpBoard .bp-arena .bp-focus:has(.bp-focus-empty) { flex-direction:row; align-items:center; flex-shrink:0; max-height:none; gap:10px; padding-bottom:6px; }
  #bpBoard .bp-arena .bp-focus:has(.bp-focus-empty) header { flex:1; }
  #bpBoard .bp-arena .bp-focus:has(.bp-focus-empty) .bp-focus-grid { min-height:24px; overflow:hidden; }
  #bpBoard .bp-arena .bp-focus-empty { padding:3px; font-size:9px; }
}
@media(max-height:680px) {
  #bpBoard .bp-workspace.bp-arena { height:calc(100% - 24px); }
  #bpBoard .bp-workspace.bp-arena .bp-toolbar { height:48px; min-height:48px; padding-bottom:8px; }
  #bpBoard .bp-workspace.bp-arena .bp-columns,
  #bpBoard .bp-workspace.bp-arena[data-complete="true"] .bp-columns { grid-template-rows:84px minmax(0,1fr); padding:10px 0 8px; gap:12px 16px; }
  #bpBoard .bp-workspace.bp-arena .bp-team { grid-template-rows:24px minmax(0,1fr) 52px; }
  #bpBoard .bp-arena .bp-progress-step .bp-portrait { zoom:.75; }
  #bpBoard .bp-workspace.bp-arena .bp-pick-cell.lobby-slot { padding:5px; }
  #bpBoard .bp-arena .bp-pick-cell > span:nth-child(2) { gap:2px; }
  #bpBoard .bp-workspace.bp-arena .bp-pick-cell .bp-portrait { zoom:clamp(.5,calc((100cqh - 12px)/48px),1); }
  #bpBoard .bp-arena .bp-pick-cell .lobby-portrait { width:clamp(24px,calc(100cqh - 12px),48px); height:clamp(24px,calc(100cqh - 12px),48px); flex-basis:clamp(24px,calc(100cqh - 12px),48px); }
}

@media(max-height:680px) { #bpBoard .bp-arena #bpTitle .lobby-eyebrow { display:none; } }

#bpBoard .bp-arena .bp-focus { --bp-focus-reference-tile:54px; }
@media(max-height:800px) { #bpBoard .bp-arena .bp-focus { --bp-focus-reference-tile:46px; } }
#bpBoard .bp-arena #bpGrid .bp-empty-ban-action:disabled { opacity:.35; cursor:default; }

.bp-branch-map { width:calc(100vw - 48px); max-width:none; height:calc(100dvh - 48px); max-height:none; padding:24px; border:1px solid #47566b; border-radius:14px; background:#0b1521; color:#dce7f3; }
.bp-branch-map::backdrop { background:#030812dc; }
.bp-branch-map header { display:flex; align-items:center; justify-content:space-between; height:76px; border-bottom:1px solid #304052; background:transparent; }
.bp-branch-map header small { color:#bd9d68; letter-spacing:2px; font-size:10px; }
.bp-branch-map h2 { margin:8px 0; font-size:22px; }
.bp-branch-map header button { width:auto; padding:8px 14px; }
.bp-map-scroll { position:relative; height:calc(100% - 76px); overflow:hidden; padding:0; cursor:grab; touch-action:none; user-select:none; }
.bp-map-scroll.is-panning { cursor:grabbing; }
.bp-map-scroll ul { display:flex; flex-direction:column; justify-content:center; gap:24px; margin:0; padding:0; list-style:none; }
.bp-map-scroll li { display:flex; align-items:center; position:relative; }
.bp-map-canvas { position:absolute; left:0; top:0; width:max-content; padding:8px; transform-origin:0 0; }
.bp-map-edges { position:absolute; inset:0; pointer-events:none; overflow:visible; }
.bp-map-canvas > ul { position:relative; }
.bp-map-segment { display:flex; align-items:center; gap:6px; flex-shrink:0; padding:7px; border:1px solid #304759; border-radius:9px; background:#0f1d2b; }
.bp-map-scroll li > ul { margin-left:64px; }
.bp-map-scroll button { display:flex; flex-direction:column; align-items:center; justify-content:center; flex:0 0 60px; width:60px; height:70px; padding:5px; border:1px solid #344b5e; border-radius:5px; background:#122332; }
.bp-map-scroll button.blue { border-bottom:3px solid #67c5fc; }
.bp-map-scroll button.red { border-bottom:3px solid #f48b9a; }
.bp-map-scroll button[aria-current=true] { outline:2px solid #d3b77c; outline-offset:3px; }
.bp-map-scroll button:hover { background:#264052; }
.bp-map-scroll small { font-size:9px; margin-top:4px; }

.bp-map-phase-divider { display:block; width:3px; height:64px; flex:0 0 3px; margin:0 5px; border-radius:2px; background:#73e3a5; box-shadow:0 0 8px #73e3a54d; }

.bp-map-scroll .bp-map-controls { position:absolute; right:18px; bottom:18px; z-index:2; display:flex; align-items:center; gap:6px; padding:7px; border:1px solid #3d5267; border-radius:7px; background:#122130; cursor:default; }
.bp-map-scroll .bp-map-controls button { display:block; flex:none; width:auto; min-width:34px; height:32px; padding:4px 8px; }
.bp-map-controls output { min-width:46px; text-align:center; font-size:12px; color:#d6e3ee; }