/* Phone type floor (Shaun, 2026-10-06: "hows the font sizing on mobile on the main website?"). An audit at 339 px wide
   found 6-11 px text all over the lobby, store, missions, rewards, leaderboard, settings and profile. Phones only;
   desktop keeps its sizes. Floors: small uppercase labels 12 px, captions/labels 13 px (both one up, 2026-10-30, and no longer forced: the panel
   rules they had to beat aren't forced any more), buttons and links 13 px, form
   fields 16 px (iOS zooms the page into any field under 16 px). Loaded last in index.php.
   The ":is(html,#mt-a) :is(body,#mt-b)" prefix only raises specificity (an :is() counts as its most specific argument,
   matched or not) so these beat the panel rules written as "body.redesign-v2 #s2-panel .x { ... !important }".
   Not the League pop-up's podium (.lr-pod, assets/league-reveal.js): it keeps the League page's own small stand labels. */
@media (max-width: 720px) {
  /* Small uppercase labels and eyebrows: 12 px */
  :is(html, #mt-a) :is(body, #mt-b) :is(.wc-eyebrow, .px-eyebrow, .rs-eyebrow, .rk-eyebrow, .fr-eyebrow, .pv-eyebrow,
    .lbx-eyebrow, .store-club-eyebrow, .store-offer-tag, .store-pack-badge, .ls-promo-card-badge, .mg-tier,
    .profile-stat-lbl, .cs-label, .gs-eyebrow > span, .gs-eyebrow > b, .rs-hud > span, .profile-level > small, .lbx-place,
    .lbx-score, .lbx-score > strong,
    .lb-stat-lbl, .rk-range, .rk-pay small):not(.lr-pod *) {
    font-size: 12px;
  }

  /* Captions, labels and small body text: 13 px */
  :is(html, #mt-a) :is(body, #mt-b) :is(.lbx-sub, .lbx-name, .v2-hq-stars, .lobby-rules-blurb, .lobby-rules-blurb strong,
    .px-stat-label, .px-section-meta, .store-pack-value, .store-pack-more, .store-fineprint, .px-ring-label > span,
    .rs-donut-total > small, .rs-read, .rs-profile-source, .rs-viz-stats span, .is-full, .lb-note, .lb-mc-corner--num,
    .lby-fr-tag, .lby-fr-tag > b, .ls-promo-card-text, .lobby-footer-disclaimer span, .lobby-footer-disclaimer strong,
    .lobby-footer-legal > span, .pv-num, .pv-split-top > small, .pv-facts dt,
    .pv-tracker-copy > small, .lp-copy > small, .home-status-link small, .store-offer-price > small,
    .store-offer-benefits small,
    .lb-num, .px-chips, .lf2-copy):not(.lr-pod *) {
    font-size: 13px;
  }

  /* Buttons and links: 13 px */
  :is(html, #mt-a) :is(body, #mt-b) :is(.ls-promo-card-btn, .lobby-footer-terms-link, .lobby-footer-legal > a, .lb-tab,
    .st-link, .px-btn--ghost, .account-link-btn, .store-club-cta, .store-redeem-btn, .gs-rules,
    .premium-dm-link, .save-name-btn, .pv-link, .pv-tracker-buy, .rwd-card-lock-overlay-btn, .rs-buy) {
    font-size: 13px !important;
  }

  /* Leaderboard podium: the labels were 6 px; at 11 px their wide letter-spacing wrapped them, so tighten it */
  :is(html, #mt-a) :is(body, #mt-b) :is(.lbx-place, .lbx-score, .lbx-score > strong):not(.lr-pod *) { letter-spacing: .03em !important; line-height: 1.25 !important; }

  /* the profile stat labels sit under a two-id rule: one more id level */
  :is(html, #mt-a) :is(body, #mt-b) :is(div, #mt-c).profile-stat-lbl { font-size: 12px; }

  /* the bigger code field must still share its row with Redeem */
  :is(html, #mt-a) :is(body, #mt-b) .store-redeem-row > input { flex: 1 1 0 !important; min-width: 0 !important; width: auto !important; }
  :is(html, #mt-a) :is(body, #mt-b) .store-redeem-row > button { flex: none !important; }
  :is(html, #mt-a) :is(body, #mt-b) .store-redeem { grid-template-columns: minmax(0, 1fr) !important; }
  :is(html, #mt-a) :is(body, #mt-b) .store-redeem > * { min-width: 0 !important; }

  /* Form fields: 16 px so iOS doesn't zoom when you tap one (the game table keeps its own compact inputs) */
  :is(html, #mt-a) :is(body, #mt-b) :is(input:not([type=range]):not([type=checkbox]):not([type=radio]):not([type=hidden]), textarea, select):not(#table-screen *) {
    font-size: 16px !important;
  }
}
