/* ===== Deutsch Lernen — mobile.css (v5.1): all phones polish ===== */
.hdr-stats { display:inline-flex; align-items:center; gap:.3rem; }
.brand .flag { width:24px; height:16px; }
.ad-slot.ad-empty { display:none; }
#mobile-menu { box-shadow:0 20px 40px -20px rgba(0,0,0,.8); }
#mobile-menu .nav-link { padding:.6rem .75rem; border-radius:.75rem; }
input, select, textarea { font-size:16px; } /* prevent iOS zoom */
.lesson-card:active, .feature-card:active, .q-opt:active, .btn-primary:active, .btn-ghost:active { transform:scale(.98); }

@media (max-width:639px){
  .brand { font-size:1rem; }
  .brand .flag { width:22px; height:15px; }
  .streak-badge, .xp-badge { font-size:.68rem; padding:.15rem .4rem; }
  #site-header nav { height:52px; }
  #main-content { padding-bottom:calc(84px + env(safe-area-inset-bottom)); }
  #site-footer { padding-bottom:calc(70px + env(safe-area-inset-bottom)); }
  #site-footer .flex { flex-direction:column; gap:.5rem; text-align:center; }
  #site-footer .flex > div { flex-wrap:wrap; justify-content:center; }
  .hero .stat { padding:.55rem .25rem; } .hero .stat b { font-size:1.15rem; } .hero .stat span { font-size:.68rem; }
  .hero .btn-primary, .hero .btn-ghost { padding:.75rem .6rem; font-size:.95rem; }
  .gradient-card h2 { font-size:1.6rem !important; }
  #features { gap:.5rem; }
  .feature-card { min-height:112px; }
  .de-text { overflow-wrap:anywhere; }
  .word-row .de-text { font-size:1.05rem; }
  .overflow-x-auto { -webkit-overflow-scrolling:touch; scrollbar-width:thin; }
  #fb-open { width:40px; height:40px; left:.6rem; opacity:.85; transition:opacity .25s, bottom .2s; }
  .toast { bottom:calc(88px + env(safe-area-inset-bottom)); }
  body:has(.ad-sticky) .toast { bottom:calc(165px + env(safe-area-inset-bottom)); }
  .q-opt { min-height:52px; }
  .artikel-btn { font-size:1.3rem; padding:.9rem; }
  .match-tile { min-height:54px; font-size:.95rem; }
  #fc-de, #rv-de { font-size:1.75rem !important; }
  .bubble { max-width:96%; padding:.7rem .8rem; }
  main > nav.text-sm { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  #install-banner { bottom:calc(66px + env(safe-area-inset-bottom)); }
}
/* very small phones (320-374px) */
@media (max-width:374px){
  html { font-size:14px; }
  .brand span:not(.flag) { font-size:.95rem; }
  .hdr-stats .xp-badge { display:none; }
  .hero h1 { font-size:1.45rem !important; }
  .lesson-card { padding:.65rem; } .lesson-card h3 { font-size:.85rem; }
  .mnav { font-size:9.5px; } .mnav i { font-size:1.05rem; } .mnav-fab { width:42px; height:42px; font-size:1.1rem; }
  .stat b { font-size:1.05rem; }
}
/* large phones (414px+) */
@media (min-width:414px) and (max-width:639px){
  html { font-size:16px; }
  .hero h1 { font-size:1.9rem !important; }
}
/* landscape phones */
@media (max-height:480px) and (orientation:landscape){
  #mobile-nav, #fb-open, #install-banner { display:none; }
  #main-content { padding-bottom:1.5rem; }
  .flashcard { height:220px; }
}
/* standalone PWA */
@media (display-mode: standalone){
  #site-header { padding-top:env(safe-area-inset-top); }
  body { overscroll-behavior-y:none; }
}