/* One real image and one number. Explicit images also survive footage capture. */
.token-price {display:inline-flex;align-items:center;justify-content:center;gap:.3em;white-space:nowrap;vertical-align:middle;font:inherit;font-variant-numeric:tabular-nums}
.token-price>.token-coin {display:inline-block;flex:none;width:1.3em;height:1.3em;max-width:none;max-height:none;object-fit:contain;image-rendering:pixelated;margin:0;filter:none;vertical-align:middle}
.token-price>.token-digits {font:inherit;letter-spacing:inherit;white-space:nowrap}
.workshop-ui[data-mode] .market-price.token-label {text-align:center}
.energy-choice-cost.token-label {display:block;text-align:center}
.energy-confirm.token-label .token-price {vertical-align:middle}
.game-message-body.token-label .token-price {font-weight:700}
.review-care-cost .token-price {vertical-align:middle}
/* A price the game asks for shows its dollars on their own line under the tokens, in the same font and colour, never
   faded (owner, 7 Oct 2026, G13/G14). */
.token-label>.price-usd {display:block;font:inherit;color:inherit;opacity:1;letter-spacing:inherit;white-space:nowrap;line-height:1.25}
.workshop-ui[data-mode] .market-price.token-label>.price-usd {font-size:.92em}
.market-buy.token-label>.price-usd,.energy-buy.token-label>.price-usd {font-size:.9em}
.market-cart-line-price.token-label>.price-usd {display:inline;margin-left:.6em}
.market-cart-total.token-label>.price-usd {margin-top:2px}
/* The owner's sale (10 Oct 2026; ui-copy.mjs salePriceText, creditLabel): while it runs a payment price reads "$25 $18.75
   −25%": the list price struck through and muted, the server's sale price, a small red chip. The struck price and the
   chip are a little smaller, so the line keeps close to its old room and stays one row wherever it fits; where it cannot
   (a narrow phone's card) it wraps between its parts, never inside one: the old price above, the sale price and its chip
   under it. Where the tokens and the dollars share one flex row (the energy refills) it takes its own row under them.
   The same marks on the game's other prices to pay (packs, overclock, the builder's jobs, Care all, the first-PC cards):
   a price line kept on one row there may wrap between its parts once marked. */
.token-label>.price-usd.price-on-sale,:is(.oc-go-cost,.mypcs-primary-cost,.mypcs-oc-sub,.care-total-cost,.power-rung-price).price-on-sale,
.workshop-ui[data-mode=build] :is(.build-health-care-cost,.build-health-oc-sub,.build-pc-action-sub).price-on-sale {white-space:normal}
.price-on-sale>:is(.price-was,.price-now,.price-sale) {white-space:nowrap}
.price-on-sale>.price-was {font-size:.86em;font-weight:400;color:inherit;opacity:.62;text-decoration:line-through;text-decoration-thickness:.12em}
.price-on-sale>.price-now {font:inherit;color:inherit}
.price-sale {display:inline-block;padding:.06em .28em .12em;background:#d8432a;box-shadow:0 0 0 1px #8f3a2c;color:#fff7df;
  font-size:max(9px,.8em);font-weight:700;line-height:1.1;letter-spacing:0;text-decoration:none;vertical-align:.1em;white-space:nowrap}
.energy-offer-cost.token-label-sale {flex-wrap:wrap}
.energy-offer-cost.token-label-sale>.price-usd {flex-basis:100%;text-align:right}
@media(max-width:600px) {.energy-offer-cost.token-label-sale>.price-usd {text-align:center}}
