@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=LINE+Seed+JP:wght@400;700&display=swap");
* {
  margin: 0;
  padding: 0;
  text-decoration: none;
  overflow: hidden;
  border-radius: 0;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  font-family: "LINE Seed JP", sans-serif;
}

html {
  width: 100%;
  max-width: 100%;
  scroll-behavior: smooth;
  overflow-y: auto;
  overflow-x: clip;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  display: block;
  width: 100%;
  max-width: 100%;
  margin-inline: 0;
  padding-inline: 0;
  min-height: 100dvh;
  background-color: #f5f5f5;
  overflow-x: clip;
  padding-bottom: 68px;
}

html,
body {
  touch-action: pan-y;
}

body::-webkit-scrollbar,
body *::-webkit-scrollbar {
  display: none;
}

html.modal-open,
body.modal-open {
  overflow: hidden;
  overscroll-behavior: none;
}

body.modal-open main {
  overflow: hidden;
  touch-action: none;
}

.app_identity {
  position: fixed;
  top: max(10px, env(safe-area-inset-top));
  left: max(12px, env(safe-area-inset-left));
  z-index: 98;
  display: flex;
  align-items: flex-start;
  flex-direction: column;
  gap: 2px;
  color: #3B4CCA;
  pointer-events: none;
}
.app_identity h1 {
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.08em;
}
.app_identity span {
  color: #72768c;
  font-size: 0.56rem;
  font-weight: 700;
  line-height: 1;
}

main {
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: start;
  width: 100vw;
  max-width: 100%;
  min-width: 0;
  gap: 24px;
  margin-inline: 0;
  padding: 64px 0 calc(212px + env(safe-area-inset-bottom));
  overflow: auto;
  overscroll-behavior-x: auto;
  overflow-anchor: none;
  scroll-padding-inline: 0;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
}
main::-webkit-scrollbar {
  display: none;
}
main section.main_section {
  display: block;
  flex-shrink: 0;
  width: calc(100vw - 8px);
  max-width: none;
  min-height: 80svh;
  border-radius: 32px;
  box-shadow: 0 10px 34px -18px rgba(0, 0, 0, 0.4666666667);
  padding: 32px 16px;
  margin-inline: 0;
  box-sizing: border-box;
  background-color: #fafafa;
}
main section.main_section .sequence_header {
  --sequence-accent: #e56c3e;
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 36px;
  margin-bottom: 12px;
  padding: 0 2px 9px;
  border-bottom: 1px solid rgba(23, 25, 35, 0.1);
  box-sizing: border-box;
  overflow: visible;
}
main section.main_section .sequence_header.sequence_header_defender {
  --sequence-accent: #4771bd;
}
main section.main_section .sequence_header .sequence_title {
  display: grid;
  place-items: center;
  flex-shrink: 0;
  width: 34px;
  height: 32px;
  color: #20232d;
}
main section.main_section .sequence_header .sequence_title svg {
  width: 29px;
  height: 29px;
  color: var(--sequence-accent);
  stroke-width: 2.15;
}
main section.main_section .sequence_header .sequence_controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 7px;
  flex: 1;
  min-width: 0;
  padding-bottom: 6px;
}
main section.main_section .sequence_header .sequence_rounds {
  display: flex;
  align-items: center;
  flex: 0 1 240px;
  min-width: 42px;
  max-width: 240px;
  height: 32px;
  padding: 2px 2px 4px;
  border-radius: 999px;
  box-sizing: border-box;
  background: #eeeff2;
  box-shadow: none;
  filter: drop-shadow(0 2px 3px rgba(20, 24, 38, 0.2));
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: 2px;
  scrollbar-width: none;
}
main section.main_section .sequence_header .sequence_rounds::-webkit-scrollbar {
  display: none;
}
main section.main_section .sequence_header button {
  appearance: none;
  border: 0;
  font: inherit;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
main section.main_section .sequence_header .sequence_round {
  display: grid;
  place-items: center;
  flex: 0 0 26px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: transparent;
  color: #737786;
  font-size: 0.72rem;
  font-weight: 700;
  cursor: pointer;
  scroll-snap-align: center;
  scroll-snap-stop: always;
  transition: color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease, transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}
main section.main_section .sequence_header .sequence_round.active {
  background: #fff;
  color: var(--sequence-accent);
  box-shadow: 0 2px 3px -1px rgba(25, 28, 38, 0.24);
}
main section.main_section .sequence_header .sequence_round.is-disabled {
  opacity: 0.42;
  text-decoration: line-through;
}
main section.main_section .sequence_header .sequence_round:active {
  transform: scale(0.94);
  transition-duration: 0.08s;
}
main section.main_section .sequence_header .sequence_add,
main section.main_section .sequence_header .sequence_delete {
  display: grid;
  place-items: center;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #fff;
  color: #444956;
  border: 1px solid rgba(23, 25, 35, 0.22);
  font-size: 1.15rem;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  transition: transform 0.18s cubic-bezier(0.22, 1, 0.36, 1), background-color 0.18s ease, color 0.18s ease, opacity 0.18s ease;
}
main section.main_section .sequence_header .sequence_add svg,
main section.main_section .sequence_header .sequence_delete svg {
  width: 20px;
  height: 20px;
}
main section.main_section .sequence_header .sequence_add:active,
main section.main_section .sequence_header .sequence_delete:active {
  transform: scale(0.94);
  background: #eceef2;
  transition-duration: 0.08s;
}
main section.main_section .sequence_header .sequence_delete {
  border-color: transparent;
  background: transparent;
  color: #df5e38;
}
main section.main_section .sequence_header .sequence_delete:active {
  background: transparent;
}
main section.main_section .sequence_header .sequence_delete:disabled {
  opacity: 0.28;
  cursor: default;
}
main section.main_section .sequence_header .sequence_enable {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
  margin-right: auto;
  min-width: 70px;
  height: 32px;
  padding: 0;
  background: transparent;
  color: #777b89;
  font-size: 0.65rem;
  font-weight: 700;
  cursor: pointer;
  transition: color 0.18s ease, opacity 0.18s ease, transform 0.18s cubic-bezier(0.22, 1, 0.36, 1);
}
main section.main_section .sequence_header .sequence_enable .sequence_switch_track {
  position: relative;
  display: block;
  width: 32px;
  height: 18px;
  border-radius: 999px;
  background: #c6c8ce;
  transition: background-color 0.2s ease;
}
main section.main_section .sequence_header .sequence_enable .sequence_switch_track span {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.22);
  transition: transform 0.2s cubic-bezier(0.25, 1, 0.5, 1);
}
main section.main_section .sequence_header .sequence_enable.active {
  color: var(--sequence-accent);
}
main section.main_section .sequence_header .sequence_enable.active .sequence_switch_track {
  background: var(--sequence-accent);
}
main section.main_section .sequence_header .sequence_enable.active .sequence_switch_track span {
  transform: translateX(14px);
}
main section.main_section .sequence_header .sequence_enable:active {
  opacity: 0.76;
  transform: scale(0.96);
  transition-duration: 0.08s;
}
main section.main_section.attacker {
  scroll-snap-align: start;
}
main section.main_section.defender {
  scroll-snap-align: end;
}

@media (min-width: 900px) {
  main {
    justify-content: flex-start;
  }
  main section.main_section {
    width: calc((100vw - 24px) / 2);
  }
}
@media (max-width: 460px) {
  main section.main_section .sequence_header {
    gap: 7px;
  }
  main section.main_section .sequence_header .sequence_title {
    width: 32px;
    height: 32px;
  }
  main section.main_section .sequence_header .sequence_title svg {
    width: 27px;
    height: 27px;
  }
  main section.main_section .sequence_header .sequence_controls {
    gap: 6px;
  }
  main section.main_section .sequence_header .sequence_rounds {
    max-width: 132px;
  }
  main section.main_section .sequence_header .sequence_enable {
    min-width: 32px;
  }
  main section.main_section .sequence_header .sequence_enable .sequence_enable_text {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
  }
  main section.main_section .sequence_header .sequence_add,
  main section.main_section .sequence_header .sequence_delete {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
  }
}
main section.main_section .field_pokemon_info {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  height: 88px;
}
main section.main_section .field_pokemon_info .pokemon_info_img_container {
  position: relative;
  display: block;
  aspect-ratio: 1;
  height: 100%;
}
main section.main_section .field_pokemon_info .pokemon_info_img_container img.pokemon_info_img {
  display: block;
  height: 100%;
  aspect-ratio: 1;
  -o-object-fit: cover;
  object-fit: cover;
}
main section.main_section .field_pokemon_info .pokemon_info_img_container .pokemon_info_mega {
  position: absolute;
  right: 0;
  bottom: 0;
  display: grid;
  place-items: center;
  width: 50%;
  aspect-ratio: 1;
  border-radius: 50%;
  background-image: radial-gradient(#888, #333);
  border: 3px solid #fafafa;
  box-sizing: border-box;
  z-index: 2;
  transition: filter 0.2s ease, background-image 0.2s ease;
}
main section.main_section .field_pokemon_info .pokemon_info_img_container .pokemon_info_mega svg {
  display: block;
  width: 60%;
  height: 60%;
  margin: auto;
  fill: #fff;
}
main section.main_section .field_pokemon_info .pokemon_info_img_container .pokemon_info_mega.active {
  background-image: linear-gradient(135deg, #8BFF3D 0%, #30F4E8 22%, #1E5CFF 45%, #6A33FF 68%, #D63DFF 84%, #FF4A8B 100%);
}
main section.main_section .field_pokemon_info .pokemon_info_names {
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 6px;
  width: calc(100% - 92px);
  height: 100%;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_name_container {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  padding-inline: 12px;
  border-radius: 12px;
  border: 1.5px dashed #aaa;
  box-sizing: border-box;
  cursor: pointer;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_name_container svg {
  display: block;
  width: 20px;
  fill: none;
  stroke: #aaa;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_name_container p.pokemon_info_name {
  display: block;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
  font-size: 1.2rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 24px;
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container::-webkit-scrollbar {
  display: none;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container .pokemon_info_type {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2px;
  height: 100%;
  border-radius: 4px;
  padding-inline: 5px 8px;
  flex-shrink: 0;
  white-space: nowrap;
  scroll-snap-align: start;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container .pokemon_info_type svg {
  display: block;
  height: 80%;
  flex-shrink: 0;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container .pokemon_info_type p {
  display: block;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #fff;
  font-size: 0.92rem;
  white-space: nowrap;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container .pokemon_info_type_edit {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  height: 100%;
  border-radius: 4px;
  flex-shrink: 0;
  scroll-snap-align: start;
}
main section.main_section .field_pokemon_info .pokemon_info_names .pokemon_info_types_container .pokemon_info_type_edit svg {
  display: block;
  width: 80%;
  fill: none;
  stroke: #3B4CCA;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
main section.main_section .field_pokemon_ivs {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 100%;
  margin-block: 4px 16px;
}
main section.main_section .field_pokemon_ivs .ivs_h {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
main section.main_section .field_pokemon_ivs .ivs_h p {
  display: block;
  flex: 1;
  font-size: 0.75rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
  text-align: center;
}
main section.main_section .field_pokemon_ivs .ivs_b {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}
main section.main_section .field_pokemon_ivs .ivs_b p {
  display: block;
  flex: 1;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
  text-align: center;
}
main section.main_section .field_pokemon_move,
main section.main_section .field_pokemon_ability,
main section.main_section .field_pokemon_item {
  display: block;
  width: 100%;
  margin-top: 24px;
}
main section.main_section .field_pokemon_move .move_header,
main section.main_section .field_pokemon_move .ability_header,
main section.main_section .field_pokemon_move .item_header,
main section.main_section .field_pokemon_ability .move_header,
main section.main_section .field_pokemon_ability .ability_header,
main section.main_section .field_pokemon_ability .item_header,
main section.main_section .field_pokemon_item .move_header,
main section.main_section .field_pokemon_item .ability_header,
main section.main_section .field_pokemon_item .item_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 24px;
}
main section.main_section .field_pokemon_move .move_header p.ttl,
main section.main_section .field_pokemon_move .ability_header p.ttl,
main section.main_section .field_pokemon_move .item_header p.ttl,
main section.main_section .field_pokemon_ability .move_header p.ttl,
main section.main_section .field_pokemon_ability .ability_header p.ttl,
main section.main_section .field_pokemon_ability .item_header p.ttl,
main section.main_section .field_pokemon_item .move_header p.ttl,
main section.main_section .field_pokemon_item .ability_header p.ttl,
main section.main_section .field_pokemon_item .item_header p.ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
main section.main_section .field_pokemon_move .move_header .move_header_info,
main section.main_section .field_pokemon_move .ability_header .move_header_info,
main section.main_section .field_pokemon_move .item_header .move_header_info,
main section.main_section .field_pokemon_ability .move_header .move_header_info,
main section.main_section .field_pokemon_ability .ability_header .move_header_info,
main section.main_section .field_pokemon_ability .item_header .move_header_info,
main section.main_section .field_pokemon_item .move_header .move_header_info,
main section.main_section .field_pokemon_item .ability_header .move_header_info,
main section.main_section .field_pokemon_item .item_header .move_header_info {
  display: flex;
  align-items: center;
  margin-left: auto;
  height: 20px;
}
main section.main_section .field_pokemon_move .move_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_move .ability_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_move .item_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_ability .move_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_ability .ability_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_ability .item_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_item .move_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_item .ability_header .move_header_info .move_info_type,
main section.main_section .field_pokemon_item .item_header .move_header_info .move_info_type {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  height: 100%;
  border-radius: 4px;
  margin-right: 6px;
}
main section.main_section .field_pokemon_move .move_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_move .ability_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_move .item_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_ability .move_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_ability .ability_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_ability .item_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_item .move_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_item .ability_header .move_header_info .move_info_type svg,
main section.main_section .field_pokemon_item .item_header .move_header_info .move_info_type svg {
  display: block;
  height: 80%;
}
main section.main_section .field_pokemon_move .move_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_move .ability_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_move .item_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_ability .move_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_ability .ability_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_ability .item_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_item .move_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_item .ability_header .move_header_info .move_info_categoly,
main section.main_section .field_pokemon_item .item_header .move_header_info .move_info_categoly {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  height: 100%;
  margin-right: 2px;
}
main section.main_section .field_pokemon_move .move_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_move .ability_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_move .item_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_ability .move_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_ability .ability_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_ability .item_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_item .move_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_item .ability_header .move_header_info .move_info_categoly svg,
main section.main_section .field_pokemon_item .item_header .move_header_info .move_info_categoly svg {
  display: block;
  height: 80%;
  aspect-ratio: 1;
  fill: #444;
}
main section.main_section .field_pokemon_move .move_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_move .ability_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_move .item_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_ability .move_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_ability .ability_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_ability .item_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_item .move_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_item .ability_header .move_header_info .move_info_power,
main section.main_section .field_pokemon_item .item_header .move_header_info .move_info_power {
  display: block;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #444;
}
main section.main_section .field_pokemon_move .move_main,
main section.main_section .field_pokemon_move .ability_main,
main section.main_section .field_pokemon_move .item_main,
main section.main_section .field_pokemon_ability .move_main,
main section.main_section .field_pokemon_ability .ability_main,
main section.main_section .field_pokemon_ability .item_main,
main section.main_section .field_pokemon_item .move_main,
main section.main_section .field_pokemon_item .ability_main,
main section.main_section .field_pokemon_item .item_main {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 48px;
  padding-inline: 12px;
  border-radius: 12px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  cursor: pointer;
  margin-top: 2px;
}
main section.main_section .field_pokemon_move .move_main svg,
main section.main_section .field_pokemon_move .ability_main svg,
main section.main_section .field_pokemon_move .item_main svg,
main section.main_section .field_pokemon_ability .move_main svg,
main section.main_section .field_pokemon_ability .ability_main svg,
main section.main_section .field_pokemon_ability .item_main svg,
main section.main_section .field_pokemon_item .move_main svg,
main section.main_section .field_pokemon_item .ability_main svg,
main section.main_section .field_pokemon_item .item_main svg {
  display: block;
  width: 16px;
  fill: none;
  stroke: #aaa;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
main section.main_section .field_pokemon_move .move_main p.move_main_name,
main section.main_section .field_pokemon_move .move_main p.ability_main_name,
main section.main_section .field_pokemon_move .move_main p.item_main_name,
main section.main_section .field_pokemon_move .ability_main p.move_main_name,
main section.main_section .field_pokemon_move .ability_main p.ability_main_name,
main section.main_section .field_pokemon_move .ability_main p.item_main_name,
main section.main_section .field_pokemon_move .item_main p.move_main_name,
main section.main_section .field_pokemon_move .item_main p.ability_main_name,
main section.main_section .field_pokemon_move .item_main p.item_main_name,
main section.main_section .field_pokemon_ability .move_main p.move_main_name,
main section.main_section .field_pokemon_ability .move_main p.ability_main_name,
main section.main_section .field_pokemon_ability .move_main p.item_main_name,
main section.main_section .field_pokemon_ability .ability_main p.move_main_name,
main section.main_section .field_pokemon_ability .ability_main p.ability_main_name,
main section.main_section .field_pokemon_ability .ability_main p.item_main_name,
main section.main_section .field_pokemon_ability .item_main p.move_main_name,
main section.main_section .field_pokemon_ability .item_main p.ability_main_name,
main section.main_section .field_pokemon_ability .item_main p.item_main_name,
main section.main_section .field_pokemon_item .move_main p.move_main_name,
main section.main_section .field_pokemon_item .move_main p.ability_main_name,
main section.main_section .field_pokemon_item .move_main p.item_main_name,
main section.main_section .field_pokemon_item .ability_main p.move_main_name,
main section.main_section .field_pokemon_item .ability_main p.ability_main_name,
main section.main_section .field_pokemon_item .ability_main p.item_main_name,
main section.main_section .field_pokemon_item .item_main p.move_main_name,
main section.main_section .field_pokemon_item .item_main p.ability_main_name,
main section.main_section .field_pokemon_item .item_main p.item_main_name {
  display: block;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
  font-size: 1.1rem;
}
main section.main_section .field_pokemon_move .ability_suggestions_container,
main section.main_section .field_pokemon_ability .ability_suggestions_container,
main section.main_section .field_pokemon_item .ability_suggestions_container {
  display: flex;
  align-items: center;
  width: 100%;
}
main section.main_section .field_pokemon_move .ability_suggestions_container p.ability_suggestion,
main section.main_section .field_pokemon_ability .ability_suggestions_container p.ability_suggestion,
main section.main_section .field_pokemon_item .ability_suggestions_container p.ability_suggestion {
  display: block;
  color: #888;
  font-size: 0.8rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  padding: 4px 8px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: color 0.2s ease, font-weight 0.2s ease;
}
main section.main_section .field_pokemon_move .ability_suggestions_container p.ability_suggestion.active,
main section.main_section .field_pokemon_ability .ability_suggestions_container p.ability_suggestion.active,
main section.main_section .field_pokemon_item .ability_suggestions_container p.ability_suggestion.active {
  color: #3B4CCA;
  font-weight: 700;
}

/* とくせい効果のApple風スイッチ */
main section.main_section .ability_effect_switch {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
main section.main_section .ability_effect_switch_label {
  min-width: 2em;
  color: #34a853;
  font-family: "LINE Seed JP", sans-serif;
  font-size: 0.75rem;
  font-weight: 700;
  text-align: right;
  transition: color 0.2s ease;
}
main section.main_section .ability_effect_toggle {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}
main section.main_section .ability_effect_track {
  position: relative;
  display: block;
  width: 42px;
  height: 20px;
  border-radius: 999px;
  background: #34c759;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.04);
  transition: background-color 0.2s ease;
}
main section.main_section .ability_effect_thumb {
  position: absolute;
  top: 1px;
  left: 22px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.28);
  transition: left 0.2s ease, transform 0.2s ease;
}
main section.main_section .ability_effect_toggle:not(:checked) + .ability_effect_track {
  background: #d1d1d6;
}
main section.main_section .ability_effect_toggle:not(:checked) + .ability_effect_track .ability_effect_thumb {
  left: 2px;
}
main section.main_section .ability_effect_switch:has(.ability_effect_toggle:not(:checked)) .ability_effect_switch_label {
  color: #8e8e93;
}
main section.main_section .ability_effect_toggle:focus-visible + .ability_effect_track {
  outline: 3px solid rgba(59, 76, 202, 0.24);
  outline-offset: 2px;
}

/* 選択中の技・特性にだけ必要な条件 */
main section.main_section .move_context_container {
  display: grid;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
}
main section.main_section .move_context_container[hidden] {
  display: none;
}
main section.main_section .move_condition_toggle {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 42px;
  padding: 7px 9px 7px 11px;
  border: 1px solid #dfe1ef;
  border-radius: 10px;
  box-sizing: border-box;
  color: #555;
  background: rgba(59, 76, 202, 0.045);
  cursor: pointer;
  font-family: "LINE Seed JP", sans-serif;
  text-align: left;
}
main section.main_section .move_condition_label {
  flex: 1;
  font-size: 0.82rem;
  font-weight: 700;
}
main section.main_section .move_condition_state {
  margin-right: 7px;
  color: #8e8e93;
  font-size: 0.7rem;
  font-weight: 700;
}
main section.main_section .move_condition_track {
  position: relative;
  flex: 0 0 auto;
  width: 38px;
  height: 23px;
  border-radius: 999px;
  background: #d1d1d6;
  transition: background-color 0.18s ease;
}
main section.main_section .move_condition_thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
  transition: left 0.18s ease;
}
main section.main_section .move_condition_toggle.active {
  color: #2535a6;
  border-color: rgba(59, 76, 202, 0.25);
  background: rgba(59, 76, 202, 0.09);
}
main section.main_section .move_condition_toggle.active .move_condition_state {
  color: #34a853;
}
main section.main_section .move_condition_toggle.active .move_condition_track {
  background: #34c759;
}
main section.main_section .move_condition_toggle.active .move_condition_thumb {
  left: 17px;
}
main section.main_section .move_condition_toggle:focus-visible {
  outline: 3px solid rgba(59, 76, 202, 0.2);
  outline-offset: 2px;
}
main section.main_section .move_context_slider_container {
  width: 100%;
  padding: 9px 10px;
  border-radius: 10px;
  box-sizing: border-box;
  background: rgba(59, 76, 202, 0.055);
}
main section.main_section .move_context_slider_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
main section.main_section .move_context_slider_ttl {
  color: #666;
  font-size: 0.8rem;
  font-weight: 700;
}
main section.main_section .move_context_slider_val {
  color: #3B4CCA;
  font-size: 0.85rem;
  font-weight: 700;
}
main section.main_section .move_context_count_slider {
  display: flex;
  gap: 3px;
  width: 100%;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
main section.main_section .move_context_count_slider span {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-width: 0;
  height: 28px;
  border-radius: 4px;
  color: #999;
  background: #e9eaf1;
  cursor: pointer;
  font-size: 0.72rem;
  font-weight: 700;
  transition: color 0.15s ease, background-color 0.15s ease;
}
main section.main_section .move_context_count_slider span.active {
  color: #fff;
  background: #3B4CCA;
}

/* もちもの直下の回数指定／連続技の累積ヒット指定 */
main section.main_section .metronome_slider_container,
main section.main_section .hit_slider_container {
  width: 100%;
  margin-top: 10px;
  padding: 9px 10px;
  border-radius: 10px;
  box-sizing: border-box;
  background: rgba(59, 76, 202, 0.055);
}
main section.main_section .metronome_slider_container[hidden] {
  display: none;
}
main section.main_section .effect_slider_header,
main section.main_section .hit_slider_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}
main section.main_section .effect_slider_ttl,
main section.main_section .hit_slider_ttl {
  color: #666;
  font-size: 0.8rem;
  font-weight: 700;
}
main section.main_section .effect_slider_val,
main section.main_section .hit_slider_val {
  color: #3B4CCA;
  font-size: 0.85rem;
  font-weight: 700;
}
main section.main_section .effect_count_slider,
main section.main_section .hit_slider {
  display: flex;
  gap: 4px;
  width: 100%;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
main section.main_section .effect_count_slider span,
main section.main_section .hit_slider span {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  min-width: 0;
  height: 30px;
  border: 1px solid #ddd;
  border-radius: 6px;
  box-sizing: border-box;
  color: #777;
  background: #fff;
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: 700;
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
main section.main_section .effect_count_slider span.active,
main section.main_section .hit_slider span.active {
  color: #fff;
  border-color: #3B4CCA;
  background: #3B4CCA;
}
main section.main_section .hit_slider span.is-crit {
  color: #fff;
  border-color: #e56c3e;
  background: linear-gradient(135deg, #e56c3e 0%, #ff4757 100%);
  box-shadow: 0 0 6px rgba(229, 108, 62, 0.5);
}
main section.main_section .hit_slider span.is-crit::after {
  content: "★";
  margin-left: 1px;
  font-size: 0.62rem;
}
main section.main_section .field_pokemon_evs {
  display: block;
  width: 100%;
  margin-top: 24px;
  touch-action: pan-y;
}
main section.main_section .field_pokemon_evs .evs_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 24px;
}
main section.main_section .field_pokemon_evs .evs_header p.ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
main section.main_section .field_pokemon_evs .evs_slider_container {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin-top: 2px;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider_btn {
  display: grid;
  place-items: center;
  width: 32px;
  aspect-ratio: 1;
  border-radius: 8px;
  box-sizing: border-box;
  background-color: #3B4CCA;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: opacity 0.2s ease, transform 0.1s ease;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider_btn:active {
  transform: scale(0.95);
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider_btn svg {
  display: block;
  width: 60%;
  fill: #fff;
}
main section.main_section .field_pokemon_evs .evs_slider_container p.evs_slider_evs {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 32px;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #3B4CCA;
  font-size: 1.1rem;
  text-align: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider {
  display: flex;
  align-items: center;
  gap: 1px;
  width: calc(100% - 92px);
  height: 32px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  border-radius: 5px;
  padding: 1px;
  cursor: pointer;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider span {
  display: block;
  flex: 1;
  height: 100%;
  background-color: #ddd;
  border-radius: 2px;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider span:first-child {
  border-radius: 4px 2px 2px 4px;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider span:last-child {
  border-radius: 2px 4px 4px 2px;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider.evsh_slider span.active {
  background-color: #2DBE4E;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider.evsa_slider span.active {
  background-color: #E74C3C;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider.evsb_slider span.active {
  background-color: #D4A017;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider.evsc_slider span.active {
  background-color: #2D7FF9;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider.evsd_slider span.active {
  background-color: #7E57C2;
}
main section.main_section .field_pokemon_evs .evs_others {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 44px;
  margin-top: 8px;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature {
  display: flex;
  align-items: center;
  height: 100%;
  padding-left: 1px;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature div {
  display: grid;
  place-items: center;
  aspect-ratio: 3/2;
  height: 100%;
  border: 1px solid #ccc;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
  margin-left: -1px;
  transition: color 0.2s ease, background-color 0.2s ease, font-weight 0.2s ease;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature div.evs_nature_09 {
  border-radius: 12px 0 0 12px;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature div.evs_nature_09.active {
  background-color: #ebf6fb;
  color: #0288d1;
  font-weight: 700;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature div.evs_nature_10.active {
  background-color: #ebebeb;
  color: #000;
  font-weight: 700;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature div.evs_nature_11 {
  border-radius: 0 12px 12px 0;
}
main section.main_section .field_pokemon_evs .evs_others .evs_nature div.evs_nature_11.active {
  background-color: #fcefef;
  color: #d32f2f;
  font-weight: 700;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank {
  display: flex;
  align-items: center;
  gap: 2px;
  height: 100%;
  padding-left: 1px;
  margin-left: auto;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank select {
  display: block;
  width: 88px;
  height: 44px;
  background-color: transparent;
  border: 1px solid #ccc;
  outline: none;
  border-radius: 12px 4px 4px 12px;
  padding-inline: 8px;
  box-sizing: border-box;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank .evs_rank_arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 2px;
  width: 44px;
  height: 44px;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank .evs_rank_arrow div {
  display: grid;
  place-items: center;
  width: 44px;
  height: 21px;
  border: 1px solid #ccc;
  background-color: #f5f5f5;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background-color 0.15s ease;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank .evs_rank_arrow div:active {
  background-color: #d0d0d0;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank .evs_rank_arrow div.evs_rank_arrow_up {
  border-radius: 4px 12px 4px 2px;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank .evs_rank_arrow div.evs_rank_arrow_down {
  border-radius: 2px 4px 12px 4px;
}
main section.main_section .field_pokemon_evs .evs_others .evs_rank .evs_rank_arrow div svg {
  width: 16px;
  fill: none;
  stroke: #000;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
main section.main_section .field_others {
  display: block;
  width: 100%;
  margin-top: 24px;
}
main section.main_section .field_others .others_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 24px;
}
main section.main_section .field_others .others_header p.ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
main section.main_section .field_others .others_container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  gap: 6px;
  margin-top: 2px;
}
main section.main_section .field_others .others_container p.others_item {
  display: flex;
  align-items: center;
  padding-inline: 12px;
  height: 28px;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  font-size: 0.9rem;
  color: #3B4CCA;
  border: 1px solid #3B4CCA;
  border-radius: 100px;
  transition: background-color 0.15s ease, color 0.15s ease, font-weight 0.15s ease;
}
main section.main_section .field_others .others_container p.others_item.active {
  background-color: #3B4CCA;
  color: #fff;
  font-weight: 700;
}
main section.main_section .damage_context_selects {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-top: 10px;
}
main section.main_section .damage_context_selects label {
  display: grid;
  gap: 3px;
  font-size: 0.75rem;
  color: #777;
}
main section.main_section .damage_context_selects select {
  width: 100%;
  min-height: 30px;
  padding: 2px 8px;
  border: 1px solid #d5d8e8;
  border-radius: 8px;
  color: #333;
  background: #fff;
}

@media (max-width: 520px) {
  main section.main_section .damage_context_selects {
    grid-template-columns: 1fr;
  }
}
main section.main_section .field_damages {
  display: block;
  width: 100%;
  margin-top: 24px;
}
main section.main_section .field_damages .damages_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 24px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  list-style: none;
}
main section.main_section .field_damages .damages_header::-webkit-details-marker, main section.main_section .field_damages .damages_header::marker {
  display: none;
}
main section.main_section .field_damages .damages_header .ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
main section.main_section .field_damages .damages_header .damages_header_arrow {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
}
main section.main_section .field_damages .damages_header .damages_header_arrow svg {
  display: block;
  width: 16px;
  fill: none;
  stroke: #000;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
main section.main_section .field_damages .damages_container {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.3s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease, margin-top 0.3s ease;
  opacity: 0;
  margin-top: 0;
  width: 100%;
}
main section.main_section .field_damages .damages_container .damages_inner {
  overflow: hidden;
  min-height: 0;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 56px;
  padding-block: 8px;
  border-bottom: 1px dashed #ddd;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_left {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: calc(100% - 132px);
  gap: 2px;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_left .damage_ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_left .damage_desc {
  display: block;
  width: 100%;
  font-size: 0.75rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
  text-overflow: ellipsis;
  white-space: nowrap;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_right {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  width: 120px;
  height: 36px;
  box-sizing: border-box;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_right div {
  display: grid;
  place-items: center;
  width: 36px;
  height: 32px;
  border: 1px solid #ccc;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_right div.damages_btn_min {
  border-radius: 12px 0 0 12px;
  border-right: none;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_right div.damages_btn_plu {
  border-radius: 0 12px 12px 0;
  border-left: none;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_right div svg {
  display: block;
  width: 20px;
  fill: none;
  stroke: #000;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
main section.main_section .field_damages .damages_container .damages_inner .damages_damages .damages_right .damages_input {
  display: grid;
  place-items: center;
  width: 48px;
  height: 32px;
  border: 1px solid #ccc;
  background-color: #fcfcfc;
  outline: none;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
  text-align: center;
}
main section.main_section .field_damages[open] .damages_header .damages_header_arrow svg {
  transform: rotate(180deg);
}
main section.main_section .field_damages[open] .damages_container {
  grid-template-rows: 1fr;
  opacity: 1;
  margin-top: 4px;
}
main section.main_section .field_damages.is-closing .damages_header .damages_header_arrow svg {
  transform: rotate(0deg);
}
main section.main_section .field_damages.is-closing .damages_container {
  grid-template-rows: 0fr;
  opacity: 0;
  margin-top: 0;
}

button#changeroles {
  position: fixed;
  right: 12px;
  bottom: 116px;
  display: grid;
  place-items: center;
  width: 56px;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: rgba(250, 250, 250, 0.8666666667);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border: 1px solid #ddd;
  box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.6666666667);
  cursor: pointer;
  z-index: 99;
  transition: bottom 0.3s cubic-bezier(0.25, 1, 0.5, 1), transform 0.2s ease;
}
button#changeroles:active {
  transform: scale(0.92);
}
button#changeroles svg {
  width: 28px;
  fill: none;
  stroke: #3B4CCA;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.38s cubic-bezier(0.25, 1, 0.5, 1);
}
button#changeroles.is-swapping svg {
  transform: rotate(180deg);
}

body.usage-toast-visible button#changeroles {
  bottom: 184px;
}

section.environment {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: min(100%, 640px);
  min-height: 30svh;
  border-radius: 32px;
  box-shadow: 0 0 36px -12px rgba(0, 0, 0, 0.4666666667);
  padding: 32px 16px;
  box-sizing: border-box;
  background-color: #fafafa;
}
section.environment .env_weather,
section.environment .env_field {
  display: block;
  width: 100%;
}
section.environment .env_weather p.ttl,
section.environment .env_field p.ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
section.environment .env_weather .weather_select,
section.environment .env_weather .field_select,
section.environment .env_weather .hit_select,
section.environment .env_field .weather_select,
section.environment .env_field .field_select,
section.environment .env_field .hit_select {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 44px;
  border: 1px solid #ccc;
  border-radius: 22px;
  margin-top: 8px;
  box-sizing: border-box;
  z-index: 1;
}
section.environment .env_weather .weather_select::before,
section.environment .env_weather .field_select::before,
section.environment .env_weather .hit_select::before,
section.environment .env_field .weather_select::before,
section.environment .env_field .field_select::before,
section.environment .env_field .hit_select::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: calc(100% / var(--item-count, 4));
  height: 100%;
  border-radius: 22px;
  background: linear-gradient(135deg, #3B4CCA 0%, #4D5EE5 100%);
  box-shadow: 0 4px 14px rgba(59, 76, 202, 0.4), inset 0 1px 1px rgba(255, 255, 255, 0.3);
  z-index: 0;
  transform: translateX(calc(100% * var(--active-index, 0)));
  transition: transform 0.45s cubic-bezier(0.34, 1.4, 0.64, 1), opacity 0.3s ease;
  opacity: 0;
  pointer-events: none;
}
section.environment .env_weather .weather_select.has-active::before,
section.environment .env_weather .field_select.has-active::before,
section.environment .env_weather .hit_select.has-active::before,
section.environment .env_field .weather_select.has-active::before,
section.environment .env_field .field_select.has-active::before,
section.environment .env_field .hit_select.has-active::before {
  opacity: 1;
}
section.environment .env_weather .weather_select .weather_select_item,
section.environment .env_weather .weather_select .field_select_item,
section.environment .env_weather .weather_select .hit_select_item,
section.environment .env_weather .field_select .weather_select_item,
section.environment .env_weather .field_select .field_select_item,
section.environment .env_weather .field_select .hit_select_item,
section.environment .env_weather .hit_select .weather_select_item,
section.environment .env_weather .hit_select .field_select_item,
section.environment .env_weather .hit_select .hit_select_item,
section.environment .env_field .weather_select .weather_select_item,
section.environment .env_field .weather_select .field_select_item,
section.environment .env_field .weather_select .hit_select_item,
section.environment .env_field .field_select .weather_select_item,
section.environment .env_field .field_select .field_select_item,
section.environment .env_field .field_select .hit_select_item,
section.environment .env_field .hit_select .weather_select_item,
section.environment .env_field .hit_select .field_select_item,
section.environment .env_field .hit_select .hit_select_item {
  position: relative;
  display: grid;
  place-items: center;
  flex: 1;
  height: 100%;
  border-radius: 22px;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
  text-align: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  z-index: 1;
  transition: color 0.3s ease, background 0.3s ease;
}
section.environment .env_weather .weather_select .weather_select_item.active,
section.environment .env_weather .weather_select .field_select_item.active,
section.environment .env_weather .weather_select .hit_select_item.active,
section.environment .env_weather .field_select .weather_select_item.active,
section.environment .env_weather .field_select .field_select_item.active,
section.environment .env_weather .field_select .hit_select_item.active,
section.environment .env_weather .hit_select .weather_select_item.active,
section.environment .env_weather .hit_select .field_select_item.active,
section.environment .env_weather .hit_select .hit_select_item.active,
section.environment .env_field .weather_select .weather_select_item.active,
section.environment .env_field .weather_select .field_select_item.active,
section.environment .env_field .weather_select .hit_select_item.active,
section.environment .env_field .field_select .weather_select_item.active,
section.environment .env_field .field_select .field_select_item.active,
section.environment .env_field .field_select .hit_select_item.active,
section.environment .env_field .hit_select .weather_select_item.active,
section.environment .env_field .hit_select .field_select_item.active,
section.environment .env_field .hit_select .hit_select_item.active {
  color: #fff;
  font-weight: 700;
}
section.environment .env_weather .weather_select .weather_select_item.is-crit,
section.environment .env_weather .weather_select .field_select_item.is-crit,
section.environment .env_weather .weather_select .hit_select_item.is-crit,
section.environment .env_weather .field_select .weather_select_item.is-crit,
section.environment .env_weather .field_select .field_select_item.is-crit,
section.environment .env_weather .field_select .hit_select_item.is-crit,
section.environment .env_weather .hit_select .weather_select_item.is-crit,
section.environment .env_weather .hit_select .field_select_item.is-crit,
section.environment .env_weather .hit_select .hit_select_item.is-crit,
section.environment .env_field .weather_select .weather_select_item.is-crit,
section.environment .env_field .weather_select .field_select_item.is-crit,
section.environment .env_field .weather_select .hit_select_item.is-crit,
section.environment .env_field .field_select .weather_select_item.is-crit,
section.environment .env_field .field_select .field_select_item.is-crit,
section.environment .env_field .field_select .hit_select_item.is-crit,
section.environment .env_field .hit_select .weather_select_item.is-crit,
section.environment .env_field .hit_select .field_select_item.is-crit,
section.environment .env_field .hit_select .hit_select_item.is-crit {
  color: #fff !important;
  font-weight: 700;
  background: linear-gradient(135deg, #e56c3e 0%, #ff4757 100%);
  box-shadow: 0 2px 8px rgba(229, 108, 62, 0.4);
}
section.environment .env_weather .hit_slider_container,
section.environment .env_field .hit_slider_container {
  display: block;
  width: 100%;
  margin-top: 12px;
}
section.environment .env_weather .hit_slider_container .hit_slider_header,
section.environment .env_field .hit_slider_container .hit_slider_header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 20px;
  margin-bottom: 4px;
}
section.environment .env_weather .hit_slider_container .hit_slider_header p.hit_slider_ttl,
section.environment .env_field .hit_slider_container .hit_slider_header p.hit_slider_ttl {
  font-size: 0.85rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
section.environment .env_weather .hit_slider_container .hit_slider_header p.hit_slider_val,
section.environment .env_field .hit_slider_container .hit_slider_header p.hit_slider_val {
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #3B4CCA;
}
section.environment .env_weather .hit_slider_container .hit_slider,
section.environment .env_field .hit_slider_container .hit_slider {
  display: flex;
  align-items: center;
  gap: 2px;
  width: 100%;
  height: 32px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  border-radius: 6px;
  padding: 2px;
  cursor: pointer;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
section.environment .env_weather .hit_slider_container .hit_slider span,
section.environment .env_field .hit_slider_container .hit_slider span {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  height: 100%;
  background-color: #eee;
  border-radius: 3px;
  font-size: 0.75rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #aaa;
  transition: background-color 0.2s ease, color 0.2s ease;
}
section.environment .env_weather .hit_slider_container .hit_slider span.active,
section.environment .env_field .hit_slider_container .hit_slider span.active {
  background-color: #3B4CCA;
  color: #fff;
}
section.environment .env_weather .hit_slider_container .hit_slider span.is-crit,
section.environment .env_field .hit_slider_container .hit_slider span.is-crit {
  background: linear-gradient(135deg, #e56c3e 0%, #ff4757 100%) !important;
  color: #fff !important;
  box-shadow: 0 0 6px rgba(229, 108, 62, 0.6);
}
section.environment .env_weather .hit_slider_container .hit_slider span.is-crit::after,
section.environment .env_field .hit_slider_container .hit_slider span.is-crit::after {
  content: "★";
  font-size: 0.65rem;
  margin-left: 1px;
}

.usage_suggestion_toast {
  position: fixed;
  left: 50%;
  bottom: 116px;
  display: flex;
  align-items: center;
  width: min(100% - 1rem, 640px);
  min-height: 56px;
  border: 1px solid rgba(59, 76, 202, 0.2);
  border-radius: 20px;
  background-color: rgba(250, 250, 250, 0.94);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  box-shadow: 0 12px 32px -16px rgba(0, 0, 0, 0.55);
  opacity: 0;
  transform: translate(-50%, 20px);
  pointer-events: none;
  touch-action: none;
  z-index: 101;
  transition: opacity 0.24s ease, transform 0.32s cubic-bezier(0.25, 1, 0.5, 1);
}

.usage_suggestion_toast[hidden] {
  display: none;
}

.usage_suggestion_toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
  pointer-events: auto;
}
.usage_suggestion_toast .usage_suggestion_action {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;
  min-height: 56px;
  padding: 0 6px 0 16px;
  border: 0;
  background: transparent;
  color: #20233a;
  cursor: pointer;
}
.usage_suggestion_toast .usage_suggestion_action span {
  flex: 1;
  min-width: 0;
  font-size: 0.9rem;
  font-weight: 700;
  text-align: left;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.usage_suggestion_toast .usage_suggestion_action svg {
  flex: 0 0 auto;
  width: 22px;
  fill: none;
  stroke: #3B4CCA;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.usage_suggestion_toast .usage_suggestion_close {
  display: grid;
  place-items: center;
  flex: 0 0 48px;
  align-self: stretch;
  border: 0;
  border-left: 1px solid rgba(0, 0, 0, 0.08);
  background: transparent;
  color: #777;
  cursor: pointer;
}
.usage_suggestion_toast .usage_suggestion_close span {
  font-size: 1.65rem;
  font-weight: 400;
  line-height: 1;
}
.usage_suggestion_toast .usage_suggestion_action:active,
.usage_suggestion_toast .usage_suggestion_close:active {
  background-color: rgba(59, 76, 202, 0.08);
}

section.result {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  width: calc(100% - 1rem);
  min-height: 96px;
  margin-inline: auto;
  background-color: rgba(250, 250, 250, 0.8666666667);
  backdrop-filter: blur(4px);
  border: 1px solid #ddd;
  border-radius: 24px;
  box-shadow: 0 0 16px -8px rgba(0, 0, 0, 0.6666666667);
  padding: 16px;
  box-sizing: border-box;
  z-index: 99;
}
section.result .result_damage {
  display: flex;
  align-items: end;
  justify-content: flex-start;
  gap: 8px;
  width: 100%;
}
section.result .result_damage .result_sequence_badge {
  align-self: center;
  flex-shrink: 0;
  padding: 3px 7px;
  border-radius: 999px;
  background: rgba(59, 76, 202, 0.1);
  color: #3B4CCA;
  font-size: 0.65rem;
  font-weight: 700;
}
section.result .result_damage .result_sequence_badge[hidden] {
  display: none;
}
section.result .result_damage .result_damage_percent {
  display: flex;
  align-items: center;
  gap: 4px;
}
section.result .result_damage .result_damage_percent p {
  display: block;
  font-size: 1.1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
}
section.result .result_damage .result_damage_percent p::after {
  content: "%";
  font-size: 0.8rem;
  margin-left: 2px;
}
section.result .result_damage .result_damage_percent span {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.6666666667);
}
section.result .result_damage .result_damage_percent .result_damage_percent_fixed {
  display: inline-block;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  margin-left: 2px;
}
section.result .result_damage .result_damage_percent .result_damage_percent_fixed.is-damage {
  color: #e56c3e;
}
section.result .result_damage .result_damage_percent .result_damage_percent_fixed.is-heal {
  color: #52b557;
}
section.result .result_damage .result_damage_num {
  display: flex;
  align-items: center;
  gap: 4px;
  margin-left: auto;
}
section.result .result_damage .result_damage_num p {
  display: block;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
}
section.result .result_damage .result_damage_num span {
  display: block;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.6666666667);
}
section.result .result_damage .result_damage_num .result_damage_num_fixed {
  display: inline-block;
  font-size: 0.85rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
}
section.result .result_damage .result_damage_num .result_damage_num_fixed.is-damage {
  color: #e56c3e;
}
section.result .result_damage .result_damage_num .result_damage_num_fixed.is-heal {
  color: #52b557;
}
section.result.is-mixed-targets .result_progress {
  opacity: 0.45;
}
section.result .result_progress {
  position: relative;
  display: block;
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.1333333333);
  overflow: hidden;
}
section.result .result_progress div {
  position: absolute;
  top: 0;
  display: block;
  height: 100%;
  background-color: #52b557;
  border-radius: 4px;
  transition: width 0.3s cubic-bezier(0.25, 1, 0.5, 1), left 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
section.result .result_progress div.result_progress_absolute {
  left: 0;
  width: 66%;
  z-index: 2;
}
section.result .result_progress div.result_progress_uncertain {
  left: 0;
  opacity: 0.3;
  width: 80%;
  z-index: 1;
}
section.result .hit_count_container {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 8px;
}
section.result .hit_count_container .hit_count_ttl {
  font-size: 0.8rem;
  font-weight: 700;
  color: #666;
  white-space: nowrap;
}
section.result .hit_count_container .hit_count_list {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
section.result .hit_count_container .hit_count_list .hit_count_item {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 28px;
  padding: 0 6px;
  font-size: 0.8rem;
  font-weight: 700;
  color: #555;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: all 0.2s ease;
}
section.result .hit_count_container .hit_count_list .hit_count_item.active {
  background: #3B4CCA;
  color: #fff;
  border-color: #3B4CCA;
}
section.result .hit_count_container .hit_count_list .hit_count_item.is-crit {
  background: #e56c3e;
  color: #fff;
  border-color: #e56c3e;
  box-shadow: 0 0 6px rgba(229, 108, 62, 0.5);
}
section.result .hit_count_container .hit_count_list .hit_count_item.is-crit::after {
  content: " (急所)";
  font-size: 0.7rem;
}
section.result .hit_slider_container {
  margin-top: 8px;
  padding: 8px 10px;
  background: rgba(0, 0, 0, 0.03);
  border-radius: 8px;
}
section.result .hit_slider_container .hit_slider_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
section.result .hit_slider_container .hit_slider_header .hit_slider_ttl {
  font-size: 0.8rem;
  font-weight: 700;
  color: #666;
}
section.result .hit_slider_container .hit_slider_header .hit_slider_val {
  font-size: 0.85rem;
  font-weight: 700;
  color: #3B4CCA;
}
section.result .hit_slider_container .hit_slider {
  display: flex;
  gap: 4px;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
section.result .hit_slider_container .hit_slider span {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  font-size: 0.75rem;
  font-weight: 700;
  color: #555;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.15s ease;
}
section.result .hit_slider_container .hit_slider span.active {
  background: #3B4CCA;
  color: #fff;
  border-color: #3B4CCA;
}
section.result .hit_slider_container .hit_slider span.is-crit {
  background: #e56c3e;
  color: #fff;
  border-color: #e56c3e;
  box-shadow: 0 0 6px rgba(229, 108, 62, 0.5);
}
section.result .result_other {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 24px;
}
section.result .result_other .result_weak {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 24px;
  background-color: #f5f5f5;
  box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.1333333333);
  border-radius: 12px;
}
section.result .result_other .result_weak p {
  display: block;
  width: 28px;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
  font-size: 0.8rem;
  margin-inline: auto;
  transition: color 0.2s ease, font-weight 0.2s ease;
}
section.result .result_other .result_weak::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 2px;
  display: block;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background-color: #aaa;
  transition: left 0.2s ease, background-color 0.2s ease;
}
section.result .result_other .result_weak.active p {
  color: #3B4CCA;
  font-weight: 700;
}
section.result .result_other .result_weak.active::after {
  left: 62px;
  background-color: #3B4CCA;
}
section.result .result_other .result_jadge {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 8px;
  height: 24px;
  margin-left: auto;
}
section.result .result_other .result_jadge p.result_judge_num {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #3B4CCA;
}
section.result .result_other .result_jadge p.result_judge_percent {
  display: block;
  font-size: 0.8rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: rgba(59, 76, 202, 0.6666666667);
}

section.modals {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100vw;
  height: 100dvh;
  background-color: #fafafa;
  z-index: 99;
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
  transition: transform 0.35s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.3s ease;
  overflow-y: auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
}
section.modals.is-open {
  transform: translateY(0);
  opacity: 1;
  pointer-events: auto;
}
section.modals.is-closing {
  transform: translateY(100%);
  opacity: 0;
  pointer-events: none;
}
section.modals .modal_search_container {
  position: sticky;
  top: 0;
  z-index: 10;
  background-color: #fafafa;
  display: flex;
  align-items: center;
  width: 100%;
  height: 64px;
  box-shadow: 0 0 32px -16px #000;
  border-radius: 0 0 24px 24px;
}
section.modals .modal_search_container label {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
section.modals .modal_search_container label .modal_search_icon {
  display: grid;
  place-items: center;
  width: 64px;
  aspect-ratio: 1;
}
section.modals .modal_search_container label .modal_search_icon svg {
  display: block;
  width: 24px;
  fill: none;
  stroke: #aaa;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
section.modals .modal_search_container label input {
  display: block;
  width: calc(100% - 64px);
  height: 100%;
  border: none;
  outline: none;
  background-color: transparent;
  border-radius: 12px;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
}
section.modals .modal_search_container label input::-moz-placeholder {
  color: #bbb;
}
section.modals .modal_search_container label input::placeholder {
  color: #bbb;
}
section.modals .modal_search_container .modal_search_close {
  display: grid;
  place-items: center;
  width: 64px;
  aspect-ratio: 1;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: transform 0.15s ease, opacity 0.15s ease;
}
section.modals .modal_search_container .modal_search_close:active {
  transform: scale(0.9);
  opacity: 0.7;
}
section.modals .modal_search_container .modal_search_close svg {
  display: block;
  width: 24px;
  fill: none;
  stroke: #000;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
section.modals .modal_pokemon_container {
  display: block;
  width: 100%;
  margin-top: 12px;
}
section.modals .modal_pokemon_container .modal_pokemon_item {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  height: 88px;
  padding-inline: 8px;
  box-sizing: border-box;
}
section.modals .modal_pokemon_container .modal_pokemon_item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: calc(100% - 2rem);
  height: 0.5px;
  background-color: #aaa;
  margin-inline: auto;
  border-radius: 1px;
}
section.modals .modal_pokemon_container .modal_pokemon_item img.modal_pokemon_item_img {
  display: block;
  aspect-ratio: 1;
  height: 72px;
  -o-object-fit: cover;
  object-fit: cover;
}
section.modals .modal_pokemon_container .modal_pokemon_item .modal_pokemon_item_info {
  display: flex;
  justify-content: center;
  flex-direction: column;
  width: calc(100% - 216px);
  gap: 4px;
  flex: 1;
  min-width: 0;
}
section.modals .modal_pokemon_container .modal_pokemon_item .modal_pokemon_item_info p.modal_pokemon_item_name {
  display: block;
  width: 100%;
  font-size: 1.2rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
  text-overflow: ellipsis;
  white-space: nowrap;
}
section.modals .modal_pokemon_container .modal_pokemon_item .modal_pokemon_item_info .modal_pokemon_item_types_container {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  height: 24px;
}
section.modals .modal_pokemon_container .modal_pokemon_item .modal_pokemon_item_info .modal_pokemon_item_types_container .modal_pokemon_item_type {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 24px;
  width: 24px;
  height: 100%;
  border-radius: 4px;
  padding: 0;
  overflow: hidden;
}
section.modals .modal_pokemon_container .modal_pokemon_item .modal_pokemon_item_info .modal_pokemon_item_types_container .modal_pokemon_item_type svg {
  display: block;
  width: 100%;
  height: 100%;
}
section.modals .modal_pokemon_container .modal_pokemon_item .modal_pokemon_item_info .modal_pokemon_item_types_container .modal_pokemon_item_type p {
  display: block;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #fff;
  font-size: 0.88rem;
  white-space: nowrap;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav {
  display: flex;
  align-items: center;
  margin-left: auto;
  flex-shrink: 0;
  height: 40px;
  border: 1px solid #ccc;
  border-radius: 12px;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav div {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  height: 100%;
  font-size: 0.9rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #000;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: background-color 0.15s ease;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav div:active {
  background-color: #eee;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav div.modal_pokemon_item_32 {
  border-inline: 1px solid #ddd;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav div.modal_pokemon_item_32m {
  color: #f00;
  font-weight: 700;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav.defender_presets div.modal_pokemon_item_32 {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 1px;
  line-height: 1;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav.defender_presets .modal_pokemon_preset_stat {
  display: block;
  font-size: 0.55rem;
  font-weight: 600;
  line-height: 0.85;
}
section.modals .modal_pokemon_container .modal_pokemon_item nav.defender_presets .modal_pokemon_preset_value {
  display: block;
  font-size: 1rem;
  line-height: 1;
}
section.modals .modal_move_container {
  display: block;
  width: 100%;
  margin-top: 12px;
}
section.modals .modal_move_container .modal_move_item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  height: 64px;
  padding-block: 8px;
  padding-inline: 8px;
  box-sizing: border-box;
}
section.modals .modal_move_container .modal_move_item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: calc(100% - 2rem);
  height: 0.5px;
  background-color: #aaa;
  margin-inline: auto;
  border-radius: 1px;
}
section.modals .modal_move_container .modal_move_item p.modal_move_item_ttl {
  display: block;
  width: calc(100% - 92px);
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
  font-size: 1.1rem;
  flex: 1;
  min-width: 0;
  line-height: 1.3;
}
section.modals .modal_move_container .modal_move_item .modal_move_item_info {
  display: flex;
  align-items: center;
  width: 92px;
  height: 24px;
  margin-left: auto;
  flex-shrink: 0;
}
section.modals .modal_move_container .modal_move_item .modal_move_item_info .modal_move_item_type {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  height: 100%;
  border-radius: 4px;
  margin-right: 6px;
}
section.modals .modal_move_container .modal_move_item .modal_move_item_info .modal_move_item_type svg {
  display: block;
  height: 80%;
}
section.modals .modal_move_container .modal_move_item .modal_move_item_info .modal_move_item_categoly {
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  height: 100%;
  margin-right: 2px;
}
section.modals .modal_move_container .modal_move_item .modal_move_item_info .modal_move_item_categoly svg {
  display: block;
  height: 80%;
  aspect-ratio: 1;
  fill: #444;
}
section.modals .modal_move_container .modal_move_item .modal_move_item_info .modal_move_item_power {
  display: block;
  width: 36px;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #444;
  text-align: left;
}
section.modals .modal_ability_container,
section.modals .modal_item_container {
  display: block;
  width: 100%;
  margin-top: 12px;
}
section.modals .modal_ability_container .modal_ability_item,
section.modals .modal_ability_container .modal_item_item,
section.modals .modal_item_container .modal_ability_item,
section.modals .modal_item_container .modal_item_item {
  position: relative;
  display: flex;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  width: 100%;
  height: 88px;
  padding-inline: 8px;
  box-sizing: border-box;
}
section.modals .modal_ability_container .modal_ability_item::after,
section.modals .modal_ability_container .modal_item_item::after,
section.modals .modal_item_container .modal_ability_item::after,
section.modals .modal_item_container .modal_item_item::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: calc(100% - 2rem);
  height: 0.5px;
  background-color: #aaa;
  margin-inline: auto;
  border-radius: 1px;
}
section.modals .modal_ability_container .modal_ability_item p.modal_ability_item_ttl,
section.modals .modal_ability_container .modal_ability_item p.modal_item_item_ttl,
section.modals .modal_ability_container .modal_item_item p.modal_ability_item_ttl,
section.modals .modal_ability_container .modal_item_item p.modal_item_item_ttl,
section.modals .modal_item_container .modal_ability_item p.modal_ability_item_ttl,
section.modals .modal_item_container .modal_ability_item p.modal_item_item_ttl,
section.modals .modal_item_container .modal_item_item p.modal_ability_item_ttl,
section.modals .modal_item_container .modal_item_item p.modal_item_item_ttl {
  display: block;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #000;
  font-size: 1.1rem;
}
section.modals .modal_ability_container .modal_ability_item p.modal_ability_item_desc,
section.modals .modal_ability_container .modal_ability_item p.modal_item_item_desc,
section.modals .modal_ability_container .modal_item_item p.modal_ability_item_desc,
section.modals .modal_ability_container .modal_item_item p.modal_item_item_desc,
section.modals .modal_item_container .modal_ability_item p.modal_ability_item_desc,
section.modals .modal_item_container .modal_ability_item p.modal_item_item_desc,
section.modals .modal_item_container .modal_item_item p.modal_ability_item_desc,
section.modals .modal_item_container .modal_item_item p.modal_item_item_desc {
  display: -webkit-box;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  box-orient: vertical;
  -webkit-box-orient: vertical;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
  font-size: 0.84rem;
}
section.modals .modal_ability_container .modal_ability_item svg,
section.modals .modal_ability_container .modal_item_item svg,
section.modals .modal_item_container .modal_ability_item svg,
section.modals .modal_item_container .modal_item_item svg {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 24px;
  fill: none;
  stroke: #aaa;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
section.modals .modal_types_now {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 12px;
  width: 100%;
  padding-inline: 1rem;
  box-sizing: border-box;
  margin-block: 20px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
}
section.modals .modal_types_now::-webkit-scrollbar {
  display: none;
}
section.modals .modal_types_now {
  -ms-overflow-style: none;
  scrollbar-width: none;
}
section.modals .modal_types_now .modal_types_now_item {
  display: grid;
  place-items: center;
  width: 36px;
  aspect-ratio: 1;
  border-radius: 6px;
  flex-shrink: 0;
  scroll-snap-align: start;
  transition: opacity 0.15s ease;
}
section.modals .modal_types_now .modal_types_now_item:active {
  opacity: 0.7;
}
section.modals .modal_types_now .modal_types_now_item svg {
  display: block;
  width: 28px;
}
section.modals .modal_types_select_container {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 12px;
  width: 100%;
  padding-inline: 1rem;
  box-sizing: border-box;
}
section.modals .modal_types_select_container .modal_types_select_item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: calc(50% - 6px);
  aspect-ratio: 3/1;
  background-color: #535ca8;
  border-radius: 12px;
}
section.modals .modal_types_select_container .modal_types_select_item svg {
  height: 50%;
}
section.modals .modal_types_select_container .modal_types_select_item p {
  display: block;
  width: 112px;
  font-size: 1.4rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 700;
  color: #fff;
  text-align: center;
}
section.modals .modal_types_select_container .modal_types_select_item::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  opacity: 0;
  transition: opacity 0.15s ease;
}
section.modals .modal_types_select_container .modal_types_select_item.selected::after {
  opacity: 1;
}

.env_trigger_bar {
  position: fixed;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding-inline: 36px;
  background-color: rgba(255, 255, 255, 0.8666666667);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(0, 0, 0, 0.0666666667);
  border-top: none;
  border-radius: 0 0 36px 36px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  z-index: 98;
  cursor: pointer;
  transition: transform 0.2s ease, background-color 0.2s ease;
}
.env_trigger_bar .env_trigger_pill {
  display: block;
  width: 20px;
  height: 3px;
  border-radius: 2px;
  background-color: #bbb;
}
.env_trigger_bar .env_trigger_text {
  font-family: "LINE Seed JP", sans-serif;
  font-size: 0.78rem;
  font-weight: 700;
  color: #555;
}
.env_trigger_bar:hover {
  background-color: #ffffff;
}

.env_overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 100;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}
.env_overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}

section.environment {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 640px;
  margin-inline: auto;
  background-color: #ffffff;
  border-radius: 0 0 24px 24px;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.2);
  padding: 16px 20px 20px;
  box-sizing: border-box;
  z-index: 101;
  transform: translateY(-105%);
  transition: transform 0.35s cubic-bezier(0.25, 1, 0.5, 1);
  touch-action: pan-y;
}
section.environment.is-open {
  transform: translateY(0);
}
section.environment .env_drag_handle {
  width: 36px;
  height: 4px;
  background-color: #ddd;
  border-radius: 2px;
  margin: 0 auto 12px;
  cursor: grab;
}
section.environment .env_weather,
section.environment .env_field {
  margin-bottom: 12px;
}
section.environment .env_weather p.ttl,
section.environment .env_field p.ttl {
  font-family: "LINE Seed JP", sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 6px;
}
section.environment .env_weather .weather_select,
section.environment .env_weather .field_select,
section.environment .env_field .weather_select,
section.environment .env_field .field_select {
  display: flex;
  gap: 8px;
}
section.environment .env_weather .weather_select .weather_select_item,
section.environment .env_weather .weather_select .field_select_item,
section.environment .env_weather .field_select .weather_select_item,
section.environment .env_weather .field_select .field_select_item,
section.environment .env_field .weather_select .weather_select_item,
section.environment .env_field .weather_select .field_select_item,
section.environment .env_field .field_select .weather_select_item,
section.environment .env_field .field_select .field_select_item {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  border-radius: 8px;
  font-family: "LINE Seed JP", sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  color: #555;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  transition: all 0.2s ease;
}
section.environment .env_weather .weather_select .weather_select_item.active,
section.environment .env_weather .weather_select .field_select_item.active,
section.environment .env_weather .field_select .weather_select_item.active,
section.environment .env_weather .field_select .field_select_item.active,
section.environment .env_field .weather_select .weather_select_item.active,
section.environment .env_field .weather_select .field_select_item.active,
section.environment .env_field .field_select .weather_select_item.active,
section.environment .env_field .field_select .field_select_item.active {
  color: #fff;
}

.field_pokemon_current_hp {
  margin-block: 12px 16px;
  width: 100%;
}
.field_pokemon_current_hp .current_hp_header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 6px;
}
.field_pokemon_current_hp .current_hp_header .ttl {
  display: block;
  font-size: 1rem;
  font-family: "LINE Seed JP", sans-serif;
  font-weight: 400;
  color: #777;
}
.field_pokemon_current_hp .current_hp_header .current_hp_display {
  font-family: "LINE Seed JP", sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  color: #3B4CCA;
}
.field_pokemon_current_hp .current_hp_header .current_hp_display .current_hp_pct {
  font-size: 1rem;
}
.field_pokemon_current_hp .current_hp_header .current_hp_display .current_hp_val {
  color: #e56c3e;
}
.field_pokemon_current_hp .current_hp_header .current_hp_display .current_hp_max {
  color: #666;
}
.field_pokemon_current_hp .current_hp_slider_container {
  width: 100%;
}
.field_pokemon_current_hp .current_hp_slider_container .custom_hp_slider {
  display: flex;
  align-items: center;
  gap: 1px;
  width: 100%;
  height: 32px;
  border: 1px solid #ccc;
  box-sizing: border-box;
  border-radius: 6px;
  padding: 2px;
  cursor: pointer;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: #fff;
}
.field_pokemon_current_hp .current_hp_slider_container .custom_hp_slider span {
  display: block;
  flex: 1;
  height: 100%;
  background-color: #eee;
  border-radius: 3px;
}
.field_pokemon_current_hp .current_hp_slider_container .custom_hp_slider span.active {
  background-color: #52b557;
}

main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider.evss_slider span.active {
  background-color: #ef6f9a;
}
main section.main_section .supplemental_evs {
  order: 99;
}

section.result {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}
section.result:focus-visible {
  box-shadow: 0 0 0 3px rgba(59, 76, 202, 0.24), 0 0 16px -8px rgba(0, 0, 0, 0.6666666667);
}

/* クリック可能な要素の操作感を統一 */
:where(button,
select,
summary,
label[for],
[role=button],
.pokemon_info_img_container,
.pokemon_info_mega,
.pokemon_info_type_edit,
.ability_suggestion,
.move_condition_switch,
.move_context_count_slider span,
.effect_count_slider span,
.hit_slider span,
.evs_slider_btn,
.evs_nature div,
.evs_rank_arrow div,
.others_item,
.weather_select_item,
.field_select_item,
.env_trigger_bar,
.modal_pokemon_item,
.modal_move_item,
.modal_ability_item,
.modal_item_item,
.modal_types_select_item,
.modal_types_now_item,
.modal_search_close,
.hit_count_item) {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

:where(button,
summary,
label[for],
[role=button],
.pokemon_info_img_container,
.pokemon_info_mega,
.pokemon_info_type_edit,
.ability_suggestion,
.move_condition_switch,
.move_context_count_slider span,
.effect_count_slider span,
.hit_slider span,
.evs_slider_btn,
.evs_nature div,
.evs_rank_arrow div,
.others_item,
.weather_select_item,
.field_select_item,
.env_trigger_bar,
.modal_pokemon_item,
.modal_move_item,
.modal_ability_item,
.modal_item_item,
.modal_types_select_item,
.modal_types_now_item,
.modal_search_close,
.hit_count_item):active {
  filter: brightness(0.94);
}

:where(.pokemon_info_name_container,
.pokemon_info_img_container,
.pokemon_info_mega,
.pokemon_info_type_edit,
.move_main,
.ability_main,
.item_main,
[role=button]:not(section.result),
.ability_suggestion,
.move_condition_switch,
.move_context_count_slider span,
.effect_count_slider span,
.hit_slider span,
.evs_nature div,
.others_item,
.weather_select_item,
.field_select_item,
.env_trigger_bar,
.hit_count_item):active {
  scale: 0.97;
}

.modal_search_container label {
  cursor: text;
}
.modal_search_container label:active {
  filter: none;
}

main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider,
.field_pokemon_current_hp .current_hp_slider_container .custom_hp_slider {
  cursor: ew-resize;
}
main section.main_section .field_pokemon_evs .evs_slider_container .evs_slider:active,
.field_pokemon_current_hp .current_hp_slider_container .custom_hp_slider:active {
  cursor: grabbing;
}

:where(button, select, summary, input, [tabindex]):focus-visible {
  outline: 3px solid rgba(59, 76, 202, 0.24);
  outline-offset: 2px;
}

:where(button, select):disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

@media (hover: hover) and (pointer: fine) {
  :where(button,
  summary,
  label[for],
  [role=button],
  .pokemon_info_img_container,
  .pokemon_info_mega,
  .pokemon_info_type_edit,
  .ability_suggestion,
  .move_condition_switch,
  .move_context_count_slider span,
  .effect_count_slider span,
  .hit_slider span,
  .evs_slider_btn,
  .evs_nature div,
  .evs_rank_arrow div,
  .others_item,
  .weather_select_item,
  .field_select_item,
  .env_trigger_bar,
  .modal_pokemon_item,
  .modal_move_item,
  .modal_ability_item,
  .modal_item_item,
  .modal_types_select_item,
  .modal_types_now_item,
  .modal_search_close,
  .hit_count_item):hover {
    filter: brightness(0.98);
  }
}
section.modals.modal_detailresult {
  z-index: 98;
  padding-bottom: 132px;
  background: #f3f4f7;
  color: #171923;
}
section.modals.modal_detailresult .detailresult_header {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 72px;
  padding: 10px max(16px, env(safe-area-inset-left));
  box-sizing: border-box;
  background: rgba(250, 250, 250, 0.92);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  overflow: visible;
}
section.modals.modal_detailresult .detailresult_header h1 {
  font-size: 1.2rem;
  line-height: 1.25;
}
section.modals.modal_detailresult .detailresult_eyebrow {
  color: #3B4CCA;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}
section.modals.modal_detailresult .detailresult_close {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}
section.modals.modal_detailresult .detailresult_close svg {
  width: 24px;
  fill: none;
  stroke: #303342;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
section.modals.modal_detailresult .detailresult_body {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: min(100% - 24px, 720px);
  margin: 14px auto 32px;
  overflow: visible;
}

.detail_overview_section,
.detail_section {
  width: 100%;
  box-sizing: border-box;
  overflow: visible;
}

.detail_section {
  padding: 15px 2px 17px;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}

.detail_section_header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 0 2px 10px;
}
.detail_section_header h2 {
  font-size: 0.95rem;
}
.detail_section_header span {
  color: #8a8d99;
  font-size: 0.68rem;
}

.detail_share_card {
  position: relative;
  width: 100%;
  padding: 16px 18px;
  border-radius: 20px;
  box-sizing: border-box;
  background: linear-gradient(145deg, #fff 0%, #eef1ff 55%, #fff3ee 100%);
  border: 1px solid rgba(59, 76, 202, 0.16);
  box-shadow: 0 18px 44px -30px rgba(19, 26, 73, 0.7);
  overflow: visible;
}
.detail_share_card .detail_share_brand {
  margin-bottom: 8px;
  color: #3B4CCA;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-align: center;
}
.detail_share_card .detail_matchup {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(110px, 1.15fr) minmax(0, 1fr);
  align-items: center;
  gap: 8px;
}
.detail_share_card .detail_pokemon {
  display: flex;
  align-items: center;
  flex-direction: column;
  min-width: 0;
  text-align: center;
}
.detail_share_card .detail_pokemon img {
  width: 76px;
  height: 76px;
  object-fit: contain;
}
.detail_share_card .detail_pokemon > p {
  max-width: 100%;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detail_share_card .detail_attacker_name,
.detail_share_card .detail_defender_name {
  font-size: 0.92rem;
  font-weight: 700;
}
.detail_share_card .detail_attacker_evs,
.detail_share_card .detail_defender_evs {
  margin-top: 2px;
  color: #676b7c;
  font-size: 0.65rem;
  font-weight: 700;
}
.detail_share_card .detail_matchup_center {
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
  text-align: center;
}
.detail_share_card .detail_turn_order {
  padding: 3px 9px;
  border-radius: 999px;
  background: #3B4CCA;
  color: #fff;
  font-size: 0.68rem;
  font-weight: 700;
}
.detail_share_card .detail_move_name {
  max-width: 100%;
  color: #171923;
  font-size: 1rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detail_share_card .detail_move_meta {
  color: #737789;
  font-size: 0.65rem;
  white-space: nowrap;
}
.detail_share_card .detail_loadouts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-top: 10px;
}
.detail_share_card .detail_loadouts p {
  padding: 7px 9px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.74);
  color: #555a6d;
  font-size: 0.68rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detail_share_card .detail_loadouts .detail_defender_loadout {
  text-align: right;
}
.detail_share_card .detail_share_damage {
  display: grid;
  grid-template-columns: auto auto;
  grid-template-rows: auto auto;
  align-items: center;
  justify-content: center;
  column-gap: 12px;
  row-gap: 3px;
  margin-top: 12px;
}
.detail_share_card .detail_share_damage .detail_damage_range {
  grid-column: 1;
  grid-row: 1/3;
}
.detail_share_card .detail_share_damage .detail_damage_percent {
  grid-column: 2;
  grid-row: 1;
}
.detail_share_card .detail_share_damage .detail_knockout {
  grid-column: 2;
  grid-row: 2;
}
.detail_share_card .detail_damage_progress {
  margin-top: 12px;
}
.detail_share_card .detail_sequence_breakdown {
  margin-top: 10px;
}
.detail_share_card .detail_sequence_breakdown[hidden] {
  display: none;
}
.detail_share_card .detail_sequence_rows {
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.detail_share_card .detail_sequence_row {
  appearance: none;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) auto;
  align-items: center;
  gap: 7px;
  min-height: 42px;
  padding: 6px 8px;
  border: 1px solid rgba(23, 25, 35, 0.07);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  color: inherit;
  font: inherit;
  text-align: left;
  box-sizing: border-box;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: border-color 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}
.detail_share_card .detail_sequence_row.is-active {
  border-color: rgba(59, 76, 202, 0.42);
  box-shadow: 0 4px 13px -8px rgba(41, 50, 111, 0.82);
}
.detail_share_card .detail_sequence_row.is-disabled {
  opacity: 0.42;
}
.detail_share_card .detail_sequence_row.detail_sequence_total {
  border-color: rgba(59, 76, 202, 0.18);
  background: rgba(59, 76, 202, 0.08);
}
.detail_share_card .detail_sequence_row.detail_sequence_total.is-active {
  border-color: rgba(59, 76, 202, 0.42);
  box-shadow: 0 4px 13px -8px rgba(41, 50, 111, 0.82);
}
.detail_share_card .detail_sequence_index {
  display: grid;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  color: #3B4CCA;
  font-size: 0.68rem;
  font-weight: 700;
  box-shadow: 0 1px 4px rgba(23, 25, 35, 0.1);
}
.detail_share_card .detail_sequence_matchup,
.detail_share_card .detail_sequence_damage {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 1px;
}
.detail_share_card .detail_sequence_matchup strong,
.detail_share_card .detail_sequence_damage strong {
  overflow: hidden;
  color: #242731;
  font-size: 0.66rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detail_share_card .detail_sequence_matchup small,
.detail_share_card .detail_sequence_damage small {
  overflow: hidden;
  color: #747887;
  font-size: 0.58rem;
  font-weight: 500;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detail_share_card .detail_sequence_damage {
  align-items: flex-end;
}
.detail_share_card .detail_sequence_damage strong {
  color: #e56c3e;
  font-size: 0.7rem;
}
.detail_share_card .detail_damage_range {
  color: #171923;
  font-size: 1.55rem;
  line-height: 1;
}
.detail_share_card .detail_damage_percent {
  color: #e56c3e;
  font-size: 0.9rem;
  font-weight: 700;
}
.detail_share_card .detail_knockout {
  display: flex;
  align-items: baseline;
  gap: 5px;
  padding: 4px 8px;
  border-radius: 999px;
  background: rgba(59, 76, 202, 0.1);
  color: #3B4CCA;
  font-size: 0.72rem;
  font-weight: 700;
}
.detail_share_card .detail_knockout strong {
  font-size: inherit;
}
.detail_share_card .detail_knockout small {
  color: rgba(59, 76, 202, 0.7);
  font-size: 0.62rem;
  font-weight: 700;
}
.detail_share_card .detail_environment {
  margin-top: 8px;
  color: #777b8c;
  font-size: 0.66rem;
  font-weight: 700;
  text-align: center;
}

section.modals.modal_detailresult .result_progress {
  position: relative;
  display: block;
  width: 100%;
  height: 8px;
  border-radius: 4px;
  background-color: rgba(0, 0, 0, 0.1333333333);
  overflow: hidden;
}
section.modals.modal_detailresult .result_progress div {
  position: absolute;
  top: 0;
  display: block;
  height: 100%;
  border-radius: 4px;
  background-color: #52b557;
  transition: width 0.3s cubic-bezier(0.25, 1, 0.5, 1), left 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
section.modals.modal_detailresult .result_progress div.result_progress_absolute {
  left: 0;
  width: 0;
  z-index: 2;
}
section.modals.modal_detailresult .result_progress div.result_progress_uncertain {
  left: 0;
  width: 0;
  z-index: 1;
  opacity: 0.3;
}

.detail_rolls_scroller {
  width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}
.detail_rolls_scroller::-webkit-scrollbar {
  display: none;
}

.detail_rolls {
  display: grid;
  grid-template-columns: repeat(16, minmax(42px, 1fr));
  min-width: 672px;
}
.detail_rolls .detail_roll_item {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  min-height: 48px;
  border-left: 1px solid #dfe1e7;
}
.detail_rolls .detail_roll_item:last-child {
  border-right: 1px solid #dfe1e7;
}
.detail_rolls .detail_roll_item strong {
  color: #171923;
  font-size: 0.7rem;
  font-weight: 700;
}
.detail_rolls .detail_roll_item span {
  color: #292c37;
  font-size: 0.72rem;
  font-weight: 400;
}

.detail_recoil_summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.detail_recoil_value {
  color: #3B4CCA;
  font-size: 1.12rem;
  font-weight: 700;
}

.detail_recoil_percent {
  color: #666a7a;
  font-size: 0.76rem;
  font-weight: 700;
}

.detail_recoil_progress {
  margin-top: 8px;
}

.detail_recoil_note {
  margin-top: 7px;
  color: #858895;
  font-size: 0.66rem;
}

.detail_inverse_grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid #e1e3e9;
  border-radius: 12px;
  background: #e1e3e9;
  overflow: hidden;
}
.detail_inverse_grid > div {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  min-height: 62px;
  padding: 6px;
  background: rgba(255, 255, 255, 0.92);
  text-align: center;
}
.detail_inverse_grid > div > span {
  color: #777b88;
  font-size: 0.63rem;
  font-weight: 700;
}
.detail_inverse_grid strong {
  color: #262936;
  font-size: 0.82rem;
}
.detail_inverse_grid .detail_inverse_values {
  display: grid;
  gap: 3px;
  width: 100%;
}
.detail_inverse_grid .detail_inverse_values p {
  display: grid;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: baseline;
  gap: 5px;
  width: 100%;
  text-align: left;
}
.detail_inverse_grid .detail_inverse_values em {
  color: #777b88;
  font-size: 0.62rem;
  font-style: normal;
  font-weight: 400;
  text-align: right;
}
.detail_inverse_grid .detail_inverse_values strong {
  min-width: 0;
  font-size: 0.74rem;
  white-space: nowrap;
}

.detail_modifiers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  overflow: visible;
}
.detail_modifiers .detail_modifier {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 5px 11px;
  border-radius: 999px;
  border: 1px solid #59a36b;
  background: rgba(255, 255, 255, 0.55);
  color: #27783c;
  font-size: 0.76rem;
}
.detail_modifiers .detail_modifier > span {
  font-weight: 400;
}
.detail_modifiers .detail_modifier strong {
  font-size: 0.9rem;
  font-weight: 700;
}
.detail_modifiers .detail_empty {
  color: #858895;
  font-size: 0.76rem;
}
.detail_modifiers.is-sequence {
  display: flex;
  align-items: stretch;
  flex-direction: column;
  gap: 10px;
}
.detail_modifiers .detail_modifier_group {
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 9px 10px;
  border: 1px solid rgba(59, 76, 202, 0.12);
  border-radius: 12px;
  background: rgba(59, 76, 202, 0.035);
}
.detail_modifiers .detail_modifier_group.is-disabled {
  opacity: 0.42;
}
.detail_modifiers .detail_modifier_group_title {
  display: flex;
  align-items: center;
  gap: 7px;
  min-width: 0;
  color: #555968;
  font-size: 0.68rem;
  font-weight: 700;
}
.detail_modifiers .detail_modifier_group_title strong {
  display: grid;
  place-items: center;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: #fff;
  color: #3B4CCA;
  box-shadow: 0 1px 4px rgba(23, 25, 35, 0.1);
}
.detail_modifiers .detail_modifier_group_title span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.detail_modifiers .detail_modifier_group_items {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

body.detailresult-open #changeroles,
body.detailresult-open .usage_suggestion_toast,
body.detailresult-open .env_trigger_bar {
  opacity: 0;
  pointer-events: none;
}

@media (max-width: 560px) {
  section.modals.modal_detailresult .detailresult_body {
    width: calc(100% - 16px);
    margin-top: 8px;
  }
  .detail_share_card {
    padding: 14px 10px;
    border-radius: 18px;
  }
  .detail_share_card .detail_pokemon img {
    width: 62px;
    height: 62px;
  }
  .detail_share_card .detail_matchup {
    grid-template-columns: minmax(0, 1fr) minmax(96px, 1.1fr) minmax(0, 1fr);
    gap: 4px;
  }
  .detail_share_card .detail_attacker_name,
  .detail_share_card .detail_defender_name {
    font-size: 0.78rem;
  }
  .detail_inverse_grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
