/* Market support presentation only. No team totals or payment state are inferred. */
.market-support {
  min-width: 0;
  margin-top: 18px;
  color: #18365f;
}

.market-support .market-support-heading {
  gap: 8px;
  margin: 0;
}

.market-support .market-support-heading h2 {
  min-width: 0;
  font-size: 21px;
  font-weight: 650;
  line-height: 1.4;
  letter-spacing: -0.45px;
}

.market-support .market-support-heading .text-link {
  flex-shrink: 0;
  min-height: 44px;
  color: #6684b8;
  font-size: 12px;
}

.market-support .support-intro {
  margin: -1px 0 12px;
  color: #8190a8;
  font-size: 12px;
  line-height: 1.75;
}

.market-support .support-daily {
  display: grid;
  grid-template-columns: 91px minmax(0, 1fr);
  gap: 10px 14px;
  min-width: 0;
  min-height: 155px;
  padding: 15px 16px 12px;
  border: 1px solid #dce7fc;
  border-radius: 16px;
  background: linear-gradient(115deg, #ffffff 22%, #f4f8ff 100%);
  box-shadow: 0 4px 14px #315ca405;
}

.market-support .support-card-top {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.market-support .support-icon {
  display: grid;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid #e2eaff;
  border-radius: 11px;
  background: #edf3ff;
  color: #527def;
}

.market-support .support-icon svg {
  display: block;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.market-support .support-card-top > div {
  flex: 1;
  min-width: 0;
}

.market-support .support-card-top h3 {
  margin: 0;
  color: #254670;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.45;
}

.market-support .support-card-top p {
  margin: 2px 0 0;
  color: #8795ac;
  font-size: 11px;
  line-height: 1.55;
}

.market-support .support-badge {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  min-height: 24px;
  padding: 3px 8px;
  border: 1px solid #dfe9ff;
  border-radius: 7px;
  background: #f0f5ff;
  color: #6385ca;
  font-size: 10px;
  line-height: 1.6;
  white-space: nowrap;
}

.market-support .support-rate {
  display: flex;
  align-items: baseline;
  align-self: center;
  gap: 6px;
  min-width: 0;
  color: #2d57ed;
  white-space: nowrap;
}

.market-support .support-rate strong {
  font-family: 'Segoe UI', sans-serif;
  font-size: 30px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  line-height: 1.15;
  letter-spacing: -0.6px;
}

.market-support .support-rate strong small {
  margin-right: 3px;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0;
}

.market-support .support-rate > span {
  color: #8b99af;
  font-size: 11px;
  line-height: 1.6;
}

.market-support .support-condition {
  align-self: center;
  min-width: 0;
  margin: 0;
  text-align: right;
  color: #7186a5;
  font-size: 11px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}

.market-support .support-card-bottom {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
  padding-top: 9px;
  border-top: 1px solid #e5edfc;
}

.market-support .support-stat {
  min-width: 0;
  color: #8a98ad;
  font-size: 11px;
  line-height: 1.6;
}

.market-support .support-stat b {
  margin-inline: 4px;
  color: #5b7296;
  font-family: 'Segoe UI', sans-serif;
  font-size: 14px;
  font-weight: 600;
}

.market-support .support-status {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: 5px;
  color: #94a3bb;
  font-size: 10px;
  font-weight: 400;
  line-height: 1.6;
  white-space: nowrap;
}

.market-support .support-status::before {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #c8d5ea;
  content: '';
}

.market-support .support-period-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 10px;
}

.market-support .support-period {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 175px;
  padding: 14px 15px 13px;
  border: 1px solid #e1e9f9;
  border-radius: 15px;
  background: #ffffff;
  box-shadow: 0 4px 13px #34599703;
}

.market-support .support-period-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  min-width: 0;
}

.market-support .support-period-top h3 {
  margin: 0;
  color: #34547f;
  font-size: 14px;
  font-weight: 650;
  line-height: 1.5;
}

.market-support .support-period-label {
  flex-shrink: 0;
  padding: 2px 5px;
  border-radius: 5px;
  background: #f5f8fe;
  color: #8b9dbb;
  font-size: 9px;
  line-height: 1.6;
  white-space: nowrap;
}

.market-support .support-amount {
  display: flex;
  align-items: baseline;
  gap: 4px;
  min-width: 0;
  margin-top: 11px;
  color: #2f59e9;
  font-family: 'Segoe UI', sans-serif;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.market-support .support-amount small {
  font-size: 13px;
  font-weight: 500;
  line-height: 1.2;
}

.market-support .support-amount strong {
  font-size: 30px;
  font-weight: 650;
  line-height: 1.15;
  letter-spacing: -0.9px;
}

.market-support .support-threshold {
  margin: 7px 0 12px;
  color: #8796ae;
  font-size: 11px;
  line-height: 1.7;
}

.market-support .support-threshold b {
  color: #5c769e;
  font-weight: 600;
  white-space: nowrap;
}

.market-support .support-progress {
  height: 4px;
  min-height: 4px;
  margin-top: auto;
  overflow: hidden;
  border-radius: 4px;
  background: #edf2fa;
}

/* An unmeasured track, rather than a filled or zero-percent progress value. */
.market-support .support-progress > span {
  display: block;
  height: 100%;
  background: repeating-linear-gradient(135deg, #e7eef9 0, #e7eef9 4px, #eff4fc 4px, #eff4fc 8px);
}

.market-support .support-progress-caption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  min-width: 0;
  margin-top: 7px;
  color: #95a3b9;
  font-size: 10px;
  font-variant-numeric: tabular-nums;
  line-height: 1.7;
}

.market-support .support-progress-caption > span:first-child {
  min-width: 0;
  white-space: nowrap;
}

.market-support .support-footnote {
  margin: 10px 1px 0;
  color: #99a6ba;
  font-size: 10px;
  line-height: 1.8;
}

.market-support .support-claim-summary {
  display: grid;
  flex: 1;
  gap: 4px;
  min-width: 0;
}

.market-support .support-stat-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 3px 8px;
  min-width: 0;
}

.market-support .support-available {
  min-width: 0;
  margin: 0;
  color: #7c8eaa;
  font-size: 11px;
  line-height: 1.6;
  overflow-wrap: anywhere;
}

.market-support .support-available b {
  margin-inline: 3px;
  color: #2d57ed;
  font-family: 'Segoe UI', sans-serif;
  font-size: 18px;
  font-weight: 650;
  font-variant-numeric: tabular-nums;
  line-height: 1.3;
}

.market-support .support-claim-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  min-height: 44px;
  padding: 8px 18px;
  border: 1px solid #dce6ff;
  border-radius: 9px;
  background: #edf3ff;
  color: #3565d9;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.5;
  white-space: nowrap;
}

.market-support .support-period .support-claim-button {
  width: 100%;
  margin-top: 10px;
}

.market-support .support-claim-button:active {
  background: #e2ebff;
}

.market-support .support-claim-button:focus-visible {
  outline: 2px solid #91adf4;
  outline-offset: 3px;
}

.market-support .support-payout-note {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 12px;
  border: 1px solid #e0e9fc;
  border-radius: 10px;
  background: #f2f6ff;
  color: #7a8faf;
}

.market-support .support-payout-note > svg {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  margin-top: 2px;
  fill: none;
  stroke: #7896d5;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.market-support .support-payout-note p {
  min-width: 0;
  margin: 0;
  color: #7a8faf;
  font-size: 12px;
  line-height: 1.7;
}

.market-support .support-payout-note strong {
  color: #4c6fa9;
  font-weight: 600;
}

/* Relocated original wallet cards retain their existing appearance and handlers. */
.my-page .my-wallet-section {
  min-width: 0;
  margin-top: 16px;
  margin-bottom: 16px;
}

.my-page .my-wallet-section .section-heading {
  margin: 0 0 10px;
}

.my-page .my-wallet-section .wallet-grid {
  min-width: 0;
}

/* Wallet details share one consistent card treatment. */
.my-page .my-wallet-section .wallet-grid .wallet-card {
  padding: 10px 10px 8px;
}

.my-page .my-wallet-section .wallet-grid .wallet-label {
  min-height: 50px;
  gap: 4px;
}

.my-page .my-wallet-section .wallet-grid .wallet-symbol {
  width: 26px;
  height: 26px;
}

.my-page .my-wallet-section .wallet-grid .wallet-symbol svg {
  width: 16px;
  height: 16px;
}

.my-page .my-wallet-section .wallet-grid .balance {
  margin-top: 4px;
}

.my-page .my-wallet-section .wallet-grid .wallet-action {
  margin-top: 5px;
}

.market-support-rules .support-rule-item {
  padding: 14px 0;
}

.market-support-rules .support-rule-item + .support-rule-item {
  border-top: 1px solid #e7edf8;
}

.market-support-rules .support-rule-label {
  display: block;
  color: #2f507f;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.6;
}

.market-support-rules .support-rule-copy {
  margin: 6px 0 0;
  color: #7d8da7;
  font-size: 13px;
  line-height: 1.9;
}

.market-support-rules .support-rule-copy b {
  color: #486ba8;
  font-weight: 600;
}

.market-support-rules .support-dialog-note {
  margin: 14px 0 0;
  padding: 11px 13px;
  border: 1px solid #e5ecfb;
  border-radius: 10px;
  background: #f5f8ff;
  color: #8395b4;
  font-size: 11px;
  line-height: 1.85;
}

@media (max-width: 360px) {
  .market-support .market-support-heading h2 {
    font-size: 20px;
  }

  .market-support .support-intro {
    font-size: 11px;
  }

  .market-support .support-daily {
    grid-template-columns: 83px minmax(0, 1fr);
    column-gap: 10px;
    padding-inline: 13px;
  }

  .market-support .support-card-top {
    gap: 8px;
  }

  .market-support .support-badge {
    padding-inline: 6px;
    font-size: 9px;
  }

  .market-support .support-period-grid {
    gap: 8px;
  }

  .market-support .support-period {
    padding-inline: 12px;
  }

  .market-support .support-amount strong {
    font-size: 28px;
  }

  .market-support .support-progress-caption {
    font-size: 9px;
  }

  .market-support .support-progress-caption .support-status {
    gap: 3px;
    font-size: 9px;
  }

  .my-page .my-wallet-section .wallet-grid .wallet-label {
    font-size: 13px;
  }

  .my-page .my-wallet-section .wallet-grid .wallet-action {
    min-height: 44px;
    font-size: 12px;
  }

  .my-page .my-wallet-section .wallet-grid .balance strong {
    font-size: 20px;
    letter-spacing: -0.8px;
  }
}

/* Button states only: retain all existing sizes, spacing and card layout. */
.market-support .support-claim-button:disabled {
  cursor: not-allowed;
  border-color: #e2e8f3;
  background: #f2f5fa;
  color: #9ba9bd;
  opacity: 1;
}

.market-support .support-claim-button[data-state='claimed'] {
  border-color: #e0e9f6;
  background: #eff4fa;
  color: #8095b3;
}

.market-support .support-progress[data-known='true'] > span {
  background: #7091f6;
}

/* State copy may be longer; retain card layout and 44px button height. */
.market-support .support-period .support-claim-button[data-state='ineligible'] {
  padding-inline: 6px;
  font-size: 12px;
}

.market-support .support-claim-button[data-state='claimable']:not(:disabled) {
  border-color: #2d5cf5;
  background: #2d5cf5;
  color: #fff;
  box-shadow: 0 3px 8px #2d5cf51a;
}

/* Keep the complete balance visible when its digits exceed a wallet card. */
.my-page .my-wallet-section .wallet-grid .balance strong {
  white-space: normal;
  overflow-wrap: anywhere;
}

/* Give the rule note and confirmation action separate breathing room. */
#marketSupportRules .support-dialog-note {
  margin-bottom: 20px;
}
#marketSupportRules .support-dialog-note + .primary-button {
  margin-top: 0;
}
