/* Classroom typography. Font bytes belong to the school and are uploaded through WordPress. */
.ppl-app.ppl-type-custom {
  --ppl-learning-font: "PlayLab Teacher Font", "Trebuchet MS", system-ui, sans-serif;
}
.ppl-app.ppl-type-custom.ppl-font-area-learning :is(
  .ppl-equation,
  .ppl-answers button,
  .ppl-topic-qimage,
  .ppl-phon-letters .ppl-phon-letter,
  .ppl-cat-sentence,
  .ppl-cat-targetrow>div,
  .ppl-machine-fixed,
  .ppl-machine-slot,
  .ppl-machine-tile,
  .ppl-machine-resultword,
  .ppl-gesture-question,
  .ppl-gesture-options>div,
  .ppl-shapetop strong
) { font-family: var(--ppl-learning-font); }
/* Explicit fallback stays available per-glyph for missing math signs and symbols. */
.ppl-app.ppl-type-custom.ppl-font-area-learning .ppl-equation {font-weight:400;letter-spacing:0;overflow-wrap:anywhere;}
.ppl-app.ppl-type-custom.ppl-font-area-learning .ppl-phon-letter small {font-family:ui-rounded,"Trebuchet MS",system-ui,sans-serif;}
/* Scale only the learning material, not the controls or icons. */
.ppl-app.ppl-font-small .ppl-equation {font-size:clamp(26px,6vw,40px)}
.ppl-app.ppl-font-large .ppl-equation {font-size:clamp(34px,8vw,53px)}
.ppl-app.ppl-font-small .ppl-answers button {font-size:clamp(13px,2.8vw,20px)}
.ppl-app.ppl-font-medium .ppl-answers button {font-size:clamp(16px,3.2vw,25px)}
.ppl-app.ppl-font-large .ppl-answers button {font-size:clamp(19px,3.7vw,29px)}
.ppl-app.ppl-font-small .ppl-phon-letter {font-size:32px}
.ppl-app.ppl-font-large .ppl-phon-letter {font-size:43px}
.ppl-app.ppl-font-small :is(.ppl-machine-fixed,.ppl-machine-slot,.ppl-machine-tile){font-size:34px}
.ppl-app.ppl-font-large :is(.ppl-machine-fixed,.ppl-machine-slot,.ppl-machine-tile){font-size:48px}
.ppl-app.ppl-font-small .ppl-machine-resultword{font-size:23px}
.ppl-app.ppl-font-large .ppl-machine-resultword{font-size:31px}
.ppl-app.ppl-font-small .ppl-cat-sentence{font-size:15px}
.ppl-app.ppl-font-medium .ppl-cat-sentence{font-size:18px}
.ppl-app.ppl-font-large .ppl-cat-sentence{font-size:21px}
.ppl-app.ppl-font-small .ppl-gesture-question{font-size:32px}
.ppl-app.ppl-font-large .ppl-gesture-question{font-size:43px}
@media (max-width:360px){.ppl-app.ppl-font-large .ppl-machine-tile{font-size:39px}.ppl-app.ppl-font-large .ppl-answers button{font-size:19px}}

/* v1.8.2: independently selectable typography zones. All selectors stay inside
   the PlayLab app root; WordPress admin and the surrounding theme never change. */
.ppl-app.ppl-type-custom.ppl-font-area-headings :is(
  h1,h2,h3,h4,.ppl-brand strong,.ppl-cardbody b,.ppl-cardbody strong,
  .ppl-adv-nextcard strong,.ppl-adv-worldcopy strong,
  .ppl-adv-pathrow strong,.ppl-topic-tile strong,.ppl-gameheader strong
) {font-family:var(--ppl-learning-font)}
.ppl-app.ppl-type-custom.ppl-font-area-instructions :is(
  p,.ppl-entry-note,.ppl-carddesc,.ppl-cardstatus,.ppl-gamehint,
  .ppl-shape-instruction,.ppl-extra-status,.ppl-news-banner-items,
  .ppl-adv-worldcopy small,.ppl-adv-nextcard small
) {font-family:var(--ppl-learning-font)}
.ppl-app.ppl-type-custom.ppl-font-area-buttons :is(
  button,.ppl-button,input[type=button],input[type=submit],select
) {font-family:var(--ppl-learning-font)}
.ppl-app.ppl-type-custom.ppl-font-area-navigation :is(
  .ppl-app-nav,.ppl-app-nav *,
  .ppl-toolbar,.ppl-toolbar *,
  .ppl-adv-journeyhead,.ppl-adv-journeyhead *
) {font-family:var(--ppl-learning-font)}
/* Whole-app mode overrides the root's legacy !important default font. Specific
   per-game styles still set sizes and weights independently. */
.ppl-app.ppl-type-custom.ppl-font-area-all,
.ppl-app.ppl-type-custom.ppl-font-area-all :is(*,button,input,select,textarea) {
  font-family:var(--ppl-learning-font) !important;
}
/* Accessibility: keep the existing font-size controls for lesson text only. */