/* Mobile-first premium layer — 90% users on phone */
:root{
  --tabbar-h:68px;
  --safe-bottom:env(safe-area-inset-bottom,0px);
}

.header-row{display:flex;align-items:center;gap:12px;min-height:64px}
.header-mobile-actions{display:none;align-items:center;gap:8px;margin-left:auto}
.desk-only{display:inline-flex}

/* Bottom tab bar */
.mobile-tabbar{display:none}

body{
  padding-bottom:0;
}

@media (max-width:900px){
  .topstrip{font-size:11px}
  .topstrip-left{display:none}

  .header-mobile-actions{display:flex}
  .desk-only{display:none!important}
  .burger{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(8,121,209,.08);font-size:18px}

  .site-header .container.header-row{flex-wrap:wrap;padding:8px 0}
  .nav{
    display:none;width:100%;flex-direction:column;align-items:stretch;gap:4px;
    padding:8px 0 14px;border-top:1px solid var(--line);margin-top:4px;
  }
  body.nav-open .nav{display:flex}
  .nav a{padding:12px 14px;border-radius:12px;font-size:15px}
  .nav-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px}
  .nav-actions .btn{width:100%;justify-content:center}

  /* Bottom tabs */
  .mobile-tabbar{
    display:grid;grid-template-columns:repeat(5,1fr);gap:0;
    position:fixed;left:0;right:0;bottom:0;z-index:90;
    height:calc(var(--tabbar-h) + var(--safe-bottom));
    padding:8px 6px calc(8px + var(--safe-bottom));
    background:rgba(255,255,255,.94);backdrop-filter:blur(16px);
    border-top:1px solid var(--line);
    box-shadow:0 -10px 30px rgba(7,26,43,.08);
  }
  .mobile-tabbar a{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    color:var(--muted);font-weight:700;font-size:11px;border-radius:12px;min-height:48px;
  }
  .mobile-tabbar a i{font-style:normal;font-size:18px;line-height:1;opacity:.9}
  .mobile-tabbar a.active{color:var(--blue);background:rgba(8,121,209,.1)}
  body{padding-bottom:calc(var(--tabbar-h) + var(--safe-bottom) + 8px)}
  .toast-wrap{bottom:calc(var(--tabbar-h) + 12px)}

  .site-footer{padding-bottom:24px}
  .footer-grid{gap:18px}
}

@media (max-width:900px){
  .page-home .site-header-home .header-mobile-actions .icon-btn,
  .page-home .site-header-home .burger{
    background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.22);color:#fff;
  }
}
