/* Original Black & White move and ability directories. */
body.bw-battle-page .content-grid.article-layout { grid-template-columns: minmax(0, 1fr); }
body.bw-battle-page .article-layout > .right-rail { display: none; }
body.bw-battle-page .article-layout > .bw-battle-browser {
  --bw-battle-bg: #1d1e20;
  --bw-battle-raised: #242529;
  --bw-battle-line: #38393e;
  --bw-battle-text: #efedf5;
  --bw-battle-muted: #aeb0ba;
  --bw-battle-accent: #d6a0ed;
  --bw-battle-purple: #8b5cf6;
  min-width: 0;
  padding: 24px;
  border-color: var(--bw-battle-line);
  border-radius: 8px;
  background: var(--bw-battle-bg);
  color: var(--bw-battle-text);
  box-shadow: none;
}

.bw-battle-page .bw-battle-browser h1 {
  margin: 0 0 8px;
  padding: 0;
  border: 0;
  color: var(--bw-battle-text);
  font: 700 clamp(25px, 2.2vw, 32px)/1.25 'Source Sans 3', Arial, sans-serif;
  letter-spacing: -.5px;
}
.bw-battle-page .bw-battle-browser .bw-battle-intro {
  max-width: 920px;
  margin: 0 0 22px;
  color: var(--bw-battle-muted);
  font-size: 15px;
  line-height: 1.6;
}
.bw-battle-browser a { color: var(--bw-battle-accent); }
.bw-battle-browser a:hover { color: #e6ddff; }
.bw-battle-browser :is(a, button, input, select, summary):focus-visible { outline: 2px solid var(--bw-battle-accent); outline-offset: 3px; }

.bw-battle-toolbar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 14px;
}
.bw-battle-toolbar button,
.bw-battle-toolbar select,
.bw-battle-filter summary,
.bw-battle-search,
.bw-battle-empty button {
  min-height: 40px;
  border: 1px solid var(--bw-battle-line);
  border-radius: 6px;
  background: var(--bw-battle-raised);
  color: var(--bw-battle-text);
  font: inherit;
}
.bw-battle-search { display: flex; align-items: center; gap: 9px; flex: 1 1 270px; min-width: min(100%, 220px); padding: 0 12px; }
.bw-battle-search svg { width: 18px; height: 18px; flex: 0 0 18px; color: #a6a1b2; }
.bw-battle-search > span[aria-hidden='true'] { color: #a6a1b2; font-size: 24px; line-height: 1; }
.bw-battle-search input { width: 100%; min-width: 0; height: 38px; padding: 0; border: 0; border-radius: 0; background: transparent; color: var(--bw-battle-text); font: inherit; }
.bw-battle-search input::placeholder { color: #a6a1b2; }
.bw-battle-search:focus-within { border-color: var(--bw-battle-purple); }
.bw-battle-toolbar select { min-width: 150px; padding: 8px 28px 8px 11px; cursor: pointer; }
.bw-battle-toolbar button { padding: 7px 12px; cursor: pointer; }
.bw-battle-toolbar .bw-battle-reset { background: transparent; color: var(--bw-battle-muted); }
.bw-battle-toolbar :is(button, select):hover,
.bw-battle-filter summary:hover,
.bw-battle-empty button:hover { border-color: #716285; background: #302b38; }
.bw-battle-toolbar input[type='checkbox'] { width: 15px; height: 15px; flex: 0 0 15px; margin: 0; accent-color: var(--bw-battle-purple); cursor: pointer; }
.bw-battle-filter { position: relative; }
.bw-battle-filter summary { display: flex; align-items: center; justify-content: space-between; gap: 17px; padding: 8px 12px; list-style: none; cursor: pointer; }
.bw-battle-filter summary::-webkit-details-marker { display: none; }
.bw-battle-filter summary > span[aria-hidden='true'] { display: none; }
.bw-battle-filter summary::after { content: ''; width: 6px; height: 6px; margin-top: -3px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.bw-battle-filter[open] summary { border-color: var(--bw-battle-purple); background: #302743; color: #ded2ff; }
.bw-battle-filter[open] summary::after { margin-top: 3px; transform: rotate(225deg); }
.bw-battle-filter-options {
  position: absolute;
  z-index: 15;
  top: calc(100% + 7px);
  left: 0;
  width: 235px;
  max-width: calc(100vw - 52px);
  max-height: 340px;
  overflow-y: auto;
  min-inline-size: 0;
  margin: 0;
  padding: 7px;
  border: 1px solid #4a405e;
  border-radius: 7px;
  background: #242127;
  box-shadow: 0 12px 28px #0007;
}
.bw-battle-filter-options label { display: flex; align-items: center; gap: 9px; min-height: 35px; padding: 6px 8px; border-radius: 4px; cursor: pointer; }
.bw-battle-filter-options label:hover { background: #35303d; }
.bw-battle-filter-options label small { margin-left: auto; color: #9791a4; font-size: 11px; }
.bw-battle-toolbar .bw-battle-toggle { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; color: #c9c5d2; cursor: pointer; }
.bw-battle-page .bw-battle-count { margin: 18px 0 12px; color: var(--bw-battle-muted); font-size: 13px; }
.bw-battle-count strong { padding: 2px 5px; border-radius: 3px; background: #d6a0ed; color: #242029; font-weight: 600; }

.bw-battle-table { min-width: 0; width: 100%; max-width: 100%; border: 1px solid var(--bw-battle-line); border-radius: 7px; }
.bw-battle-table table,
table.bw-battle-table { width: 100%; table-layout: fixed; border-collapse: collapse; text-align: left; font-size: 13px; line-height: 1.55; }
.bw-battle-table th,
.bw-battle-table td { padding: 13px 10px; border-bottom: 1px solid var(--bw-battle-line); vertical-align: middle; overflow-wrap: anywhere; }
.bw-battle-table thead th { padding-top: 11px; padding-bottom: 11px; background: #242529; color: #c1bacd; font-weight: 600; font-size: 12px; }
.bw-battle-table thead th:first-child { border-radius: 6px 0 0 0; }
.bw-battle-table thead th:last-child { border-radius: 0 6px 0 0; }
.bw-battle-table tbody tr { background: #1d1e20; }
.bw-battle-table tbody tr:nth-child(even) { background: #242529; }
.bw-battle-table tbody tr:hover { background: #29252f; }
.bw-battle-table tbody tr:target { background: #362c43; outline: 1px solid #8b6bbd; outline-offset: -1px; }
.bw-battle-table tbody tr:last-child :is(th, td) { border-bottom: 0; }
.bw-battle-table tbody th { color: #ece4f4; font-weight: 600; text-align: left; }
.bw-battle-table tbody th a { font-size: 14px; line-height: 1.45; }
.bw-battle-table tbody th small,
.bw-battle-number { display: block; margin-top: 3px; color: #9791a4; font-size: 11px; font-weight: 400; }
.bw-battle-table .bw-battle-description,
.bw-battle-table td[data-label='Description'] { color: #bdb9c8; }
.bw-battle-page .bw-battle-table .bw-battle-note { margin: 8px 0; color: #989ca8; font-size: 11px; line-height: 1.55; }
.bw-battle-table td[data-label='Power'],
.bw-battle-table td[data-label='Accuracy'],
.bw-battle-table td[data-label='PP'] { font-variant-numeric: tabular-nums; }
.bw-battle-browser .bw-battle-sort-button { display: inline-flex; align-items: center; gap: 5px; min-height: 20px; padding: 0; border: 0; border-radius: 2px; background: transparent; color: inherit; font: inherit; white-space: nowrap; cursor: pointer; }
.bw-battle-browser .bw-battle-sort-button:hover { color: var(--bw-battle-accent); }
.bw-battle-sort-button span { color: #98919f; }

.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(1),
.bw-battle-table[data-kind='moves'] thead th:nth-child(1) { width: 14%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(2),
.bw-battle-table[data-kind='moves'] thead th:nth-child(2) { width: 8%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(3),
.bw-battle-table[data-kind='moves'] thead th:nth-child(3) { width: 9%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(4),
.bw-battle-table[data-kind='moves'] thead th:nth-child(4) { width: 7%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(5),
.bw-battle-table[data-kind='moves'] thead th:nth-child(5) { width: 7%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(6),
.bw-battle-table[data-kind='moves'] thead th:nth-child(6) { width: 6%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(7),
.bw-battle-table[data-kind='moves'] thead th:nth-child(7) { width: 4%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(8),
.bw-battle-table[data-kind='moves'] thead th:nth-child(8) { width: 12%; }
.bw-battle-browser[data-kind='moves'] .bw-battle-table thead th:nth-child(9),
.bw-battle-table[data-kind='moves'] thead th:nth-child(9) { width: 33%; }
.bw-battle-browser[data-kind='abilities'] .bw-battle-table thead th:nth-child(1),
.bw-battle-table[data-kind='abilities'] thead th:nth-child(1) { width: 18%; }
.bw-battle-browser[data-kind='abilities'] .bw-battle-table thead th:nth-child(2),
.bw-battle-table[data-kind='abilities'] thead th:nth-child(2) { width: 46%; }
.bw-battle-browser[data-kind='abilities'] .bw-battle-table thead th:nth-child(3),
.bw-battle-browser[data-kind='abilities'] .bw-battle-table thead th:nth-child(4),
.bw-battle-browser[data-kind='abilities'] .bw-battle-table thead th:nth-child(5),
.bw-battle-table[data-kind='abilities'] thead th:nth-child(3),
.bw-battle-table[data-kind='abilities'] thead th:nth-child(4),
.bw-battle-table[data-kind='abilities'] thead th:nth-child(5) { width: 12%; }

.bw-type,
.bw-class,
.bw-machine { display: inline-block; padding: 2px 7px; border: 1px solid #4b405c; border-radius: 4px; background: #322a40; color: #d9ccec; font-size: 11px; line-height: 1.5; font-weight: 500; white-space: nowrap; }
.bw-type { border-color: color-mix(in srgb, var(--bw-type-color, #aca6b5) 50%, transparent); background: color-mix(in srgb, var(--bw-type-color, #aca6b5) 17%, #202025); color: var(--bw-type-color, #d1c9dc); }
.bw-battle-browser .bw-type-png { display: inline-flex; align-items: center; vertical-align: middle; line-height: 1; }
.bw-battle-browser .bw-type-png img { display: block; width: 64px; height: 24px; max-width: 100%; object-fit: contain; image-rendering: pixelated; }
.bw-type[data-type='normal'] { --bw-type-color: #b6b6a8; }
.bw-type[data-type='fighting'] { --bw-type-color: #e38d70; }
.bw-type[data-type='flying'] { --bw-type-color: #b5aeef; }
.bw-type[data-type='poison'] { --bw-type-color: #c896dc; }
.bw-type[data-type='ground'] { --bw-type-color: #d2b685; }
.bw-type[data-type='rock'] { --bw-type-color: #c4b67a; }
.bw-type[data-type='bug'] { --bw-type-color: #b5c773; }
.bw-type[data-type='ghost'] { --bw-type-color: #ae99d8; }
.bw-type[data-type='steel'] { --bw-type-color: #a4b4cb; }
.bw-type[data-type='fire'] { --bw-type-color: #f2a47f; }
.bw-type[data-type='water'] { --bw-type-color: #8dbbee; }
.bw-type[data-type='grass'] { --bw-type-color: #a0cb8a; }
.bw-type[data-type='electric'] { --bw-type-color: #ecd385; }
.bw-type[data-type='psychic'] { --bw-type-color: #ee9cb9; }
.bw-type[data-type='ice'] { --bw-type-color: #9ddddb; }
.bw-type[data-type='dragon'] { --bw-type-color: #ad9ce9; }
.bw-type[data-type='dark'] { --bw-type-color: #c1a999; }
.bw-type[data-type='fairy'] { --bw-type-color: #e8b1ce; }
.bw-class[data-class='physical'] { border-color: #775041; background: #3c2d27; color: #f1bc9b; }
.bw-class[data-class='special'] { border-color: #465e7c; background: #263244; color: #a9c8f3; }
.bw-class[data-class='status'] { border-color: #655572; background: #352d40; color: #d2bddf; }
.bw-machine { padding: 1px 5px; font-size: 10px; }

.bw-learners,
.bw-learners > details { position: relative; }
.bw-learners summary { width: fit-content; max-width: 100%; padding: 3px 0; color: var(--bw-battle-accent); font-size: 12px; cursor: pointer; }
.bw-learners summary:hover { color: #e6ddff; }
.bw-learners summary span { font-variant-numeric: tabular-nums; }
.bw-learner-list {
  position: absolute;
  z-index: 8;
  top: calc(100% + 5px);
  right: 0;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 6px;
  width: 330px;
  max-width: calc(100vw - 64px);
  max-height: 280px;
  overflow-y: auto;
  margin: 0;
  padding: 12px;
  border: 1px solid #554662;
  border-radius: 6px;
  background: #242127;
  box-shadow: 0 10px 24px #0007;
  list-style: none;
}
.bw-learner-list > :is(a, li, span) { min-width: 0; }
.bw-learner-list a { display: inline-flex; align-items: center; gap: 4px; min-height: 28px; max-width: 100%; padding: 3px 7px; border: 1px solid #49404f; border-radius: 4px; background: #302b37; color: #d8c8e3; font-size: 11px; line-height: 1.5; }
.bw-learner-list a:hover { border-color: #906cab; background: #3d3049; color: #f0dfff; text-decoration: none; }
.bw-learner-list > span { display: inline-flex; align-items: center; min-height: 28px; max-width: 100%; padding: 3px 7px; border: 1px solid #424248; border-radius: 4px; background: #2b2b30; color: #b9b6c0; font-size: 11px; line-height: 1.5; }
.bw-learner-list img { width: 24px; height: 24px; object-fit: contain; image-rendering: pixelated; }
.bw-learner-list small { color: #aca0b6; font-size: 10px; }
.bw-battle-browser [hidden] { display: none !important; }

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

@media (max-width: 1100px) {
  .bw-battle-table th, .bw-battle-table td { padding-left: 8px; padding-right: 8px; }
  .bw-battle-table th { font-size: 11px; }
  .bw-type, .bw-class { padding-left: 5px; padding-right: 5px; font-size: 10px; }
}

@media (max-width: 1000px) {
  .bw-battle-browser[data-kind='moves'] .bw-battle-table,
  .bw-battle-browser[data-kind='moves'] .bw-battle-table table,
  .bw-battle-browser[data-kind='moves'] .bw-battle-table tbody,
  .bw-battle-table[data-kind='moves'],
  .bw-battle-table[data-kind='moves'] table,
  .bw-battle-table[data-kind='moves'] tbody { display: block; border: 0; }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table thead,
  .bw-battle-table[data-kind='moves'] thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table tbody tr,
  .bw-battle-table[data-kind='moves'] tbody tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 14px; margin-bottom: 12px; padding: 15px; border: 1px solid var(--bw-battle-line); border-radius: 7px; background: #242529; }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table tbody th,
  .bw-battle-table[data-kind='moves'] tbody th { display: block; grid-column: 1 / -1; padding: 0 0 8px; border: 0; border-bottom: 1px solid var(--bw-battle-line); }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table td,
  .bw-battle-table[data-kind='moves'] td { display: block; padding: 0; border: 0; }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table td::before,
  .bw-battle-table[data-kind='moves'] td::before { content: attr(data-label); display: block; margin-bottom: 4px; color: #9d96ab; font-size: 11px; font-weight: 600; }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table td[data-label='Description'],
  .bw-battle-table[data-kind='moves'] td[data-label='Description'] { grid-column: 1 / -1; padding-top: 9px; border-top: 1px solid var(--bw-battle-line); }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table td:has(.bw-learners),
  .bw-battle-table[data-kind='moves'] td:has(.bw-learners) { grid-column: 1 / -1; }
  .bw-battle-browser[data-kind='moves'] .bw-learner-list,
  .bw-battle-table[data-kind='moves'] .bw-learner-list { position: static; width: 100%; max-width: 100%; margin-top: 7px; box-shadow: none; }
}

@media (max-width: 760px) {
  body.bw-battle-page .article-layout > .bw-battle-browser { padding: 18px; }
  .bw-battle-search { flex-basis: 100%; }
  .bw-battle-toolbar select { flex: 1 1 130px; min-width: 0; }
  .bw-battle-toolbar .bw-battle-filter { flex: 1 1 120px; }
  .bw-battle-filter:last-of-type .bw-battle-filter-options { left: auto; right: 0; }
}

@media (max-width: 640px) {
  .bw-battle-table, .bw-battle-table table, .bw-battle-table tbody { display: block; border: 0; }
  .bw-battle-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .bw-battle-table tbody tr { display: block; margin-bottom: 12px; padding: 15px; border: 1px solid var(--bw-battle-line); border-radius: 7px; background: #242529; }
  .bw-battle-table tbody th { display: block; padding: 0 0 11px; border: 0; }
  .bw-battle-table td { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 5px 10px; padding: 8px 0; border: 0; }
  .bw-battle-table td::before { content: attr(data-label); color: #9d96ab; font-size: 11px; font-weight: 600; }
  .bw-battle-table td[data-label='Description'] { display: block; margin: 3px 0 8px; padding-top: 11px; border-top: 1px solid var(--bw-battle-line); }
  .bw-battle-table td[data-label='Description']::before { display: block; margin-bottom: 5px; }
  .bw-battle-table td:has(.bw-learners) { display: block; }
  .bw-battle-table td:has(.bw-learners)::before { display: block; margin-bottom: 5px; }
  .bw-learner-list { position: static; width: 100%; max-width: 100%; margin-top: 7px; box-shadow: none; }
  .bw-type, .bw-class { padding: 2px 7px; font-size: 11px; }
}

@media (max-width: 460px) {
  body.bw-battle-page .article-layout > .bw-battle-browser { padding: 14px; }
  .bw-battle-toolbar { gap: 8px; }
  .bw-battle-filter-options { width: 210px; }
  .bw-battle-browser[data-kind='moves'] .bw-battle-table tbody tr,
  .bw-battle-table[data-kind='moves'] tbody tr { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
