/* MoneyBuddy locked Buddy system — compact trackers + consistent locked cards */

/* Two small challenge trackers instead of large banners. */
#buddyUnlockTrackers.buddy-unlock-trackers {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin: 0 0 11px;
}
#atlasStreakBanner.buddy-unlock-tracker,
#emberShareBanner.buddy-unlock-tracker {
  position: relative !important;
  isolation: isolate;
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  min-width: 0;
  min-height: 62px !important;
  margin: 0 !important;
  padding: 9px 10px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: none !important;
}
#atlasStreakBanner.buddy-unlock-tracker {
  background: linear-gradient(135deg, #fffdf7 0%, #f9efd2 100%) !important;
  border: 1px solid rgba(201,162,74,.30) !important;
}
#emberShareBanner.buddy-unlock-tracker {
  background: linear-gradient(135deg, #f8fbf9 0%, #edf5f1 100%) !important;
  border: 1px solid rgba(24,60,53,.15) !important;
}
#atlasStreakBanner::after,
#emberShareBanner::after { display: none !important; content: none !important; }

.buddy-unlock-tracker-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,.76);
  border: 1px solid rgba(30,42,58,.08);
  color: #183C35;
}
.atlas-unlock-tracker .buddy-unlock-tracker-icon { color: #8b6618; }
.buddy-unlock-tracker-icon .material-symbols-outlined { font-size: 18px !important; }
.buddy-unlock-tracker-body { flex: 1 1 auto; min-width: 0; }
.buddy-unlock-tracker-line {
  display: flex;
  align-items: baseline;
  gap: 7px;
  min-width: 0;
}
.buddy-unlock-tracker-kicker {
  flex: 0 0 auto;
  color: #66716e;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .09em;
  text-transform: uppercase;
  white-space: nowrap;
}
.buddy-unlock-tracker-line strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #1E2A3A;
  font-size: 11px;
  line-height: 1.15;
}
.buddy-unlock-tracker-subline {
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #65716f;
  font-size: 9px;
  line-height: 1.2;
}
.buddy-unlock-progress {
  height: 4px;
  margin-top: 5px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(30,42,58,.09);
}
.buddy-unlock-progress span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #183C35, #C9A24A);
}
.buddy-unlock-tracker-status {
  flex: 0 0 auto;
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(30,42,58,.08);
  color: #5f665f;
  font-size: 8px;
  font-weight: 800;
  white-space: nowrap;
}
.buddy-unlock-tracker-action {
  appearance: none;
  flex: 0 0 auto;
  min-height: 30px !important;
  min-width: 58px !important;
  padding: 0 10px !important;
  border-radius: 999px !important;
  border: 1px solid #183C35 !important;
  background: #183C35 !important;
  color: #fff !important;
  font-size: 9px !important;
  font-weight: 750 !important;
  line-height: 1 !important;
  box-shadow: none !important;
}
.buddy-unlock-tracker-action:hover { background: #214b42 !important; }

/* One shared locked-card architecture for every reward Buddy. */
.buddy-card.locked-buddy-card::after { display: none !important; content: none !important; }
.buddy-card.locked-buddy-card {
  height: 226px !important;
  min-height: 226px !important;
  max-height: 226px !important;
  padding: 13px 14px !important;
  gap: 4px !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
  border-radius: 20px !important;
  background: linear-gradient(155deg, #fffdf8 0%, #f7f1e2 100%) !important;
  border: 1px solid rgba(201,162,74,.34) !important;
  box-shadow: none !important;
}
.buddy-card.locked-buddy-card:hover {
  transform: translateY(-1px);
  border-color: rgba(201,162,74,.48) !important;
  box-shadow: 0 12px 24px -24px rgba(30,42,58,.35) !important;
}
.locked-buddy-topline {
  width: 100%;
  min-height: 22px;
  height: 22px;
  flex: 0 0 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 3;
}
.locked-buddy-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 21px;
  padding: 3px 8px;
  border-radius: 999px;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(201,162,74,.33);
  color: #5e542f;
  font-size: 8px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .08em;
  white-space: nowrap;
}
.locked-buddy-badge .material-symbols-outlined { font-size: 12px !important; }
.locked-buddy-art-stage {
  position: relative;
  width: 92px;
  height: 92px;
  flex: 0 0 92px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 18px;
  background: linear-gradient(145deg, rgba(255,255,255,.72), rgba(30,42,58,.05));
  border: 1px solid rgba(30,42,58,.08);
}
.locked-buddy-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
}
.locked-buddy-lock-row {
  min-height: 24px;
  height: 24px;
  flex: 0 0 24px;
  margin: 1px auto 0;
  padding: 3px 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  border-radius: 999px;
  background: #1E2A3A;
  color: #fff;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .08em;
  line-height: 1;
}
.locked-buddy-lock-row .material-symbols-outlined { font-size: 12px !important; }
.locked-buddy-copy {
  width: 100%;
  min-height: 38px;
  margin-top: 1px;
  text-align: center;
  overflow: hidden;
}
.locked-buddy-copy .font-title-md {
  font-size: 17px !important;
  line-height: 1.15 !important;
}
.locked-buddy-copy .font-label-sm {
  margin-top: 2px;
  color: #7a6741 !important;
  font-size: 10px !important;
  line-height: 1.2 !important;
  text-transform: uppercase;
  letter-spacing: .06em;
}

/* Atlas remains a teaser, but users can still get a sense of him. */
.buddy-card[data-buddy="atlas"].locked-buddy-card .locked-buddy-image {
  filter: blur(3px) grayscale(.40) saturate(.62) brightness(.74) contrast(.96) !important;
  opacity: .90 !important;
  transform: scale(1.06) !important;
}
.buddy-card[data-buddy="atlas"].locked-buddy-card .locked-buddy-art-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(30,42,58,.03), rgba(30,42,58,.13));
}

/* Referral Buddy stays genuinely secret until the reward is earned. */
.buddy-card.secret-identity-card .locked-buddy-image {
  filter: blur(9px) grayscale(.82) saturate(.28) brightness(.54) contrast(.92) !important;
  opacity: .70 !important;
  transform: scale(1.15) !important;
}
.buddy-card.secret-identity-card .locked-buddy-art-stage::after {
  content: "?";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, rgba(24,60,53,.12), rgba(30,42,58,.35));
  color: rgba(255,255,255,.88);
  font-size: 28px;
  font-weight: 800;
  text-shadow: 0 2px 10px rgba(0,0,0,.25);
}

/* Locked referral modal should not identify the Buddy early. */
#emberUnlockModal .mystery-reward-image img {
  filter: blur(12px) grayscale(.90) saturate(.18) brightness(.48) contrast(.9) !important;
  opacity: .68 !important;
  transform: scale(1.13) !important;
}
#emberUnlockModal .mystery-reward-image::after {
  content: "?";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: rgba(255,255,255,.92);
  font-size: 42px;
  font-weight: 800;
  background: linear-gradient(180deg, rgba(24,60,53,.08), rgba(30,42,58,.28));
  text-shadow: 0 3px 16px rgba(0,0,0,.32);
}
#emberUnlockModal .mystery-reward-image { position: relative; }

@media (max-width: 900px) and (min-width: 641px) {
  .buddy-card.locked-buddy-card {
    height: 218px !important;
    min-height: 218px !important;
    max-height: 218px !important;
  }
}

@media (max-width: 640px) {
  #buddyUnlockTrackers.buddy-unlock-trackers {
    grid-template-columns: 1fr;
    gap: 6px;
    margin-bottom: 8px;
  }
  #atlasStreakBanner.buddy-unlock-tracker,
  #emberShareBanner.buddy-unlock-tracker {
    min-height: 52px !important;
    padding: 7px 8px !important;
    gap: 7px !important;
    border-radius: 12px !important;
  }
  .buddy-unlock-tracker-icon {
    width: 30px;
    height: 30px;
    flex-basis: 30px;
    border-radius: 9px;
  }
  .buddy-unlock-tracker-icon .material-symbols-outlined { font-size: 16px !important; }
  .buddy-unlock-tracker-line { gap: 5px; }
  .buddy-unlock-tracker-kicker { font-size: 7px; }
  .buddy-unlock-tracker-line strong { font-size: 10px; }
  .buddy-unlock-tracker-subline { font-size: 8px; }
  .buddy-unlock-tracker-status { font-size: 7px; padding: 2px 5px; }
  .buddy-unlock-tracker-action {
    min-width: 54px !important;
    min-height: 28px !important;
    padding: 0 9px !important;
    font-size: 8px !important;
  }

  .buddy-card.locked-buddy-card {
    height: 188px !important;
    min-height: 188px !important;
    max-height: 188px !important;
    padding: 9px 10px !important;
    gap: 3px !important;
    border-radius: 17px !important;
  }
  .locked-buddy-topline { min-height: 19px; height: 19px; flex-basis: 19px; }
  .locked-buddy-badge { min-height: 18px; padding: 2px 5px; font-size: 6.6px; }
  .locked-buddy-badge .material-symbols-outlined { font-size: 10px !important; }
  .locked-buddy-art-stage { width: 72px; height: 72px; flex-basis: 72px; border-radius: 15px; }
  .locked-buddy-lock-row { height: 21px; min-height: 21px; flex-basis: 21px; padding: 2px 8px; font-size: 7px; }
  .locked-buddy-lock-row .material-symbols-outlined { font-size: 10px !important; }
  .locked-buddy-copy { min-height: 32px; }
  .locked-buddy-copy .font-title-md { font-size: 15px !important; }
  .locked-buddy-copy .font-label-sm { font-size: 8px !important; }
}

/* ============================================================
   Final polish — both locked Buddies are only softly obscured
   ============================================================ */
.buddy-card[data-buddy="atlas"].locked-buddy-card .locked-buddy-image {
  filter: blur(3.2px) grayscale(.28) saturate(.74) brightness(.82) contrast(.98) !important;
  opacity: .93 !important;
  transform: scale(1.045) !important;
}
.buddy-card[data-buddy="atlas"].locked-buddy-card .locked-buddy-art-stage::after {
  background: linear-gradient(180deg, rgba(30,42,58,.04), rgba(30,42,58,.11)) !important;
}

.buddy-card.secret-identity-card .locked-buddy-image {
  filter: blur(4.2px) grayscale(.34) saturate(.66) brightness(.78) contrast(.96) !important;
  opacity: .90 !important;
  transform: scale(1.055) !important;
}
.buddy-card.secret-identity-card .locked-buddy-art-stage::after {
  content: "" !important;
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(24,60,53,.06), rgba(30,42,58,.13)) !important;
}

/* Keep the locked reward modal mysterious but not overly hidden. */
#emberUnlockModal .mystery-reward-image img,
#emberUnlockModal .ember-modal-locked img {
  filter: blur(4.6px) grayscale(.36) saturate(.68) brightness(.80) contrast(.97) !important;
  opacity: .91 !important;
  transform: scale(1.04) !important;
}