html body.market-active {
    background: #ffffff !important;
    color: #050505 !important;
}

/* The market tab paints the legacy guest markup the instant `market-active`
   lands, then the lazy bundle loads 16 files in sequence and rewrites it: an
   owner saw the guest circle-avatar screen, then guest.js's restyled version,
   then finally owner home once /market-auth answered. Three screens for one tab.

   The role is knowable synchronously (owner session in localStorage, or the
   chat identity's bloc matching the app), so the tab stamps data-market-role
   before anything paints and this stylesheet — a static <link>, so it applies
   at first paint — holds the whole area blank until the surface that role
   actually wants reports itself ready. Blank-then-correct, never wrong-then-correct.

   `visibility` rather than `display` so layout is already settled and nothing
   jumps when the surface appears. */
html body.market-active #market-main-area:not([data-market-surface-ready="1"]) > * {
    visibility: hidden !important;
}

/* The animated background is chrome, not content: it may paint during the hold
   so the blank frame carries the app's texture rather than reading as a stall. */
html body.market-active #market-main-area:not([data-market-surface-ready="1"]) > .market-bg-animation {
    visibility: visible !important;
}

html body.market-active #market-main-area[data-market-surface-ready="1"] > * {
    visibility: visible !important;
}

/* An owner never wants the legacy guest markup, at any point in the load —
   not while blank, not after. Keep it out of the running entirely so a stray
   reveal cannot resurrect it. */
html body.market-active #market-main-area[data-market-role="owner"] > div:nth-child(2),
html body.market-active #market-main-area[data-market-role="owner"] > .market-guest-home,
html body.market-active #market-main-area[data-market-role="owner"] > .mobile-market-guest-view {
    display: none !important;
}

/* The levitating avatar is the loudest thing in the pre-enhancement markup and
   the first to paint: `visibility` alone still let it composite for a frame
   between the gate lifting and guest.js's layout landing, which reads as the
   old circle-avatar screen flashing past. guest.js sets display:none on it once
   restyled, so take it out of flow from the start — for both roles — and let
   the enhanced surface be the only thing that ever appears here. */
html body.market-active #market-main-area .token-showcase:not(.market-guest-home__art),
html body.market-active #market-main-area #mobile-purchase-requests-panel {
    display: none !important;
}

/* Held-blank state paints the destination's own background, so the reveal is a
   content fade-in rather than a colour change. */
html body.market-active #market-main-area[data-market-role="owner"]:not([data-market-surface-ready="1"]) {
    background: #f7f7f4 !important;
}

html body.market-active #mobile-app-header,
html body.market-active #mobile-app-header *,
html body.market-active #bottom-nav,
html body.market-active #bottom-nav * {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Helvetica Neue", Arial, sans-serif !important;
    letter-spacing: 0 !important;
}

html body.market-active #mobile-app-header .mobile-app-header__tab,
html body.market-active #mobile-app-header .tab-menu-item,
html body.market-active #mobile-app-header [data-tab] {
    font-size: 13px !important;
    font-weight: 780 !important;
}

html body.market-active #bottom-nav,
html[data-theme] body.market-active #bottom-nav,
body.market-active[data-theme] #bottom-nav {
    background: rgba(255,255,255,0.97) !important;
    background-color: rgba(255,255,255,0.97) !important;
    background-image: none !important;
    border-top: 1px solid rgba(15,23,42,0.08) !important;
    box-shadow: 0 -8px 26px rgba(15,23,42,0.055) !important;
    -webkit-box-shadow: 0 -8px 26px rgba(15,23,42,0.055) !important;
    backdrop-filter: blur(18px) !important;
    -webkit-backdrop-filter: blur(18px) !important;
}

html body.market-active #bottom-nav > button.bottom-nav-btn {
    height: 58px !important;
    gap: 3px !important;
    color: #050505 !important;
    -webkit-text-fill-color: #050505 !important;
}

html body.market-active #bottom-nav > button.bottom-nav-btn i,
html body.market-active #bottom-nav > button.bottom-nav-btn .bottom-nav-avatar {
    width: 25px !important;
    height: 25px !important;
    font-size: 23px !important;
}

html body.market-active #bottom-nav > button.bottom-nav-btn .market-nav-label,
html body.market-active #bottom-nav > button.bottom-nav-btn .avatar-nav-label {
    font-size: 9px !important;
    line-height: 1 !important;
    font-weight: 780 !important;
    color: rgba(5,5,5,0.58) !important;
    -webkit-text-fill-color: rgba(5,5,5,0.58) !important;
    opacity: 1 !important;
}

html body.market-active #bottom-nav > button.bottom-nav-btn.active i,
html body.market-active #bottom-nav > button.bottom-nav-btn.active .market-nav-label,
html body.market-active #bottom-nav > button.bottom-nav-btn.active .avatar-nav-label {
    color: var(--primary-color, #e94f2e) !important;
    -webkit-text-fill-color: var(--primary-color, #e94f2e) !important;
    opacity: 1 !important;
}

html body.market-active #pwa-install-banner,
html body.market-active #athlete-splash-screen {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    opacity: 0 !important;
}

/* Guest Market Home — isolated from owner Market and every other app tab.
   The .market-owner-mode guard this file leans on is never set by anything, so
   it was landing the guest's 84px inset on the owner dashboard too. The role
   stamped on the area is the signal that actually exists — exclude on that. */
html body.market-active:not(.market-owner-mode) #market-main-area:not([data-market-role="owner"]) {
    padding-top: max(84px, calc(var(--mobile-app-header-height, 100px) - 48px)) !important;
    background: #ffffff !important;
    color: #101010 !important;
}

/* Sit inside the app chrome rather than covering it: start below the fixed
   header and stop above the bottom nav, and stay under the nav's z-index so
   the tab bar remains tappable while the wallet is open. */
html body.market-active:not(.market-owner-mode) .market-guest-wallet {
    position: fixed;
    top: var(--market-guest-chrome-top, calc(env(safe-area-inset-top, 0px) + 74px));
    left: 0;
    right: 0;
    bottom: var(--market-guest-chrome-bottom, calc(env(safe-area-inset-bottom, 0px) + 58px));
    z-index: 10010;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    background: #fff;
    color: #101010;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif;
}

/* Wallet is a bottom-nav destination, not a pushed screen, so it carries no
   back bar: the title sits in the body and content flows under the app header
   exactly like the market home surface does. */
html body.market-active:not(.market-owner-mode) .market-guest-wallet__intro {
    display: grid;
    justify-items: center;
    gap: 4px;
    margin: 0 0 4px;
    text-align: center;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__intro > span,
html body.market-active:not(.market-owner-mode) .market-guest-wallet__access > span {
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

html body.market-active:not(.market-owner-mode) #market-main-area ~ .market-guest-wallet .market-guest-wallet__intro > span,
html body.market-active:not(.market-owner-mode) .market-guest-wallet__intro > span {
    color: #696969 !important;
    -webkit-text-fill-color: #696969 !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__intro h1 {
    margin: 0;
    font-size: 26px;
    font-weight: 850;
    line-height: 1.1;
    letter-spacing: -.02em;
}

/* Top padding lands the first row at the same y as the market home surface
   (which starts at the scroll area's 84px padding-top). */
html body.market-active:not(.market-owner-mode) .market-guest-wallet__body {
    padding: 10px 20px 32px;
    display: grid;
    gap: 16px;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__card {
    min-height: 146px;
    padding: 22px;
    border-radius: 24px;
    background: #101010;
    color: #fff;
    display: grid;
    align-content: center;
    gap: 8px;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__card span {
    color: #bdbdbd;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .14em;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__card strong {
    font-size: 38px;
    line-height: 1;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__card p {
    margin: 0;
    color: #d8d8d8;
    font-size: 13px;
    line-height: 1.4;
}

/* Flat: no card around this section — the heading and CTA carry it, and the
   icon reads as a mark rather than a tile inside a box. */
html body.market-active:not(.market-owner-mode) .market-guest-wallet__access {
    padding: 22px 2px 6px;
    border: 0;
    border-radius: 0;
    text-align: center;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__icon {
    width: auto;
    height: auto;
    margin: 0 auto 14px;
    border-radius: 0;
    background: none;
    display: grid;
    place-items: center;
    color: #a1a1aa;
    font-size: 26px;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__access h1 {
    margin: 8px 0 10px;
    font-size: 28px;
    line-height: 1;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__access p {
    margin: 0 auto 22px;
    max-width: 300px;
    color: #5f5f5f;
    font-size: 14px;
    line-height: 1.45;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__access button,
html body.market-active:not(.market-owner-mode) .market-guest-wallet__buy {
    width: 100%;
    min-height: 54px;
    border-radius: 16px;
    font-size: 13px;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__access button {
    border: 0;
    background: #101010;
    color: #fff;
    -webkit-text-fill-color: #fff;
}

html body.market-active:not(.market-owner-mode) .market-guest-wallet__buy {
    border: 1px solid #d8d8d8;
    background: #fff;
    color: #101010;
    -webkit-text-fill-color: #101010;
}

/* The fixed guest Wallet must remain legible if mobile Safari carries a stale
   body mode class through the Market transition. */
#mobile-market-guest-wallet .market-guest-wallet__card {
    background: #101010 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

#mobile-market-guest-wallet .market-guest-wallet__card > span,
#mobile-market-guest-wallet .market-guest-wallet__card > p {
    color: #d0d0d0 !important;
    -webkit-text-fill-color: #d0d0d0 !important;
}

#mobile-market-guest-wallet .market-guest-wallet__card > strong {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

#mobile-market-guest-wallet [data-guest-wallet-login],
#mobile-market-guest-wallet [data-guest-wallet-login] * {
    background: #101010 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-dashboard__hero,
html body.market-active:not(.market-owner-mode) .market-guest-dashboard__hero strong {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-dashboard__hero span,
html body.market-active:not(.market-owner-mode) .market-guest-dashboard__hero p {
    color: #bdbdbd !important;
    -webkit-text-fill-color: #bdbdbd !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-dashboard__hero button {
    background: #fff !important;
    color: #101010 !important;
    -webkit-text-fill-color: #101010 !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-dashboard__empty button {
    background: #101010 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html body.market-active:not(.market-owner-mode) #market-main-area > .market-bg-animation {
    display: none !important;
}

/* Zero top padding here put the hero's first line flush against the area's own
   padding edge, which sits only ~10px under the fixed header — the title read
   as clipped by the header. The surface needs its own top inset, not just the
   area's. */
html body.market-active:not(.market-owner-mode) #market-main-area > .market-guest-home {
    box-sizing: border-box !important;
    display: flex !important;
    min-height: 100% !important;
    height: auto !important;
    padding: 24px 20px 112px !important;
    gap: 0 !important;
    justify-content: flex-start !important;
    align-items: center !important;
    overflow: visible !important;
    background: #ffffff !important;
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__art {
    display: none !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__art > div:first-child {
    display: none !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__art > div:not(:first-child),
html body.market-active:not(.market-owner-mode) .market-guest-home__art > div:last-child {
    width: 84px !important;
    height: 84px !important;
    border: 0 !important;
    border-radius: 24px !important;
    box-shadow: 0 12px 28px rgba(15,23,42,.14) !important;
    overflow: hidden !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__art img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    object-position: center !important;
    background: #ffffff !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__art > div:last-child > span {
    box-sizing: border-box !important;
    width: 100% !important;
    padding: 0 5px !important;
    overflow: hidden !important;
    color: #101010 !important;
    -webkit-text-fill-color: #101010 !important;
    font-size: 11px !important;
    line-height: 1 !important;
    letter-spacing: -.04em !important;
    white-space: nowrap !important;
    text-overflow: clip !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__title {
    order: 2;
    width: 100%;
    margin: 0 0 18px !important;
    text-align: center !important;
    animation: none !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__title h1 {
    display: none !important;
}

/* The verified badge is inline-styled in the template with --primary-color,
   which renders as a heavy dark pill against this white surface. Restyle it as
   a light neutral chip so it sits with the subtitle instead of shouting. It is
   the div right after the (hidden) h1 inside the title block. */
html body.market-active:not(.market-owner-mode) .market-guest-home__title h1 + div {
    order: 1;
    margin: 0 0 10px !important;
    line-height: 1 !important;
}

html body.market-active:not(.market-owner-mode) #market-main-area .market-guest-home__title h1 + div > span {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    padding: 5px 11px 5px 9px !important;
    border: 1px solid rgba(15, 23, 42, .08) !important;
    border-radius: 999px !important;
    background: #f4f4f5 !important;
    color: #52525b !important;
    -webkit-text-fill-color: #52525b !important;
    font-size: 11px !important;
    font-weight: 640 !important;
    letter-spacing: .01em !important;
    text-transform: uppercase !important;
    box-shadow: none !important;
}

html body.market-active:not(.market-owner-mode) #market-main-area .market-guest-home__verified-tick,
html body.market-active:not(.market-owner-mode) #market-main-area i.market-guest-home__verified-tick {
    color: #16a34a !important;
    -webkit-text-fill-color: #16a34a !important;
    font-size: 12px !important;
    line-height: 1 !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__subtitle {
    max-width: 310px;
    margin: 8px auto 0 !important;
    color: #696969 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    font-weight: 560 !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__amount {
    order: 3;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 420px !important;
    margin: 0 !important;
    /* Flat: the amount field below is the only box this section needs, so the
       wrapper carries no border, fill or shadow of its own. */
    padding: 4px 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    animation: none !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__amount > div:first-child {
    margin-bottom: 16px !important;
    color: #686868 !important;
    font-size: 12px !important;
    line-height: 1 !important;
    font-weight: 800 !important;
    letter-spacing: .08em !important;
    text-transform: uppercase !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__amount > div:nth-child(2) > div {
    display: grid !important;
    grid-template-columns: minmax(0,1fr) 72px minmax(0,1fr) !important;
    justify-items: center !important;
    align-items: center !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 254px !important;
    height: 74px !important;
    padding: 0 22px !important;
    border: 0 !important;
    border-radius: 18px !important;
    background: #f4f4f5 !important;
    box-shadow: none !important;
}

html body.market-active #market-main-area .market-guest-home__amount > div:nth-child(2) > div > span {
    grid-column: 1 !important;
    justify-self: end !important;
    margin: 0 !important;
}

html body.market-active:not(.market-owner-mode) #mobile-app-purchase-amount {
    grid-column: 2 !important;
    justify-self: center !important;
    width: 72px !important;
    padding: 0 !important;
    border: 0 !important;
    outline: none !important;
    background: transparent !important;
    box-shadow: none !important;
    text-align: center !important;
    color: #101010 !important;
    -webkit-text-fill-color: #101010 !important;
    font-size: 42px !important;
    font-weight: 850 !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__amount > div:nth-child(3) {
    display: grid !important;
    grid-template-columns: repeat(4,1fr) !important;
    gap: 8px !important;
    width: 100% !important;
    margin: 18px 0 14px !important;
}

html body.market-active:not(.market-owner-mode) [data-market-bucks-amount],
html body.market-active:not(.market-owner-mode) .market-guest-home__amount > div:nth-child(3) button {
    min-width: 0 !important;
    padding: 11px 4px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f4f4f5 !important;
    color: #52525b !important;
    -webkit-text-fill-color: #52525b !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    box-shadow: none !important;
}

/* Must out-specify the grey rule above, whose second selector
   (.market-guest-home__amount > div:nth-child(3) button) also matches these. */
html body.market-active:not(.market-owner-mode) [data-market-bucks-amount].is-selected,
html body.market-active:not(.market-owner-mode) .market-guest-home__amount > div:nth-child(3) button.is-selected {
    /* Selection is a quiet state, not a second call to action: keep the solid
       black for the BUY button alone. */
    border-color: transparent !important;
    background: #e4e4e7 !important;
    color: #101010 !important;
    -webkit-text-fill-color: #101010 !important;
}

/* The rate line below already says 1 Buck = $1 USD, so this restatement of
   the same conversion is noise. */
html body.market-active:not(.market-owner-mode) #mobile-bucks-display {
    display: none !important;
}

.market-guest-home__rate {
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin-top: 10px;
    padding-top: 0;
    border-top: 0;
    color: #8a8a8a;
    font-size: 12px;
    font-weight: 700;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__actions {
    order: 4;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 420px !important;
    margin-top: 14px !important;
    gap: 10px !important;
    animation: none !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__actions .buy-btn-sexy {
    width: 100% !important;
    min-height: 58px !important;
    padding: 16px 20px !important;
    border-radius: 999px !important;
    background: #111 !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    box-shadow: none !important;
    animation: none !important;
    font-size: 15px !important;
    letter-spacing: .02em !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__actions .buy-btn-sexy span {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

/* Keep the primary CTA legible when the shared button skin injects nested labels. */
html body.market-active:not(.market-owner-mode) .market-guest-home__actions .buy-btn-sexy,
html body.market-active:not(.market-owner-mode) .market-guest-home__actions .buy-btn-sexy *,
html body.market-active #market-main-area .market-guest-home__actions .buy-btn-sexy,
html body.market-active #market-main-area .market-guest-home__actions .buy-btn-sexy * {
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
}

html body.market-active #market-main-area .market-guest-home__actions .buy-btn-sexy span {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__actions .buy-btn-sexy > div {
    display: none !important;
}

html body.market-active:not(.market-owner-mode) .market-guest-home__actions > button:not(.buy-btn-sexy) {
    width: 100% !important;
    min-height: 52px !important;
    padding: 14px 20px !important;
    border: 0 !important;
    border-radius: 999px !important;
    background: #f4f4f5 !important;
    color: #3f3f46 !important;
    -webkit-text-fill-color: #3f3f46 !important;
    box-shadow: none !important;
    font-size: 13px !important;
    letter-spacing: .02em !important;
}

.market-guest-home__secure {
    display: grid;
    grid-template-columns: 18px auto 1fr;
    align-items: center;
    gap: 6px;
    padding: 4px 3px 0;
    color: #777;
    font-size: 10px;
    font-weight: 700;
}

.market-guest-home__secure b {
    justify-self: end;
    color: #4d4d4d;
    font-weight: 750;
}

/* Owner Home owns this surface; never let guest styling resurrect it underneath. */
html body.market-active #market-main-area.market-owner-home-active > .market-guest-home,
html body.market-active #market-main-area.market-owner-home-active > .mobile-market-guest-view {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

@media (max-height: 760px) {
    html body.market-active:not(.market-owner-mode) #market-main-area > .market-guest-home {
        padding-top: 16px !important;
    }
    html body.market-active:not(.market-owner-mode) .market-guest-home__art {
        width: 64px !important;
        height: 64px !important;
        margin-bottom: 12px !important;
    }
    html body.market-active:not(.market-owner-mode) .market-guest-home__art > div:not(:first-child),
    html body.market-active:not(.market-owner-mode) .market-guest-home__art > div:last-child {
        width: 64px !important;
        height: 64px !important;
    }
    html body.market-active:not(.market-owner-mode) .market-guest-home__title {
        margin-bottom: 16px !important;
    }
}

/* Header ticker — the market screen is full-bleed and covers the header's
   brand, so while Market is up the centre of the bar carries the coin and its
   price instead of the app name. The hamburger and the login/bell button keep
   their slots on either side; only the middle is borrowed. */
/* The brand is capped at min(66vw, 270px) for an app name; a sub-cent price
   with its symbol and change needs the full middle. The hamburger and the
   login/bell button are outside this box and keep their room. */
html body.market-active .mobile-app-header__brand:has(.market-header-ticker) {
    max-width: none !important;
    width: 100% !important;
    min-width: 0 !important;
    justify-self: stretch !important;
}

/* The ticker is a row -- coin, then the price stacked over its change. Without
   nowrap the 140px the brand had settled at pushed the coin onto its own line
   above the price. */
html body.market-active .mobile-app-header__brand .market-header-ticker {
    flex-wrap: nowrap !important;
}

html body.market-active .mobile-app-header__brand .market-header-ticker {
    all: unset;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

html body.market-active .mobile-app-header__brand .market-header-ticker__coin {
    width: 20px;
    height: 20px;
    flex: none;
    align-self: center;
    border-radius: 50%;
    object-fit: cover;
    background: #f3f3f5;
}

html body.market-active .mobile-app-header__brand .market-header-ticker__sym {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.1em;
    color: #8a8a8f !important;
    -webkit-text-fill-color: #8a8a8f !important;
}

html body.market-active .mobile-app-header__brand .market-header-ticker__price {
    font-size: 16px;
    font-weight: 650;
    letter-spacing: -0.4px;
    font-variant-numeric: tabular-nums;
    color: var(--text-primary, #111111) !important;
    -webkit-text-fill-color: var(--text-primary, #111111) !important;
}

html body.market-active .mobile-app-header__brand .market-header-ticker__change {
    font-style: normal;
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

html body.market-active .mobile-app-header__brand .market-header-ticker__change.is-up {
    color: #18a957 !important;
    -webkit-text-fill-color: #18a957 !important;
}

html body.market-active .mobile-app-header__brand .market-header-ticker__change.is-down {
    color: #c8102e !important;
    -webkit-text-fill-color: #c8102e !important;
}