.content-credit-link { color: inherit; text-decoration-color: color-mix(in srgb, var(--accent-2) 55%, transparent); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.content-credit-link:hover,
.content-credit-link:focus-visible { color: var(--accent-2); text-decoration-color: currentColor; }

.exchange-recommendation { display: grid; grid-template-columns: minmax(10rem, .75fr) minmax(0, 2fr); gap: .2rem .8rem; margin: 0 0 .9rem; padding: .8rem .9rem; border-left: 3px solid var(--accent-2); background: color-mix(in srgb, var(--accent-2) 7%, var(--paper)); }
.exchange-recommendation > span { color: var(--accent-2); font-size: .7rem; font-weight: 900; }
.exchange-recommendation > strong { grid-row: 2 / span 2; font-size: 1rem; }
.exchange-recommendation p,
.exchange-recommendation small { grid-column: 2; margin: 0; }
.exchange-recommendation p { font-size: .8rem; font-weight: 800; line-height: 1.6; }
.exchange-recommendation small { color: var(--muted); font-size: .67rem; line-height: 1.6; }
.exchange-recommendation.is-blocked { border-left-color: var(--accent); background: color-mix(in srgb, var(--accent) 6%, var(--paper)); }
.exchange-recommendation.is-blocked > span { color: var(--accent); }

@media (max-width: 640px) {
  .exchange-recommendation { grid-template-columns: 1fr; }
  .exchange-recommendation > strong { grid-row: auto; }
  .exchange-recommendation p,
  .exchange-recommendation small { grid-column: 1; }
}
