/* One shared exchange ribbon across all public pages. */
:root body {
  --sc-market-height: 34px !important;
}

:root body.sc-polish .market-strip,
:root body .market-strip {
  position: sticky !important;
  top: 0 !important;
  z-index: 41 !important;
  display: block !important;
  box-sizing: border-box !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  padding-block: 0 !important;
  overflow: hidden !important;
  background: #0d2a21 !important;
  border: 0 !important;
  border-bottom: 1px solid #183e32 !important;
  color: #d7eee4 !important;
  font-family: inherit !important;
  font-size: 12px !important;
  letter-spacing: 0 !important;
}

:root body.sc-polish .market-wrap,
:root body .market-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: min(1160px, calc(100% - 48px)) !important;
  min-width: 0 !important;
  height: 100% !important;
  margin-inline: auto !important;
  padding: 0 !important;
  gap: 28px !important;
}

:root body.sc-polish .market-rates,
:root body .market-rates {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
  gap: 48px !important;
  white-space: nowrap !important;
}

:root body.sc-polish .market-strip .market-rates .market-item,
:root body .market-strip .market-rates .market-item {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  color: #d7eee4 !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

:root body.sc-polish .market-strip .market-rates :is(#rateBlue, #rateOfficial),
:root body .market-strip .market-rates :is(#rateBlue, #rateOfficial) {
  margin: 0 !important;
  color: #bfe8d5 !important;
  font-size: 13px !important;
  font-weight: 750 !important;
  font-variant-numeric: tabular-nums !important;
  text-shadow: none !important;
}

:root body.sc-polish .market-strip .market-change,
:root body .market-strip .market-change {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 54px !important;
  margin: 0 !important;
  padding: 1px 6px !important;
  border: 0 !important;
  border-radius: 4px !important;
  background: rgba(143, 216, 187, 0.1) !important;
  color: #8fd8bb !important;
  font-size: 10px !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
  text-align: center !important;
  white-space: nowrap !important;
}

:root body.sc-polish .market-strip #rateUpdated,
:root body.sc-polish .market-strip .market-actions,
:root body .market-strip #rateUpdated,
:root body .market-strip .market-actions {
  display: none !important;
}

@media (max-width: 760px) {
  :root body {
    --sc-market-height: 46px !important;
  }

  :root body.sc-polish .market-strip,
  :root body .market-strip {
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
  }

  :root body.sc-polish .market-wrap,
  :root body .market-wrap {
    width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 0 !important;
    max-height: 46px !important;
    padding-inline: 12px !important;
    gap: 0 !important;
  }

  :root body.sc-polish .market-rates,
  :root body .market-rates {
    width: auto !important;
    min-width: 0 !important;
    flex: 0 1 auto !important;
    justify-content: center !important;
    gap: clamp(14px, 5vw, 24px) !important;
  }

  :root body.sc-polish .market-strip .market-rates .market-item,
  :root body .market-strip .market-rates .market-item {
    display: grid !important;
    grid-template-columns: auto auto !important;
    grid-template-rows: auto auto !important;
    align-items: center !important;
    justify-items: start !important;
    gap: 1px 6px !important;
    min-width: 0 !important;
    font-size: 9px !important;
    line-height: 1.15 !important;
  }

  :root body.sc-polish .market-strip .market-rates .market-item strong,
  :root body .market-strip .market-rates .market-item strong {
    grid-column: 1 !important;
    grid-row: 2 !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
  }

  :root body.sc-polish .market-strip .market-rates .market-item .market-change,
  :root body .market-strip .market-rates .market-item .market-change {
    grid-column: 2 !important;
    grid-row: 2 !important;
    min-width: 0 !important;
    font-size: 9px !important;
    line-height: 1.1 !important;
  }
}

/* One directional hop on interaction or a new variation. */
@keyframes marketHopUp{0%,100%{transform:translateY(0)}40%{transform:translateY(-5px)}65%{transform:translateY(1px)}}
@keyframes marketHopDown{0%,100%{transform:translateY(0)}40%{transform:translateY(5px)}65%{transform:translateY(-1px)}}
:root body .market-strip .market-change.market-hop-up{animation:marketHopUp 600ms ease-in-out!important}
:root body .market-strip .market-change.market-hop-down{animation:marketHopDown 600ms ease-in-out!important}
:root body .market-strip .market-change[role="button"]{cursor:pointer}
:root body .market-strip .market-change:focus-visible{outline:2px solid #bfe8d5;outline-offset:2px}
.market-context-note{position:fixed;top:42px;left:50%;transform:translateX(-50%);z-index:100;width:min(420px,calc(100% - 32px));padding:14px 18px;border:1px solid var(--line);border-radius:12px;background:var(--surface,#fff);color:var(--ink,#18201c);font:13px/1.5 Inter,sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.16)}
@media(prefers-reduced-motion:reduce){:root body .market-strip .market-change.market-hop-up,:root body .market-strip .market-change.market-hop-down{animation:none!important}}
