/* ==========================================================
 * MOYAMOVA 1.12.53 — Mobile Statistics shell
 * Same top-level mobile chrome as Words / Articles / Prepositions:
 * no legacy app header/footer, compact Home / title / menu row.
 * Statistics content and rendering are untouched.
 * ========================================================== */
@media(max-width:899px){
  html[data-mobile-shell="stats"]{
    --footer-h-actual:0px;
  }

  /* Statistics is a full mobile page, like the trainers. */
  html[data-mobile-shell="stats"] .header,
  html[data-mobile-shell="stats"] .app-footer,
  html:has(#app .stats-card) .header,
  html:has(#app .stats-card) .app-footer{
    display:none!important;
  }

  html[data-mobile-shell="stats"] #app.content{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    height:auto!important;
    min-height:var(--mobile-viewport-height,100dvh)!important;
    padding:
      max(8px,var(--mobile-safe-top,0px))
      max(10px,var(--mobile-safe-right,0px))
      calc(18px + var(--mobile-safe-bottom,0px))
      max(10px,var(--mobile-safe-left,0px))!important;
    overflow:visible!important;
    box-sizing:border-box;
  }

  .mobile-stats-bar{
    width:100%;
    max-width:560px;
    margin:0 auto 10px;
    display:grid;
    grid-template-columns:auto minmax(0,1fr) 44px;
    align-items:center;
    gap:8px;
    min-height:52px;
  }

  .mobile-stats-back{
    min-width:0;
    height:44px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    justify-self:start;
    padding:0 12px 0 10px;
    border:1px solid rgba(69,88,165,.12);
    border-radius:14px;
    background:rgba(255,255,255,.78);
    color:inherit;
    box-shadow:0 5px 18px rgba(44,55,112,.06);
    font:inherit;
    font-size:12px;
    font-weight:750;
  }

  .mobile-stats-back__arrow{font-size:20px;line-height:1;transform:translateY(-1px)}

  .mobile-stats-bar__spacer{min-width:0}

  .mobile-stats-menu{
    width:44px;
    height:44px;
    display:grid;
    place-items:center;
    border:1px solid rgba(69,88,165,.12);
    border-radius:14px;
    background:rgba(255,255,255,.78);
    color:inherit;
    box-shadow:0 5px 18px rgba(44,55,112,.06);
    font:inherit;
    font-size:18px;
    font-weight:800;
    letter-spacing:1px;
  }

  /* Statistics title belongs to the content header together with language flags. */
  html[data-mobile-shell="stats"] .stats-card>.dicts-header{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
  }
  html[data-mobile-shell="stats"] .stats-card>.dicts-header h3{
    display:block!important;
    margin:0!important;
    min-width:0;
    text-align:left;
  }
  html[data-mobile-shell="stats"] .stats-card>.dicts-header .dicts-flags{
    margin-left:auto!important;
    flex:0 0 auto;
  }

  html[data-theme="dark"][data-mobile-shell="stats"] .mobile-stats-back,
  html.dark[data-mobile-shell="stats"] .mobile-stats-back{
    background:rgba(16,30,44,.88);
    border-color:rgba(132,159,192,.16);
    box-shadow:none;
  }
}