/* One fingerprinted static derivative, cached and reused across all Coin UI. */
html body .mvp-coin-icon {
    display: inline-block;
    flex: 0 0 auto;
    width: var(--coin-icon-size, 1.25em);
    height: var(--coin-icon-size, 1.25em);
    min-width: var(--coin-icon-size, 1.25em);
    padding: 0;
    border: 0;
    border-radius: 0;
    background: url("../../images/ui/icons/mvp-coin-LLWZrsQ.webp") center / contain no-repeat;
    box-shadow: none;
    vertical-align: -0.22em;
}

.mvp-coin-icon::before,
.mvp-coin-icon::after { content: none !important; }

.featured-market-card__coin { --coin-icon-size: 32px; }
.generic-market-mini-card__coin { --coin-icon-size: 26px; }
.dashboard-ledger-row__icon { --coin-icon-size: 28px; }
.markets-section-header__icon.mvp-coin-icon { --coin-icon-size: 24px; }
.dashboard-stat__icon.mvp-coin-icon { --coin-icon-size: 24px; }

/* Desktop: coin spans amount and label. Mobile: one centered amount row. */
html body .app-coin-counter > .mvp-coin-icon {
    --coin-icon-size: 28px;
    grid-column: 1;
    grid-row: 1 / span 2;
    align-self: center;
}
.app-coin-counter > strong { grid-column: 2; grid-row: 1; align-self: center; color: var(--color-text); }
.app-coin-counter > small { grid-column: 2; grid-row: 2; }
@media (max-width: 960px) {
    html body .app-coin-counter { align-content: center; grid-template-rows: auto; }
    html body .app-coin-counter > .mvp-coin-icon { grid-row: 1; }
}
.dashboard-home .dashboard-stats--strip .mvp-coin-icon {
    --coin-icon-size: clamp(0.65rem, 3.5vw, 1.1rem);
    width: var(--coin-icon-size);
    height: var(--coin-icon-size);
    justify-self: center;
}