/* KPI uses a compact mobile masthead; all other screens retain their shell. */
#kpi-menu-toggle { display: none; }
.kpi-shell .top { min-height: 64px; padding: 10px 0; margin-bottom: 16px; }
.kpi-shell #view-eyebrow { display: none; }

@media (max-width: 760px) {
  .kpi-shell .shell { display: block; }
  .kpi-shell .side {
    position: static; width: 100%; height: auto; min-height: 60px;
    padding: 8px 16px; display: grid; grid-template-columns: 1fr auto; align-items: center;
  }
  .kpi-shell .logo { padding: 0; gap: 10px; }
  .kpi-shell .logo-img { width: 42px; height: 42px; }
  .kpi-shell .logo-type { font-size: 16px; }
  .kpi-shell .logo-type small { display: none; }
  .kpi-shell #kpi-menu-toggle {
    display: inline-flex; align-items: center; justify-content: center; gap: 7px;
    min-width: 100px; min-height: 44px; padding: 8px;
    border: 1px solid #67715e; background: transparent; color: #fff;
    font: inherit; font-size: 13px; cursor: pointer;
  }
  .kpi-shell #kpi-menu-toggle:focus-visible { outline-color: #f6edb8; }
  .kpi-shell #kpi-menu-toggle:hover { background: #383e31; }
  .kpi-shell #nav, .kpi-shell #side-account { display: none; }
  .kpi-shell.kpi-menu-open #nav {
    display: grid; grid-column: 1 / -1; grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 12px 0 0; gap: 4px;
  }
  .kpi-shell #nav .nav-group-label { display: none; }
  .kpi-shell #nav button { min-height: 44px; padding: 10px 12px; font-size: 13px; }
  .kpi-shell.kpi-menu-open #side-account {
    display: flex; grid-column: 1 / -1; flex-wrap: wrap; align-items: center;
    margin-top: 12px; padding: 12px 0 4px; gap: 8px 12px;
  }
  .kpi-shell #side-account #btn-logout { min-height: 44px; margin-left: auto; }
  .kpi-shell .main { padding: 0 16px 32px; }
  .kpi-shell .top { flex-direction: row; align-items: center; gap: 12px; }
  .kpi-shell .top h1 { font-size: 23px; }
  .kpi-shell #global-search { min-width: 44px; min-height: 44px; justify-content: center; }
}