/* SF_INCOME_CENTER_v41_TYPOGRAPHY_ALIGNMENT
   结构严格对齐参考页：两张纵向结算卡，不再使用额外数据总览。 */

#detailOverlay[data-page-layout="income"] {
  color: #f4f3f6 !important;
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  text-rendering: optimizeLegibility !important;
  background: #030304 !important;
}

#detailOverlay[data-page-layout="income"] .detail-topbar {
  height: 64px !important;
  min-height: 64px !important;
  padding: 10px 16px !important;
  border: 0 !important;
  background: rgba(3, 3, 4, .94) !important;
  box-shadow: none !important;
  backdrop-filter: blur(22px) saturate(140%) !important;
}

#detailOverlay[data-page-layout="income"] .detail-topbar h1 {
  color: #f7f7f8 !important;
  font-size: 22px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  text-shadow: none !important;
}

#detailOverlay[data-page-layout="income"] .detail-back {
  width: 40px !important;
  height: 40px !important;
  border: 1px solid rgba(255, 255, 255, .10) !important;
  border-radius: 50% !important;
  color: rgba(247, 247, 248, .78) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.10), 0 8px 20px rgba(0,0,0,.24) !important;
}

#detailOverlay[data-page-layout="income"] .detail-record-button {
  visibility: hidden !important;
}

#detailOverlay[data-page-layout="income"] .detail-page[data-generic-layout="income"] {
  padding: 13px 15px 92px !important;
  background: transparent !important;
}

#detailOverlay[data-page-layout="income"] .generic-hero {
  display: none !important;
}

#detailOverlay[data-page-layout="income"] #genericContent {
  display: grid !important;
  gap: 20px !important;
  width: min(100%, 430px) !important;
  margin: 0 auto !important;
}

.income-royal-card {
  position: relative !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 18px 17px 17px !important;
  border: 1px solid rgba(255, 255, 255, .055) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(circle at 96% 100%, rgba(66, 43, 70, .10), transparent 42%),
    linear-gradient(145deg, rgba(22, 20, 24, .985), rgba(15, 13, 18, .995)) !important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.065),
    inset 0 -1px rgba(0,0,0,.30),
    0 14px 34px rgba(0,0,0,.27) !important;
  backdrop-filter: blur(24px) saturate(125%) !important;
}

.income-commission-card {
  background:
    radial-gradient(circle at 6% 100%, rgba(67, 44, 73, .09), transparent 40%),
    linear-gradient(145deg, rgba(21, 19, 23, .99), rgba(14, 12, 17, .995)) !important;
}

.income-royal-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 12% auto !important;
  height: 1px !important;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .06), transparent) !important;
  pointer-events: none !important;
}

.income-royal-card-head {
  min-height: 31px !important;
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 12px !important;
}

.income-royal-card-head > strong {
  flex: 0 0 auto !important;
  color: #f5f4f6 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
}

.income-royal-card-head > span {
  min-width: 0 !important;
  padding-top: 2px !important;
  color: #13a9d3 !important;
  font-size: 13px !important;
  line-height: 1.45 !important;
  text-align: right !important;
  white-space: nowrap !important;
}

.income-royal-card-head > span b {
  font-size: 14px !important;
  font-weight: 600 !important;
}

.income-royal-claim {
  min-height: 70px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 16px !important;
  padding: 7px 0 8px !important;
}

.income-royal-claim > strong {
  display: flex !important;
  align-items: center !important;
  gap: 9px !important;
  color: #ffd024 !important;
  font: 700 32px/1.05 -apple-system, BlinkMacSystemFont, "SF Pro Display",
    "PingFang SC", sans-serif !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -.025em !important;
  text-shadow: 0 2px 8px rgba(220, 160, 20, .13) !important;
}

.income-royal-claim > strong i {
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(137, 255, 215, .36) !important;
  border-radius: 50% !important;
  color: #d9fff2 !important;
  font: 800 15px/1 system-ui, sans-serif !important;
  font-style: normal !important;
  background:
    radial-gradient(circle at 35% 25%, #6ff0c1, #14a776 56%, #08704f 100%) !important;
  box-shadow:
    inset 0 1px 2px rgba(255,255,255,.42),
    0 5px 13px rgba(9, 141, 100, .24) !important;
}

.income-royal-claim > strong b {
  font: inherit !important;
  color: inherit !important;
}

.income-royal-claim > button {
  min-width: 92px !important;
  height: 36px !important;
  padding: 0 20px !important;
  border: 1px solid rgba(241, 196, 67, .65) !important;
  border-radius: 19px !important;
  color: #f9edc6 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  background:
    radial-gradient(circle at 50% 120%, rgba(230, 170, 34, .90), transparent 49%),
    linear-gradient(180deg, rgba(49, 59, 82, .96), rgba(10, 17, 31, .98)) !important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.14),
    0 0 13px rgba(229, 171, 37, .18) !important;
}

.income-royal-claim > button:disabled {
  border-color: rgba(255,255,255,.07) !important;
  color: rgba(239, 236, 228, .46) !important;
  background: rgba(69, 72, 84, .64) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.055) !important;
}

.income-royal-rows {
  display: grid !important;
  gap: 0 !important;
}

.income-royal-rows > button {
  min-height: 52px !important;
  display: grid !important;
  grid-template-columns: 1fr auto 31px !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 0 !important;
  border: 0 !important;
  color: rgba(242, 241, 244, .86) !important;
  text-align: left !important;
  background: transparent !important;
  box-shadow: none !important;
}

.income-royal-rows > button > span {
  color: rgba(242, 241, 244, .86) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
}

.income-royal-rows > button > strong {
  color: #ead58a !important;
  font: 500 17px/1 -apple-system, BlinkMacSystemFont, "SF Pro Text",
    "PingFang SC", sans-serif !important;
  font-variant-numeric: tabular-nums !important;
}

.income-royal-rows > button > i {
  width: 29px !important;
  height: 29px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-radius: 8px !important;
  color: rgba(255,255,255,.84) !important;
  font: 600 24px/1 system-ui, sans-serif !important;
  font-style: normal !important;
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.08) !important;
}

.income-royal-settlement-head {
  min-height: 42px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding-top: 3px !important;
}

.income-royal-settlement-head > strong {
  color: #f5f4f6 !important;
  font-size: 20px !important;
  font-weight: 700 !important;
}

.income-royal-settlement-head > button {
  padding: 0 !important;
  border: 0 !important;
  color: #13a9d3 !important;
  font-size: 13px !important;
  background: transparent !important;
  box-shadow: none !important;
}

.income-royal-settlement-head > button b {
  margin-left: 2px !important;
  font-size: 15px !important;
}

.income-royal-stat-grid {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

.income-royal-stat-grid > span {
  min-width: 0 !important;
  min-height: 72px !important;
  display: grid !important;
  align-content: center !important;
  gap: 8px !important;
  padding: 10px 11px !important;
  border: 1px solid rgba(255,255,255,.028) !important;
  border-radius: 9px !important;
  background: linear-gradient(145deg, rgba(55, 49, 60, .50), rgba(38, 33, 43, .56)) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.045) !important;
}

.income-royal-stat-grid small {
  overflow: hidden !important;
  color: rgba(237, 235, 240, .76) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  line-height: 1.2 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

.income-royal-stat-grid strong {
  overflow: hidden !important;
  color: #edd993 !important;
  font: 500 17px/1.15 -apple-system, BlinkMacSystemFont, "SF Pro Text",
    "PingFang SC", sans-serif !important;
  font-variant-numeric: tabular-nums !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

@media (max-width: 360px) {
  #detailOverlay[data-page-layout="income"] .detail-page[data-generic-layout="income"] {
    padding-inline: 11px !important;
  }

  .income-royal-card {
    padding-inline: 13px !important;
  }

  .income-royal-card-head > span {
    font-size: 11px !important;
  }

  .income-royal-stat-grid > span {
    padding-inline: 8px !important;
  }

  .income-royal-stat-grid small {
    font-size: 11px !important;
  }
}
