/* V1.28Beta-opportunity-title-polish1
   Softer fate-themed typography for the round Opportunity dialog only. */

html body:not(.maintenance-mode)
  #opportunityDialog#opportunityDialog.opportunity-dialog:not(.artifact-dialog)
  .opportunity-head.opportunity-head span {
  color: rgba(216, 243, 255, 0.9) !important;
  -webkit-text-fill-color: rgba(216, 243, 255, 0.9) !important;
  font-weight: 850 !important;
  letter-spacing: 0.12em !important;
  text-shadow:
    0 1px 3px rgba(8, 24, 36, 0.46),
    0 0 12px rgba(126, 222, 255, 0.2),
    0 0 22px rgba(255, 246, 206, 0.1) !important;
}

html body:not(.maintenance-mode)
  #opportunityDialog#opportunityDialog.opportunity-dialog:not(.artifact-dialog)
  #opportunityTitle#opportunityTitle {
  margin-top: 2px !important;
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  font-weight: 900 !important;
  letter-spacing: 0.025em !important;
  background:
    linear-gradient(180deg,
      #ffffff 0%,
      #effbff 28%,
      #cfeeff 55%,
      #f5e8c4 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-stroke: 0.35px rgba(255, 251, 229, 0.46) !important;
  text-shadow:
    0 1px 0 rgba(255, 255, 255, 0.2),
    0 8px 22px rgba(14, 34, 52, 0.32),
    0 0 18px rgba(136, 218, 255, 0.2),
    0 0 30px rgba(245, 224, 170, 0.1) !important;
}

html body:not(.maintenance-mode)
  #opportunityDialog#opportunityDialog.opportunity-dialog:not(.artifact-dialog)
  #opportunityDescription#opportunityDescription {
  color: rgba(242, 249, 255, 0.88) !important;
  -webkit-text-fill-color: rgba(242, 249, 255, 0.88) !important;
  font-weight: 650 !important;
  text-shadow:
    0 1px 2px rgba(7, 18, 31, 0.56),
    0 0 12px rgba(146, 224, 255, 0.12) !important;
}

@media (max-width: 720px) {
  html body:not(.maintenance-mode)
    #opportunityDialog#opportunityDialog.opportunity-dialog:not(.artifact-dialog)
    #opportunityTitle#opportunityTitle {
    font-size: clamp(20px, 5.4vw, 26px) !important;
    letter-spacing: 0.01em !important;
    -webkit-text-stroke-width: 0.25px !important;
    text-shadow:
      0 1px 0 rgba(255, 255, 255, 0.18),
      0 4px 14px rgba(14, 34, 52, 0.28),
      0 0 12px rgba(136, 218, 255, 0.18) !important;
  }
}
