/* LeadVolt phone typography (candidate). Applies at <=760 px, the width where the bottom tab bar is shown; desktop is unchanged.
   Same typeface (Lexend Deca), colours and theme. Sizes move from fixed px to rem, so the browser's text-size setting reaches the
   app, and the smallest labels go from 10-11 px to 12 px at the default setting. Fixed px stays only where text sits inside a
   fixed graphic (avatars, logo marks, the score ring) and on the About page. Loaded last. */

@media (max-width:760px){
  /* The scale: 12 / 13 / 14 / 15 / 19 px at the default 16 px setting (was 11 / 12.5 / 13.5 / 15 / 19). */
  :root{--fs-xs:.75rem;--fs-sm:.8125rem;--fs-base:.875rem;--fs-md:.9375rem;--fs-lg:1.1875rem;--fs-kpi:1.75rem;--fs-hero:2.125rem}

  /* Unstyled <small> fell back to the browser's "smaller" (11.25 px); inside large figures it stays relative. */
  :where(small){font-size:max(var(--fs-xs),.8em)}

  /* Labels that were 10-11 px. The tab bar label is capped so five tabs still fit at large text sizes. */
  body.session-app > .tabbar button{font-size:min(.75rem,15px)}
  .scopes button em,.lp-tabs button em,.heat .dn,.time .ampm{font-size:.75rem}
  table.tbl thead th,.ttbl td small,.pchip,.prospect-page .data-import-steps li{font-size:var(--fs-xs)}
  .page[data-page="tasks"] .who2,.page[data-page="tasks"] .tcard2,.page[data-page="leads"] .kpi small{font-size:var(--fs-xs)}
  /* Tag labels under lead names (9 px on a 15 px line) and the task drawer's quick-pick buttons (11 px, fixed 28 px tall). */
  .tdot i{font-size:var(--fs-xs);line-height:1.25}
  .qpick button{font-size:var(--fs-xs);height:auto;min-height:28px}

  /* Text that was fixed px at 12 px and above: same size at the default setting, now in rem. */
  .page[data-page="tasks"] .tdesc,.pg-head h1 .cnt,.report-workspace .report-controls label,
  .lv-assistant .assistant-chips button,.lv-assistant .assistant-note{font-size:.75rem}
  .lv-assistant .assistant-bubble{font-size:.875rem}
  .lv-assistant .assistant-heading h2{font-size:1rem}
  #layer .lp .lp-hero h3,#layer .modal header h3{font-size:1.0625rem}
  .kpi b{font-size:1.125rem}
  .crm-finance .kpi b{font-size:1.0625rem}
  .pg-head h1{font-size:1.25rem}
  .page[data-page="leads"] .kpi b,.page[data-page="tasks"] .tcard2 b{font-size:1.3125rem}
  /* The dashboard's "Next visit" value is sized by an inline style (index.html, #fNext). */
  #fNext{font-size:1.375rem!important}

  /* Controls with a fixed height grow with their text instead of letting it spill. Their phone touch minimum
     (index.html, 42 px at <=760 px) still applies, so the default size is unchanged. */
  .ghost,.btn-primary,.pg-head .pg-actions .ghost,.pg-head .pg-actions .btn-primary{height:auto}
  .seg2 button{height:auto;min-height:32px}
  /* The lead drawer's status button is sized by an inline style (pages.js, style="height:32px"). */
  #layer .lp .btn-primary[style*="height"]{height:auto!important}
  .prio button{height:auto;min-height:36px}

  /* Display text grows with the setting but stops before it crowds a phone screen. */
  .focus h1,.time{font-size:min(1.5rem,32px)}
  .shift .big-t{font-size:min(2.5rem,48px)}
}