/* ═══════════════════════════════════════════════════════════
   mobile.css — règles @media pour les écrans étroits
   Les breakpoints à 768px sont historiques (V1), celui à 900px
   correspond à la grille reskin V6. Certaines media queries
   inline locales sont conservées dans dashboard.css /
   landing-quiz.css / hero-pillar.css — ce fichier regroupe
   uniquement les blocs purement mobile-only.
   Dépend de base.css.
   ═══════════════════════════════════════════════════════════ */

/* ─── mobile V1 — défauts mobile-banner/mobile-dash + bascule 768px ─── */
/* ══ MOBILE ══ */
.mobile-banner{display:none}
.mobile-dash{display:none}
@media(max-width:768px){
  .dash-app{display:none!important}
  .mobile-dash{display:block!important;padding:1.5rem;max-width:480px;margin:0 auto}
}

/* ─── mobile V1 — vue dashboard en colonne + intro-grid 768px ─── */
/* ── MOBILE ── */
@media(max-width:768px){
  .dash-app{display:none!important}
  .mobile-dash{display:block!important}
  .intro-grid{grid-template-columns:1fr}
}

/* ─── mobile V6 — grid reskin 900px (sidebars cachées, dash-scroll padding, topbar) ─── */
/* ═══ MOBILE ═══ */
@media(max-width:900px){
  .dash-app,.dash-app.has-rp{grid-template-columns:1fr!important;height:auto!important}
  .dash-app .dl,.dash-app .dr{display:none!important}
  .dash-scroll{padding:1rem!important}
  .rs-topbar{padding:.9rem 1rem}
}