/* Phone layout for the practice page (v884). Only applies on narrow screens; desktop is untouched. */
@media (max-width:760px){
  .tp-nav a{min-height:40px;display:inline-flex;align-items:center;font-size:13px!important;padding:6px 12px!important}
  .tp-nav a:nth-child(n+3){display:inline-flex!important}
  header.tp-top{height:auto!important;min-height:0;flex-direction:row!important;align-items:center!important;flex-wrap:wrap;gap:8px 10px;padding:10px 14px}
  .tp-nav{flex:1 0 100%;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding-bottom:2px}
  .tp-nav a{flex:0 0 auto;white-space:nowrap}
  .tp-brand{font-size:22px}
  .practice-aside{gap:8px!important}
  .practice-aside .practice-stat{padding:10px 6px}
  .practice-aside .practice-stat small{font-size:12px!important;margin-bottom:6px}
  .practice-aside .practice-stat strong{font-size:24px}
  .practice-aside .practice-stat .tiny,.practice-aside .vertical-score{display:none}
  .practice-aside .tier{font-size:11px}
  .practice-aside .medal-line{font-size:11px;line-height:1.3}
  .practice-aside .ability-card{display:none}
  .practice-aside .soft-btn{min-height:40px;font-size:13px}
  .answer-label,.question-number{font-size:13px!important}
  body.practising .answer{min-height:84px!important;font-size:22px}
  body.practising .answer:has(svg),body.practising .answer:has(img){min-height:116px!important}
  body.practising .answers{gap:10px;grid-template-columns:repeat(auto-fit,minmax(130px,1fr))!important}
  .practice-layout button,.practice-layout .soft-btn,.practice-layout .primary{min-height:44px}
  .order-pool button,.order-output button{min-width:48px;min-height:48px;font-size:20px}
  .tuple-fields input,.answer-input,.fraction-input input{min-height:48px;font-size:22px}
  .related-link,.practice-tools button{min-height:40px;font-size:13px}
  .hour-label,.subtitle{font-size:13px}
  .related-list button,.practice-bread a{min-height:40px;font-size:13px;display:inline-flex;align-items:center}
  .practice-bread{line-height:1.6}
  body.practising .pk-answers{display:grid!important;grid-template-columns:1fr 1fr;gap:10px}
  body.practising .pk-answers .pk-answer{min-width:0;min-height:84px!important;width:auto!important}
  body.practising .pk-answers .pk-answer:last-child:nth-child(odd){grid-column:1/-1;justify-self:center;width:calc(50% - 5px)!important}
  body.practising .pk-answers.picture-answers .pk-answer{min-height:104px!important}
}

/* v1471: less scrolling on phones. The question comes first, the score boxes go below it,
   and the Submit button stays on screen while the child answers. */
@media (max-width:760px){
  .practice-layout,.english-prek-practice .practice-layout{display:flex!important;flex-direction:column}
  .practice-layout .practice-main{order:1}
  .practice-layout .practice-aside,.english-prek-practice .practice-aside{order:2!important;margin-top:14px}
  .practice-heading{margin-bottom:6px}
  .practice-tools{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:6px;padding-bottom:4px}
  .practice-tools button{flex:0 0 auto;white-space:nowrap}
  .question .submit-row{position:sticky;bottom:0;z-index:20;margin:12px -8px 0;padding:10px 8px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to bottom,rgba(255,255,255,0),#fff 28%);display:flex;flex-direction:column;align-items:center;gap:6px}
  .question .submit-row .primary{min-width:min(78%,300px)}
  .question .submit-row .quick-tap{font-size:13px}
  .prek-mode .question form:has(.pk-answers) .submit-row{display:flex!important}
}