/* التجاوب مع الأجهزة اللوحية والجوال */
@media (max-width: 1080px) {
  .stats { grid-template-columns: repeat(3, 1fr); }
  .stat-card--wide { grid-column: 1 / -1; }
}

@media (max-width: 900px) {
  .layout { grid-template-columns: 1fr; }
  .sidenav { display: none; }
  .view { padding: 20px 16px calc(96px + env(safe-area-inset-bottom)); }
  .bottomnav {
    display: grid; grid-template-columns: repeat(5, 1fr);
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 40;
    background: rgba(255, 255, 255, .97); backdrop-filter: blur(10px);
    border-top: 1px solid var(--line); padding: 6px 4px calc(6px + env(safe-area-inset-bottom));
  }
  .bottomnav__link { display: grid; justify-items: center; gap: 2px; padding: 6px 2px; border-radius: 12px; color: var(--muted-2); text-decoration: none; font-size: .72rem; font-weight: 700; min-height: 52px; align-content: center; }
  .bottomnav__link.is-active { color: var(--green-700); background: var(--green-50); }
  body.is-focus .bottomnav { display: none; }
  body.is-focus .view { padding-bottom: 32px; }
  .dash__grid { grid-template-columns: 1fr; }
  .quick { grid-template-columns: 1fr; }
  .topbar { padding: 0 16px; }
}

@media (max-width: 640px) {
  h1 { font-size: 1.45rem; }
  .card { padding: 18px 16px; }
  .hero-card { flex-direction: column-reverse; align-items: flex-start; padding: 22px 18px; }
  .hero-card h1 { font-size: 1.6rem; }
  .hero-card .mascot { align-self: center; }
  .hero-card .mascot svg { width: 104px; height: auto; }
  .hero-card .btn--lg { width: 100%; }
  .stats { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .stat-card { flex-direction: column; text-align: center; padding: 12px 6px; gap: 6px; }
  .stat-card--wide { text-align: start; padding: 14px; }
  .stat-card__icon { width: 36px; height: 36px; border-radius: 11px; }
  .stat-card span { font-size: .78rem; }
  .lesson-intro { flex-direction: column; text-align: center; }
  .lesson-intro .row { justify-content: center; }
  .pcard--big { padding: 20px 16px; }
  .pcard__en { flex-basis: 100%; }
  .quiz__en { font-size: 1.35rem; }
  .quiz__prompt { padding: 16px; }
  .quiz__instr { font-size: 1.12rem; }
  .result__stats { gap: 8px; }
  .toolbar { grid-template-columns: 1fr; }
  .story__done { flex-direction: column; align-items: center; text-align: center; }
  .bubble { max-width: 94%; }
  .topbar__chips { gap: 5px; }
  .chip-stat { padding: 5px 9px; font-size: .85rem; }
  .brand__ar { font-size: 1.15rem; }
  .onb__card { padding: 22px 16px; }
  .choices { grid-template-columns: 1fr; }
  .learn__nav { flex-direction: column-reverse; }
  .learn__nav .btn { width: 100%; }
  .row--center .btn { flex: 1 1 auto; }
  .dict__toggle { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 380px) {
  .stats { grid-template-columns: 1fr 1fr; }
  .bottomnav__link { font-size: .66rem; }
}
