/* Bigger, easier-to-read activity cards (Learning Gem) */
[data-testid^="card-activity-"] > div{padding:22px 22px 18px!important}
[data-testid^="card-activity-"] > div > div:first-child > div:first-child{width:76px!important;height:76px!important;border-radius:20px!important}
[data-testid^="card-activity-"] > div > div:first-child > div:first-child > span{font-size:46px!important;line-height:1!important}
[data-testid^="card-activity-"] > div > div:first-child span[class*="rounded-full"]{font-size:14px!important;padding:6px 12px!important;gap:6px!important}
[data-testid^="card-activity-"] > div > div:first-child span[class*="rounded-full"] svg{width:17px!important;height:17px!important}
[data-testid^="card-activity-"] h3{font-size:23px!important;line-height:1.2!important;margin-top:4px}
[data-testid^="card-activity-"] h3 + p{font-size:17px!important;line-height:1.4!important;margin-top:4px!important}
[data-testid^="card-activity-"] > div > div:last-child{padding-top:12px!important}
[data-testid^="card-activity-"] > div > div:last-child > div{font-size:16px!important;gap:8px!important}
[data-testid^="card-activity-"] > div > div:last-child > div > div{width:9px!important;height:9px!important}
[data-testid^="card-activity-"] > div > div:last-child svg{width:22px!important;height:22px!important}
[data-testid^="card-activity-"] > div > div:last-child span{font-size:16px!important}
[data-testid^="card-activity-"] > div > div:first-child{gap:8px}
[data-testid^="card-activity-"] > div > div:first-child > div:first-child{flex-shrink:0}
[data-testid^="card-activity-"] > div > div:first-child span[class*="rounded-full"]{white-space:nowrap!important}
@media (min-width:640px) and (max-width:1100px){[data-testid^="card-activity-"] > div > div:first-child span[class*="rounded-full"]{font-size:13px!important;padding:5px 10px!important}}
/* Story Time buttons: two rows on phones so nothing is cut off */
@media (max-width:480px){
[data-testid="story-controls"]{display:grid!important;grid-template-columns:1fr 1fr;grid-template-areas:"read read" "back next";gap:10px!important;width:100%}
[data-testid="story-read"]{grid-area:read;display:flex!important;width:100%}
[data-testid="story-read"]>button{width:100%!important;min-height:52px!important;font-size:18px!important}
[data-testid="story-back"]{grid-area:back;width:100%!important;min-height:48px!important;font-size:17px!important}
[data-testid="story-next"]{grid-area:next;width:100%!important;min-height:48px!important;font-size:17px!important}
}
/* Story Time has its own Read Aloud button, so hide the floating one there */
body:has([data-testid="story-controls"]) #lg-read{display:none!important}
/* Hide the floating Read to me button while the story questions are open */
body.lg-sq-open #lg-read{display:none!important}
/* ---- Easier for young children: bigger text and 44px tap targets (Learning Gem) ---- */
/* Mascot speech bubble ("You've got this!") */
.min-w-[80px].max-w-[130px]{font-size:14px!important;max-width:150px!important;line-height:1.2!important}
/* "Question 1 of 5" and the gem count under the progress bar */
.flex.justify-between.text-xs.text-muted-foreground.mt-1{font-size:14px!important}
/* Very small labels anywhere */
.text-[9px],.text-[10px]{font-size:12px!important}
.text-[11px]{font-size:13px!important}
/* Memory cards: readable words, taller cards on phones */
[style*="container-type: inline-size"]>span[lang]{font-size:clamp(13px,14cqw,22px)!important}
@media (max-width:480px){.grid.grid-cols-3.max-w-md>.aspect-square{aspect-ratio:3/4!important}}
/* Speaker buttons next to questions */
[aria-label^="Listen to"]{min-width:44px!important;min-height:44px!important;flex-shrink:0!important}
/* Small icon buttons: phonics speakers, glossary speakers, story settings */
button.text-violet-400:not([class*="px-"]),button.p-1.rounded-full,button.p-1.5.rounded-lg{min-width:44px!important;min-height:44px!important;display:inline-flex!important;align-items:center;justify-content:center}
/* Writing Prompt: "Read prompt aloud" and "Show hint" */
button.text-[11px].text-violet-500,button.text-xs.font-semibold.text-amber-600{min-height:44px!important;font-size:15px!important;padding:0 6px!important}
/* Small standard buttons (Math Tools fractions, Parent certificates, Letter Tracing, Clear) */
button.h-8,button.h-9{min-height:44px!important}
/* Progress page "Start Learning" link */
button.text-primary.text-sm.font-semibold.mt-2{min-height:44px!important;padding:0 8px!important;display:inline-flex!important;align-items:center}
/* Creative Studio paint colors and tools */
button.w-7.h-7{width:40px!important;height:40px!important}
/* Word Search letters */
[style*="repeat(8, 1fr)"]>button{font-size:18px!important}
/* Keep the floating "Read to me" button from covering the last buttons on a page */
body:has(#lg-read) #root{padding-bottom:84px}
/* Hide it while the story questions are open */
body.lg-sq-open #lg-read{display:none!important}