/* Original Black & White Gym, Elite Four and Champion team references. */
body.bw-league-page .content-grid.article-layout { grid-template-columns: minmax(0, 1fr); }
body.bw-league-page .article-layout > .right-rail { display: none; }
.bw-league-browser {
  --bw-league-bg: #1d1e20;
  --bw-league-raised: #242529;
  --bw-league-line: #38393e;
  --bw-league-text: #efedf5;
  --bw-league-muted: #aeb0ba;
  --bw-league-accent: #d6a0ed;
  --bw-league-purple: #8b5cf6;
}
body.bw-league-page .article-layout > .bw-league-browser {
  min-width: 0;
  padding: 24px;
  border-color: var(--bw-league-line);
  border-radius: 8px;
  background: var(--bw-league-bg);
  color: var(--bw-league-text);
  box-shadow: none;
}
body.bw-league-page .bw-league-browser h1 { margin: 0 0 8px; padding: 0; border: 0; color: var(--bw-league-text); font: 700 clamp(25px, 2.2vw, 32px)/1.25 'Source Sans 3', Arial, sans-serif; letter-spacing: -.5px; }
.bw-league-page .bw-league-browser .bw-league-intro { max-width: 960px; margin: 0 0 22px; color: var(--bw-league-muted); font-size: 15px; line-height: 1.6; }
.bw-league-browser a { color: var(--bw-league-accent); }
.bw-league-browser a:hover { color: #e6ddff; }
.bw-league-browser :is(a, button, input, select, summary):focus-visible { outline: 2px solid var(--bw-league-accent); outline-offset: 3px; }

.bw-league-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; border: 0; font-size: 14px; }
.bw-league-toolbar :is(button, select),
.bw-league-search,
.bw-league-phase label,
.bw-league-phase button,
.bw-league-empty button { min-height: 40px; border: 1px solid var(--bw-league-line); border-radius: 6px; background: var(--bw-league-raised); color: var(--bw-league-text); font: inherit; }
.bw-league-search { display: flex; align-items: center; gap: 9px; flex: 1 1 270px; min-width: min(100%, 220px); padding: 0 12px; }
.bw-league-search svg { width: 18px; height: 18px; flex: 0 0 18px; color: #a6a1b2; }
.bw-league-search > span[aria-hidden='true'] { color: #a6a1b2; font-size: 24px; line-height: 1; }
.bw-league-search input { width: 100%; min-width: 0; height: 38px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--bw-league-text); font: inherit; }
.bw-league-search input::placeholder { color: #a6a1b2; }
.bw-league-search:focus-within { border-color: var(--bw-league-purple); }
.bw-league-toolbar select { min-width: 150px; max-width: 100%; padding: 8px 28px 8px 11px; cursor: pointer; }
.bw-league-toolbar button { padding: 7px 12px; cursor: pointer; }
.bw-league-toolbar .bw-league-reset { background: transparent; color: var(--bw-league-muted); }
.bw-league-toolbar :is(button, select):hover,
.bw-league-phase :is(label, button):hover,
.bw-league-empty button:hover { border-color: #716285; background: #302b38; }
.bw-league-phase { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-inline-size: 0; margin: 0; padding: 0; border: 0; }
.bw-league-phase label,
.bw-league-phase button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 8px 11px; font-size: 13px; cursor: pointer; }
.bw-league-phase input { width: 14px; height: 14px; flex: 0 0 14px; margin: 0; accent-color: var(--bw-league-purple); }
.bw-league-phase label:has(input:checked),
.bw-league-phase button[aria-pressed='true'],
.bw-league-phase button[aria-selected='true'] { border-color: #8b6bbd; background: #3b2e51; color: #e1d4ff; }
.bw-league-page .bw-league-count { margin: 18px 0 12px; color: var(--bw-league-muted); font-size: 13px; }
.bw-league-count strong { padding: 2px 5px; border-radius: 3px; background: #d6a0ed; color: #242029; font-weight: 600; }

.bw-trainers { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 18px; margin: 0; padding: 0; list-style: none; }
.bw-trainer { min-width: 0; padding: 18px; border: 1px solid var(--bw-league-line); border-radius: 8px; background: var(--bw-league-raised); }
.bw-trainer:target { border-color: #8b6bbd; background: #29242f; scroll-margin-top: 20px; }
.bw-trainer-header { display: grid; grid-template-columns: 80px minmax(0, 1fr); align-items: center; gap: 8px 14px; margin-bottom: 17px; padding-bottom: 16px; border-bottom: 1px solid var(--bw-league-line); }
.bw-trainer-portrait { display: block; width: 80px; height: 80px; margin: 0; object-fit: contain; image-rendering: pixelated; }
.bw-trainer-portrait img { display: block; width: 100%; height: 100%; object-fit: contain; image-rendering: pixelated; }
body .bw-league-browser .bw-trainer-header h2 { margin: 0 0 6px; padding: 0; border: 0; color: #eee5f5; font: 700 21px/1.3 'Source Sans 3', Arial, sans-serif; }
.bw-trainer-name { min-width: 0; }
.bw-trainer-name a { color: #e5c5f2; }
.bw-trainer-meta { margin: 6px 0 0; color: #bcb7c7; font-size: 12px; line-height: 1.6; }
.bw-trainer-header > .bw-trainer-meta,
.bw-trainer-header > .bw-trainer-condition { grid-column: 2; }
.bw-trainer-condition { margin: 8px 0 0; padding: 7px 9px; border-left: 2px solid #897093; border-radius: 0 4px 4px 0; background: #302937; color: #cfc2d8; font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.bw-trainer > .bw-trainer-condition { margin: 0 0 15px; }
.bw-team { min-width: 0; margin: 17px 0 0; }
.bw-team:first-of-type { margin-top: 0; }
.bw-team-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 6px 10px; margin: 0 0 10px; }
body .bw-league-browser .bw-team-heading h3,
body .bw-league-browser h3.bw-team-heading { margin: 0; color: #ded1e8; font: 600 15px/1.4 'Source Sans 3', Arial, sans-serif; }
.bw-team-heading > :is(small, span) { color: #a69caf; font-size: 11px; line-height: 1.5; }
.bw-team-roster { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; min-width: 0; margin: 0; padding: 0; list-style: none; }
.bw-team-pokemon { min-width: 0; padding: 12px; border: 1px solid #3d3943; border-radius: 6px; background: #1d1e20; color: #dfd9e8; font-size: 12px; line-height: 1.55; overflow-wrap: anywhere; }
.bw-team-pokemon::after { content: ''; display: block; clear: both; }
.bw-team-pokemon-header,
.bw-pokemon-heading { display: flex; align-items: center; gap: 9px; margin-bottom: 10px; }
.bw-team-pokemon-header > div,
.bw-pokemon-heading > div { min-width: 0; }
.bw-team-pokemon img { display: block; width: 48px; height: 48px; flex: 0 0 48px; object-fit: contain; image-rendering: pixelated; }
.bw-team-pokemon > img { float: left; margin: 0 9px 8px 0; }
.bw-team-pokemon h4,
.bw-pokemon-name { margin: 0 0 3px; color: #e5d4ee; font: 600 14px/1.4 'Source Sans 3', Arial, sans-serif; }
.bw-team-pokemon h4 a,
.bw-pokemon-name a { color: #e5b7f5; }
.bw-pokemon-level,
.bw-team-level { margin: 2px 0 4px; color: #aba4b4; font-size: 11px; font-variant-numeric: tabular-nums; }
.bw-pokemon-types,
.bw-team-types { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.bw-team-pokemon ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 6px; clear: both; margin: 10px 0; padding: 0; list-style: none; }
.bw-team-pokemon ul li { min-width: 0; padding: 4px 6px; border-radius: 3px; background: #29272e; color: #c9c2d2; font-size: 11px; line-height: 1.45; }
.bw-team-pokemon ul a { color: #cbb4de; }
.bw-team-pokemon dl { clear: both; margin: 10px 0 0; font-size: 11px; }
.bw-team-pokemon dl > div { display: grid; grid-template-columns: 45px minmax(0, 1fr); gap: 8px; margin-top: 5px; padding-top: 5px; border-top: 1px solid #323036; }
.bw-team-pokemon dt { color: #98909f; font-weight: 400; }
.bw-team-pokemon dd { margin: 0; color: #bdb3c8; }
.bw-team-pokemon .bw-pokemon-ability,
.bw-team-pokemon .bw-pokemon-item { margin: 5px 0 0; color: #bdb3c8; font-size: 11px; }
.bw-team-pokemon .bw-pokemon-ability strong,
.bw-team-pokemon .bw-pokemon-item strong { color: #98909f; font-weight: 400; }
.bw-ace { display: inline-block; width: fit-content; margin: 2px 0 0 4px; padding: 1px 5px; border: 1px solid #765c41; border-radius: 3px; background: #3a2d22; color: #e9c997; font: 600 9px/1.5 'Source Sans 3', Arial, sans-serif; letter-spacing: .3px; text-transform: uppercase; vertical-align: middle; }

.bw-league-type,
.bw-trainer-type { display: inline-block; width: fit-content; padding: 2px 7px; border: 1px solid #4b405c; border-radius: 4px; background: #322a40; color: #d9ccec; font-size: 10px; line-height: 1.5; font-weight: 500; white-space: nowrap; }
.bw-league-type[data-type],
.bw-trainer-type[data-type] { border-color: color-mix(in srgb, var(--bw-league-type-color, #aca6b5) 50%, transparent); background: color-mix(in srgb, var(--bw-league-type-color, #aca6b5) 17%, #202025); color: var(--bw-league-type-color, #d1c9dc); }
:is(.bw-league-type, .bw-trainer-type)[data-type='normal'] { --bw-league-type-color: #b6b6a8; }
:is(.bw-league-type, .bw-trainer-type)[data-type='fighting'] { --bw-league-type-color: #e38d70; }
:is(.bw-league-type, .bw-trainer-type)[data-type='flying'] { --bw-league-type-color: #b5aeef; }
:is(.bw-league-type, .bw-trainer-type)[data-type='poison'] { --bw-league-type-color: #c896dc; }
:is(.bw-league-type, .bw-trainer-type)[data-type='ground'] { --bw-league-type-color: #d2b685; }
:is(.bw-league-type, .bw-trainer-type)[data-type='rock'] { --bw-league-type-color: #c4b67a; }
:is(.bw-league-type, .bw-trainer-type)[data-type='bug'] { --bw-league-type-color: #b5c773; }
:is(.bw-league-type, .bw-trainer-type)[data-type='ghost'] { --bw-league-type-color: #ae99d8; }
:is(.bw-league-type, .bw-trainer-type)[data-type='steel'] { --bw-league-type-color: #a4b4cb; }
:is(.bw-league-type, .bw-trainer-type)[data-type='fire'] { --bw-league-type-color: #f2a47f; }
:is(.bw-league-type, .bw-trainer-type)[data-type='water'] { --bw-league-type-color: #8dbbee; }
:is(.bw-league-type, .bw-trainer-type)[data-type='grass'] { --bw-league-type-color: #a0cb8a; }
:is(.bw-league-type, .bw-trainer-type)[data-type='electric'] { --bw-league-type-color: #ecd385; }
:is(.bw-league-type, .bw-trainer-type)[data-type='psychic'] { --bw-league-type-color: #ee9cb9; }
:is(.bw-league-type, .bw-trainer-type)[data-type='ice'] { --bw-league-type-color: #9ddddb; }
:is(.bw-league-type, .bw-trainer-type)[data-type='dragon'] { --bw-league-type-color: #ad9ce9; }
:is(.bw-league-type, .bw-trainer-type)[data-type='dark'] { --bw-league-type-color: #c1a999; }
.bw-trainers:has(> .bw-trainer:only-child),
.bw-league-browser[data-kind='champion'] .bw-trainers { grid-template-columns: minmax(0, 1fr); }
.bw-trainers > .bw-trainer:only-child .bw-team-roster,
.bw-league-browser[data-kind='champion'] .bw-team-roster { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.bw-league-browser [hidden] { display: none !important; }

.bw-league-empty { margin-top: 8px; padding: 38px 20px; border: 1px dashed #564665; border-radius: 7px; background: #211c28; text-align: center; color: var(--bw-league-muted); }
body.bw-league-page .bw-league-empty h2 { margin-bottom: 8px; color: #e5dcf3; font: 600 20px/1.3 'Source Sans 3', Arial, sans-serif; }
.bw-league-empty p { margin-bottom: 16px; }
.bw-league-empty button { padding: 8px 14px; cursor: pointer; }
.bw-league-notes { margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--bw-league-line); }
body.bw-league-page .bw-league-notes h2 { margin: 0 0 7px; padding: 0; border: 0; color: #dfd4ee; font: 600 17px/1.3 'Source Sans 3', Arial, sans-serif; }
.bw-league-page .bw-league-notes p { margin: 0 0 16px; color: var(--bw-league-muted); font-size: 13px; line-height: 1.65; }
.bw-league-page .bw-league-notes .bw-league-credit { font-size: 12px; }
.bw-league-browser .wiki-editorial-panel { border-color: var(--bw-league-line); }
.bw-league-browser .wiki-editorial-panel h2 { color: #dfd4ee; font-family: 'Source Sans 3', Arial, sans-serif; }

/* The same teams can sit within a trainer's existing biography article. */
.bw-league-browser.bw-profile-teams { min-width: 0; margin: 22px 0; padding: 16px; border: 1px solid var(--bw-league-line); border-radius: 8px; background: var(--bw-league-bg); color: var(--bw-league-text); }
body .bw-league-browser.bw-profile-teams > h2 { margin: 0 0 14px; padding: 0; border: 0; color: #e5d5ef; font: 700 19px/1.35 'Source Sans 3', Arial, sans-serif; }
.bw-profile-teams .bw-league-intro { margin: 0 0 14px; color: var(--bw-league-muted); font-size: 13px; line-height: 1.6; }
.bw-profile-teams .bw-trainers { grid-template-columns: minmax(0, 1fr); }
.bw-profile-teams .bw-team-roster,
.bw-profile-teams .bw-trainers > .bw-trainer:only-child .bw-team-roster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.bw-profile-teams .bw-trainer { padding: 14px; }

@media (max-width: 1050px) {
  .bw-trainers { grid-template-columns: minmax(0, 1fr); }
  .bw-team-roster { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  body.bw-league-page .article-layout > .bw-league-browser { padding: 18px; }
  .bw-league-search { flex-basis: 100%; }
  .bw-league-toolbar select { flex: 1 1 140px; min-width: 0; }
  .bw-league-phase { flex: 1 1 auto; }
  .bw-team-roster,
  .bw-trainers > .bw-trainer:only-child .bw-team-roster,
  .bw-league-browser[data-kind='champion'] .bw-team-roster { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .bw-trainers { gap: 14px; }
  .bw-trainer { padding: 14px; }
  .bw-trainer-header { grid-template-columns: 64px minmax(0, 1fr); gap: 8px 10px; }
  .bw-trainer-portrait { width: 64px; height: 64px; }
  body .bw-league-browser .bw-trainer-header h2 { font-size: 19px; }
  .bw-team-roster,
  .bw-trainers > .bw-trainer:only-child .bw-team-roster,
  .bw-league-browser[data-kind='champion'] .bw-team-roster { grid-template-columns: minmax(0, 1fr); }
  .bw-profile-teams .bw-team-roster,
  .bw-profile-teams .bw-trainers > .bw-trainer:only-child .bw-team-roster { grid-template-columns: minmax(0, 1fr); }
  .bw-team-pokemon { padding: 12px; }
  .bw-team-pokemon ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bw-team-pokemon h4, .bw-pokemon-name { font-size: 15px; }
  .bw-team-pokemon dl > div { grid-template-columns: 48px minmax(0, 1fr); }
}
@media (max-width: 460px) {
  body.bw-league-page .article-layout > .bw-league-browser { padding: 14px; }
  .bw-league-toolbar { gap: 8px; }
  .bw-league-phase :is(label, button) { padding: 8px 9px; font-size: 12px; }
  .bw-trainer-meta, .bw-trainer-condition { font-size: 11px; }
}
