.shot-numeric-text,
.take-shot-quick [data-fraction]:not([data-fraction="1"]):not([data-fraction="100"]) b {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}

.shots-page .shot-position-sheet .tb {
  display: inline-flex;
  margin: 0 var(--space-4) 0 0;
  vertical-align: middle;
}

.shot-position-values {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-8);
  margin: var(--space-8) 0 0;
}

.shot-position-values > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: var(--space-12) var(--space-8);
  border-radius: var(--radius-lg);
  background: var(--moonx-raised);
  text-align: center;
}

.shot-position-values dt,
.shot-position-values small {
  color: var(--moonx-text-secondary);
  font-family: var(--font-mono);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.shot-position-values dd {
  margin: var(--space-4) 0 0;
  color: var(--moonx-blue-high);
  font-family: var(--font-mono);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -.035em;
  line-height: 1;
}

.shot-position-values small {
  display: block;
  margin-top: var(--space-8);
  color: var(--moonx-blue-high);
  font-family: var(--font-mono);
  font-size: 9px;
  font-weight: 400;
  letter-spacing: .06em;
  line-height: 1.4;
  text-transform: none;
}

.shot-position-values > div:last-child dd {
  color: var(--moonx-text);
}

.shot-position-values .shot-position-value--loss dd {
  color: var(--moonx-blue-high);
}

/* v24 sell sheet: the position's outcome stays visible while a user chooses
   between the live bid and a resting limit order. */
.shot-position-modal {
  max-width: 560px;
}

.shot-position-modal .mx-modal-title {
  font-size: 28px;
}

.sell-shot-modal--gain .mx-modal-subtitle strong,
.sell-shot-modal--gain .shot-position-values > div:first-child dd {
  color: var(--moonx-green);
}

.shot-position-modal:not(.sell-shot-modal--gain) .mx-modal-subtitle strong {
  color: var(--moonx-blue-high);
}

.shot-position-modal .mx-modal-subtitle > strong:first-child {
  color: inherit;
}

.sell-shot-price {
  color: var(--moonx-text);
  font-weight: 700;
}

.shot-position-modal .sell-position-gauge {
  position: relative;
  padding: var(--space-16);
  border: var(--border-hairline) solid var(--moonx-line-strong);
  border-radius: var(--radius-16);
  background: linear-gradient(120deg, rgba(45, 123, 255, .12), rgba(45, 123, 255, .02));
}

.sell-position-gauge .gz3 {
  position: relative;
  display: block;
  margin-top: 20px;
  padding-bottom: 12px;
}

.sell-position-gauge .gcap {
  position: absolute;
  right: 14px;
  bottom: 12px;
  display: flex;
  align-items: baseline;
  gap: 7px;
  white-space: nowrap;
}

.sell-position-gauge .gcap small {
  color: var(--moonx-text-secondary);
  font-family: var(--font-mono);
  font-size: 8px;
  letter-spacing: .1em;
}

.sell-position-gauge .gcap b {
  color: var(--moonx-blue-high);
  font-family: var(--font-mono);
  font-size: 12.5px;
  font-weight: 400;
  letter-spacing: .02em;
}

.sell-position-summary {
  margin: var(--space-8) 0 0;
  color: var(--moonx-text);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.55;
}

.sell-position-summary strong {
  color: var(--moonx-blue-high);
}

.sell-position-summary strong:nth-of-type(2) {
  color: var(--moonx-green);
}

.sell-shot-modal > .mx-modal-copy:not(.shot-position-sheet) {
  gap: var(--space-12);
}

.sell-shot-fees {
  margin: 0;
  color: var(--moonx-text-secondary);
  font-size: 11px;
}

.sell-shot-modal .take-shot-calc-label.is-error {
  color: var(--moonx-red);
}

.take-shot-amount-group .sell-shot-fees {
  margin-top: var(--space-8);
}

.sell-shot-price-heading,
.sell-shot-price-quote {
  display: flex;
  align-items: center;
}

.sell-shot-price-heading {
  justify-content: space-between;
}

.sell-shot-price-quote {
  gap: var(--space-4);
}

.shots-page .shot-target:target > article,
.shots-page .shot-target:target > button {
  border-color: var(--color-primary);
}
