/* Final size layer: loaded after every legacy and redesign stylesheet. */
#market-dialog[open] {
  width: min(980px, calc(100vw - 24px)) !important;
  max-width: 980px !important;
}

#market-dialog[open] .dialog-card {
  min-height: 0 !important;
  padding: 26px 32px 30px !important;
}

#market-dialog[open] .dialog-title {
  min-height: 70px !important;
}

#market-dialog[open] .dialog-title h2,
#market-dialog[open] .dialog-title h2 span {
  font-size: 30px !important;
}

#market-dialog[open] .dialog-title h2::after {
  margin-top: 11px !important;
  font-size: 16px !important;
}

#market-dialog[open] .close {
  width: 38px !important;
  height: 38px !important;
  font-size: 34px !important;
}

#market-dialog[open] .form-grid {
  column-gap: 32px !important;
  row-gap: 18px !important;
  margin: 14px 0 17px !important;
}

#market-dialog[open] .form-grid label,
#market-dialog[open] .form-grid > label:nth-child(2)::before,
#market-dialog[open] .form-grid > label:nth-child(4)::before {
  font-size: 12px !important;
}

#market-dialog[open] .form-grid > label:nth-child(2),
#market-dialog[open] .form-grid > label:nth-child(4) {
  font-size: 0 !important;
}

#market-dialog[open] .form-grid input,
#market-dialog[open] .form-grid select,
#market-dialog[open] #create-target,
#market-dialog[open] #create-bet,
#market-dialog[open] .side {
  height: 53px !important;
  margin-top: 9px !important;
  font-size: 21px !important;
}

#market-dialog[open] .form-grid > label:first-child select {
  padding-left: 60px !important;
  font-size: 21px !important;
}

#market-dialog[open] .form-grid > label:first-child::after {
  left: 18px !important;
  top: 31px !important;
  width: 32px !important;
  height: 32px !important;
  font: 700 18px/32px Georgia, serif !important;
}

#market-dialog[open] .min-bet,
#market-dialog[open] .form-grid label:has(#create-bet) small,
#market-dialog[open] .form-grid small {
  font-size: 11px !important;
}

#market-dialog[open] .form-grid label:has(#create-bet) small,
#market-dialog[open] .form-grid small {
  bottom: 20px !important;
}

#market-dialog[open] .form-grid label:has(#create-bet) #create-bet {
  border: 1px solid rgba(127, 165, 174, 0.36) !important;
  border-right-color: rgba(127, 165, 174, 0.36) !important;
  outline: 0 !important;
  box-shadow: none !important;
}

#market-dialog[open] .side-select {
  margin-top: 9px !important;
}

#market-dialog[open] .match-window {
  gap: 12px !important;
}

#market-dialog[open] .match-window .expiry-heading {
  min-height: 48px !important;
  padding: 0 18px 0 54px !important;
}

#market-dialog[open] .match-window .expiry-heading::before {
  left: 18px !important;
  width: 22px !important;
  height: 22px !important;
  font-size: 13px !important;
}

#market-dialog[open] .match-window .expiry-heading span {
  font-size: 12px !important;
}

#market-dialog[open] .expiry-inputs {
  gap: 11px !important;
}

#market-dialog[open] .expiry-inputs > div,
#market-dialog[open] .no-expiry-field {
  height: 68px !important;
  min-height: 68px !important;
}

#market-dialog[open] .expiry-inputs input {
  height: 45px !important;
  font-size: 23px !important;
  transform: translateY(-4px) !important;
}

#market-dialog[open] .expiry-inputs > div > span {
  bottom: 8px !important;
  font-size: 10px !important;
}

#market-dialog[open] .no-expiry-field span,
#market-dialog[open] .no-expiry-field:has(input:checked) span {
  font-size: 14px !important;
}

#market-dialog[open] .no-expiry-field span::before {
  content: none !important;
  display: none !important;
}

#market-dialog[open] .side:nth-child(2).active {
  color: #ff4b5d !important;
  border-color: rgba(255, 75, 93, 0.88) !important;
  background: rgba(255, 75, 93, 0.12) !important;
  box-shadow: inset 0 0 28px rgba(255, 75, 93, 0.06) !important;
}

#market-dialog[open] .payment {
  gap: 8px 24px !important;
  margin: 15px 0 14px !important;
  padding: 12px 5px 11px !important;
}

#market-dialog[open] .payment span {
  padding-left: 34px !important;
  font-size: 12px !important;
}

#market-dialog[open] .payment span::before {
  font-size: 17px !important;
}

#market-dialog[open] .payment b {
  min-width: 160px !important;
  font-size: 15px !important;
}

#market-dialog[open] .payment b:last-child {
  padding-bottom: 5px !important;
  border-bottom-width: 3px !important;
}

#market-dialog[open] #create-submit.primary.full {
  height: 56px !important;
  min-height: 56px !important;
  font-size: 0 !important;
}

#market-dialog[open] #create-submit.primary.full::before {
  content: "CONFIRM POSITION" !important;
  display: block !important;
  font: 800 17px/1 "DM Mono", monospace !important;
}

#market-dialog[open] #create-submit.primary.full::after {
  right: 23px !important;
  font-size: 29px !important;
}

.wallet-dialog {
  width: min(540px, calc(100vw - 28px)) !important;
  max-width: 540px !important;
}

.wallet-picker {
  padding: 34px 30px 28px !important;
}

.wallet-picker .close {
  top: 20px !important;
  right: 20px !important;
  width: 42px !important;
  height: 42px !important;
  font-size: 31px !important;
}

.wallet-picker h2 {
  font-size: 34px !important;
}

.wallet-picker > p:not(.eyebrow) {
  margin-bottom: 24px !important;
  font-size: 15px !important;
}

.wallet-option {
  min-height: 70px !important;
  grid-template-columns: 44px minmax(0, 1fr) auto !important;
  gap: 14px !important;
  padding: 10px 15px !important;
}

.wallet-option > span {
  width: 42px !important;
  height: 42px !important;
  font-size: 23px !important;
}

.wallet-option b {
  font-size: 16px !important;
}

.wallet-option i {
  font-size: 12px !important;
}

@media (max-width: 700px) {
  #market-dialog[open],
  .wallet-dialog {
    width: calc(100vw - 16px) !important;
  }

  #market-dialog[open] .form-grid {
    grid-template-columns: 1fr !important;
  }

  #market-dialog[open] .expiry-inputs {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* Confirm Position: visual order and styling. Transaction behavior is unchanged. */
#join-dialog[open] {
  width: min(540px, calc(100vw - 20px)) !important;
  max-width: 540px !important;
}

#join-dialog[open] .eyebrow {
  display: none !important;
}

#join-dialog[open] #join-title {
  margin-top: 0 !important;
  font-size: 27px !important;
}

#join-dialog[open]:has(#join-submit[data-side="UP"]) #join-title::after {
  content: " \2191" !important;
  color: #19d9b3 !important;
}

#join-dialog[open]:has(#join-submit[data-side="DOWN"]) #join-title::after {
  content: " \2193" !important;
  color: #ff3f86 !important;
}

#join-dialog[open] .confirm-market {
  margin-top: 14px !important;
}

#join-dialog[open] .prediction-flow {
  grid-template-columns: minmax(0, 1fr) 42px minmax(0, 1fr) !important;
  gap: 8px !important;
}

#join-dialog[open] .prediction-choice.challenger {
  order: 1;
}

#join-dialog[open] .flow-arrow {
  order: 2;
  width: 38px !important;
  height: 38px !important;
  font-size: 12px !important;
  line-height: 38px !important;
}

#join-dialog[open] .prediction-choice.creator {
  order: 3;
  border-color: rgba(139, 169, 176, 0.14) !important;
  background: rgba(139, 169, 176, 0.035) !important;
}

#join-dialog[open] .prediction-choice.creator span,
#join-dialog[open] .prediction-choice.creator b {
  color: #737d80 !important;
}

#join-dialog[open] .prediction-choice.challenger small,
#join-dialog[open] .prediction-choice.creator small {
  display: none !important;
}

#join-dialog[open]:has(#join-submit[data-side="UP"]) .prediction-choice.challenger {
  border-color: rgba(25, 217, 179, 0.5) !important;
  background: rgba(25, 217, 179, 0.09) !important;
}

#join-dialog[open]:has(#join-submit[data-side="UP"]) .prediction-choice.challenger span,
#join-dialog[open]:has(#join-submit[data-side="UP"]) .prediction-choice.challenger b {
  color: #19d9b3 !important;
}

#join-dialog[open]:has(#join-submit[data-side="DOWN"]) .prediction-choice.challenger {
  border-color: rgba(255, 63, 134, 0.5) !important;
  background: rgba(255, 63, 134, 0.09) !important;
}

#join-dialog[open]:has(#join-submit[data-side="DOWN"]) .prediction-choice.challenger span,
#join-dialog[open]:has(#join-submit[data-side="DOWN"]) .prediction-choice.challenger b {
  color: #ff3f86 !important;
}

#join-dialog[open] .target-strip b::after {
  content: " USDG";
  color: #19d9b3;
  font-size: 12px;
}

#join-dialog[open] #join-submit {
  font-size: 0 !important;
}

#join-dialog[open] #join-submit::before {
  content: "CONFIRM POSITION" !important;
  font: 800 14px/1 "DM Mono", monospace !important;
}

/* Confirm Position: match the high-contrast versus-card reference. */
#join-dialog[open] {
  width: min(590px, calc(100vw - 18px)) !important;
  max-width: 590px !important;
}

#join-dialog[open] > form.dialog-title {
  padding: 20px 18px 14px !important;
  border-color: rgba(25, 217, 179, 0.55) !important;
  border-radius: 7px !important;
  background: linear-gradient(150deg, #06151a, #020a0e 76%) !important;
}

#join-dialog[open] #join-title {
  color: #f2f4f3 !important;
  font: 700 31px/1 "Manrope", sans-serif !important;
  letter-spacing: -1.3px !important;
}

#join-dialog[open] > form.dialog-title > .close {
  top: 15px !important;
  right: 15px !important;
  width: 37px !important;
  height: 37px !important;
  border-color: #e5e9e7 !important;
  color: #19d9b3 !important;
}

#join-dialog[open] .confirm-market {
  margin: 22px 0 15px !important;
  padding: 14px 14px 16px !important;
  border-color: rgba(139, 169, 176, 0.2) !important;
  border-radius: 6px !important;
}

#join-dialog[open] .challenge-head {
  margin-bottom: 8px !important;
}

#join-dialog[open] .prediction-flow {
  grid-template-columns: minmax(0, 1fr) 58px minmax(0, 1fr) !important;
  min-height: 112px !important;
  gap: 5px !important;
  align-items: center !important;
}

#join-dialog[open] .prediction-choice {
  height: 96px !important;
  min-height: 96px !important;
  justify-content: center !important;
  align-content: center !important;
  gap: 11px !important;
  border-radius: 0 !important;
  clip-path: polygon(3% 5%, 97% 0, 100% 90%, 0 100%) !important;
}

#join-dialog[open] .prediction-choice.challenger {
  transform: rotate(2.5deg) !important;
}

#join-dialog[open] .prediction-choice.creator {
  transform: rotate(-2.5deg) !important;
  border-color: rgba(139, 169, 176, 0.12) !important;
  background: rgba(139, 169, 176, 0.055) !important;
}

#join-dialog[open] .prediction-choice.creator span::before {
  content: "\265B";
  margin-right: 7px;
  color: #737d80;
}

#join-dialog[open] .prediction-choice span {
  font-size: 10px !important;
}

#join-dialog[open] .prediction-choice b {
  font: 700 31px/1 "Manrope", sans-serif !important;
}

#join-dialog[open] .flow-arrow {
  width: 46px !important;
  height: 46px !important;
  border-color: rgba(139, 169, 176, 0.3) !important;
  background: #031017 !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 46px !important;
  transform: none !important;
}

#join-dialog[open] .flow-arrow::before {
  content: "\26A1";
  color: #ff3f86;
  font: 18px/46px Arial, sans-serif;
}

#join-dialog[open] .target-strip {
  min-height: 60px !important;
  margin-top: 12px !important;
  padding: 9px 18px !important;
  border-color: rgba(25, 217, 179, 0.78) !important;
  background: rgba(2, 12, 17, 0.9) !important;
}

#join-dialog[open] .target-strip b {
  color: #f4f5f4 !important;
  font: 700 27px/1 "DM Mono", monospace !important;
}

#join-dialog[open] .target-strip b::after {
  color: #19d9b3 !important;
  font-size: 12px !important;
}

#join-dialog[open] .payment {
  position: relative;
  gap: 16px 24px !important;
  margin: 0 0 20px !important;
  padding: 18px 10px 17px !important;
  border-top: 3px solid rgba(139, 169, 176, 0.34) !important;
  border-bottom: 0 !important;
  font-size: 14px !important;
}

#join-dialog[open] .payment span {
  color: #edf0ef !important;
  font: 600 14px/1.15 "DM Mono", monospace !important;
}

#join-dialog[open] .payment b {
  min-width: 170px !important;
  color: #f1f3f2 !important;
  font: 600 14px/1.15 "DM Mono", monospace !important;
}

#join-dialog[open] .payment .if-you-win-value {
  color: #19d9b3 !important;
}

#join-dialog[open] .payment b:last-child {
  position: relative;
  padding: 0 38px 9px 0 !important;
  border-bottom: 4px solid #ff1681 !important;
  font-size: 17px !important;
}

#join-dialog[open] .payment b:last-child::after {
  content: "\2196";
  position: absolute;
  right: 1px;
  bottom: 1px;
  color: #ff1681;
  font: 27px/1 Arial, sans-serif;
}

#join-dialog[open] #join-submit {
  min-height: 66px !important;
  border: 1px solid #a9ff20 !important;
  border-radius: 5px !important;
  background: linear-gradient(135deg, #19ceb4, #38d2bd) !important;
}

#join-dialog[open] #join-submit::before {
  font-size: 16px !important;
}

#join-dialog[open] .form-note {
  margin-top: 18px !important;
  min-height: 56px;
  padding: 12px 15px 12px 42px !important;
  border-color: rgba(139, 169, 176, 0.24) !important;
  background: rgba(3, 12, 18, 0.52) !important;
  font-size: 8px !important;
}