/* ============================================================
   Mobile = exact desktop layout scaled down.
   No hamburger, no stacking, no responsive reflow.
   ui.js sets body zoom to viewportWidth / 1440 for <= 600px.
   ============================================================ */

@media (max-width:600px){
  html{
    overflow-x:hidden !important;
    min-width:0 !important;
  }

  body.desktop-scaled-mobile{
    width:1440px !important;
    min-width:1440px !important;
    max-width:1440px !important;
    overflow-x:visible !important;
  }

  /* Undo responsive rules from the desktop stylesheets. */
  .nav{margin-left:72px !important}
  .nav a{padding:12px 14px !important;font-size:14px !important}
  .page{padding:28px !important}
  .grid-2{grid-template-columns:1fr 1fr !important}
  .kpi-grid{grid-template-columns:repeat(4,1fr) !important}
  .hero{grid-template-columns:1.1fr .9fr !important}
  .feature-grid{grid-template-columns:repeat(3,1fr) !important}
  .hero h1{font-size:64px !important}

  .dashboard-shell{grid-template-columns:258px 1fr !important}
  .provider-detail-head{grid-template-columns:250px minmax(430px,1.35fr) minmax(350px,1fr) !important}
  .console-grid{grid-template-columns:330px 1fr !important}

  .access-page{grid-template-columns:1.05fr .95fr !important}
  .admin-grid{grid-template-columns:1fr 1fr !important}
  .docs-layout{grid-template-columns:300px 1fr !important}
  .admin-shell{grid-template-columns:240px 1fr !important}
  .provider-checks{grid-template-columns:repeat(3,1fr) !important}
  .admin-kpis{grid-template-columns:repeat(4,1fr) !important}
  .detail-grid{grid-template-columns:1fr 1fr !important}
  .human-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}

  /*
   * Fixed glass layers need the logical pre-scale viewport height,
   * otherwise CSS zoom would make them shorter than the physical screen.
   */
  body.desktop-scaled-mobile .site-wallpaper,
  body.desktop-scaled-mobile .liquid-scene,
  body.desktop-scaled-mobile .glass-modal-backdrop,
  body.desktop-scaled-mobile .admin-login-backdrop{
    width:1440px !important;
    height:var(--mobile-unscaled-height) !important;
    min-height:var(--mobile-unscaled-height) !important;
  }

  body.desktop-scaled-mobile .glass-modal-backdrop,
  body.desktop-scaled-mobile .admin-login-backdrop{
    inset:0 auto auto 0 !important;
  }

  body.desktop-scaled-mobile .glass-modal{
    width:520px !important;
    max-width:520px !important;
  }

  body.desktop-scaled-mobile .login-card{
    width:440px !important;
    max-width:440px !important;
  }
}