/* Keep study typography proportional without scaling images or controls. */
.app:has(.quiz-top) > .question,
.app:has(.quiz-top) .review-body .question,
.app:has(.result-banner) .review-body .question,
.app:has(.history-result) .review-body .question{font-size:calc(19px * var(--study-zoom,1));line-height:1.58}
.app:has(.quiz-top) .option > span,
.app:has(.quiz-top) .explanation,
.app:has(.quiz-top) .wrong-reason,
.app .review-body .option > span,
.app .review-body .explanation,
.app .flash-card .flash-front,
.app .flash-card .flash-back{font-size:calc(16px * var(--study-zoom,1));line-height:1.55}
.app .flash-card .flash-front,.app .flash-card .flash-back{font-size:calc(20px * var(--study-zoom,1))}
.app .flash-card .flash-extra,.app .flash-card .flash-source>div{font-size:calc(16px * var(--study-zoom,1))}
.app :is(.question,.option,.explanation,.review-body,.flash-card) :is(img,video,svg){max-width:100%;height:auto}