/*!*********************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[14].oneOf[5].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[14].oneOf[5].use[3]!./app/overallprogress/styles.module.css ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************/
/* Layout */
.styles_container__2e__D {
  padding: 24px 28px;
  max-width: 960px;
  margin: 0 auto;
}

.styles_title__d3qwW {
  font-size: 26px;
  font-weight: 700;
  margin-bottom: 14px;
}

.styles_loading__K9ufN {
  padding: 40px;
  text-align: center;
  color: #666;
}

/* Controls */
.styles_controls__X8T7n {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.styles_tabs__vwhWc {
  display: flex;
  gap: 6px;
}

.styles_tab__zzD5N {
  padding: 6px 14px;
  border-radius: 8px;
  border: 1px solid #d1d5db;
  background: #f9fafb;
  font-weight: 600;
  cursor: pointer;
}

.styles_activeTab__KevAK {
  background: #2563eb;
  color: white;
  border-color: #2563eb;
}

/* Toggle */
.styles_toggle__1dLRi {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.styles_toggle__1dLRi input {
  display: none;
}

.styles_slider__Mw5kO {
  width: 36px;
  height: 20px;
  background: #d1d5db;
  border-radius: 999px;
  position: relative;
  transition: background 0.2s;
}

.styles_slider__Mw5kO::before {
  content: "";
  position: absolute;
  width: 16px;
  height: 16px;
  left: 2px;
  top: 2px;
  background: white;
  border-radius: 50%;
  transition: transform 0.2s;
}

.styles_toggle__1dLRi input:checked + .styles_slider__Mw5kO {
  background: #2563eb;
}

.styles_toggle__1dLRi input:checked + .styles_slider__Mw5kO::before {
  transform: translateX(16px);
}

.styles_toggleLabel__IQxWI {
  font-size: 14px;
  color: #374151;
}

/* Catalog tabs */
.styles_catalogTabs__An_9_ {
  display: flex;
  gap: 6px;
  margin-bottom: 16px;
}

.styles_catalogTab__608li {
  padding: 5px 12px;
  border-radius: 999px;
  border: 1px solid #d1d5db;
  background: white;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}

.styles_activeCatalogTab__TPqBy {
  background: #111827;
  color: white;
  border-color: #111827;
}

/* List */
.styles_list__GlTdX {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.styles_card__HQr3p {
  background: white;
  border-radius: 12px;
  padding: 16px 18px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

/* Header */
.styles_header__KNAd9 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}

.styles_abilityInfo__OudhX {
  display: flex;
  align-items: center;
  gap: 8px;
}

.styles_icon__UvLSi {
  width: 22px;
  height: 22px;
  object-fit: contain;
}

.styles_ability__Y6fEA {
  font-weight: 700;
  font-size: 15px;
}

.styles_count__KYoXH {
  font-size: 13px;
  color: #666;
}

/* Progress */
.styles_row__uywoK {
  display: flex;
  align-items: center;
  gap: 10px;
}

.styles_bar__hIFEd {
  flex: 1 1;
  height: 10px;
  background: #e5e7eb;
  border-radius: 6px;
  overflow: hidden;
}

.styles_fill__V_eB1 {
  height: 100%;
}

.styles_percent__SnyBi {
  width: 44px;
  font-size: 12px;
  text-align: right;
  color: #555;
}

/* Colors */
.styles_red__SDmfp {
  background: #ef4444;
}

.styles_yellow__JbveH {
  background: #f59e0b;
}

.styles_blue__JfBns {
  background: #3b82f6;
}

.styles_green__P8t3m {
  background: #22c55e;
}

/* Missing */
.styles_missingRow__F03Wc {
  margin-top: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.styles_missingLabel___h_Dm {
  font-size: 12px;
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
}

.styles_pillsRow__6_AoJ {
  display: flex;
  gap: 6px;
  overflow-x: auto;
}

.styles_pill__tWVn6 {
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* Role colors */
.styles_tank__lincX {
  background-color: #fff3cd;
  color: #8b4513;
}

.styles_dps__uVf2V {
  background-color: #d4edda;
  color: #155724;
}

.styles_healer__K0soL {
  background-color: #f8d7da;
  color: #721c24;
}
/* ===============================
   Mobile / Phone responsive
   =============================== */
@media (max-width: 640px) {
  /* Layout */
  .styles_container__2e__D {
    padding: 16px 14px;
    max-width: 100%;
  }

  .styles_title__d3qwW {
    font-size: 22px;
    margin-bottom: 12px;
  }

  /* Controls stack */
  .styles_controls__X8T7n {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }

  .styles_tabs__vwhWc {
    gap: 8px;
  }

  .styles_tab__zzD5N {
    padding: 8px 16px;
    font-size: 14px;
  }

  /* Toggles stack nicely */
  .styles_toggle__1dLRi {
    gap: 6px;
  }

  .styles_toggleLabel__IQxWI {
    font-size: 13px;
  }

  /* Catalog tabs */
  .styles_catalogTabs__An_9_ {
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px;
  }

  .styles_catalogTab__608li {
    font-size: 12px;
    padding: 6px 14px;
  }

  /* Cards */
  .styles_card__HQr3p {
    padding: 14px 14px;
  }

  .styles_ability__Y6fEA {
    font-size: 14px;
  }

  .styles_icon__UvLSi {
    width: 20px;
    height: 20px;
  }

  /* Progress */
  .styles_row__uywoK {
    gap: 8px;
  }

  .styles_bar__hIFEd {
    height: 8px;
  }

  .styles_percent__SnyBi {
    width: 38px;
    font-size: 11px;
  }

  /* Missing pills */
  .styles_missingRow__F03Wc {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }

  .styles_pillsRow__6_AoJ {
    flex-wrap: wrap;
    overflow-x: visible;
  }

  .styles_pill__tWVn6 {
    font-size: 11px;
    padding: 2px 6px;
  }
}