/* 2026-10-13: common staff shell, including the installed iPhone viewport. */
@media (max-width:767px) {
  html:has(#app.visible) {background:#eaf0f2;}
  html:has(#app.visible) body {min-height:100%;background:var(--bg);}
  html body #app.visible {position:fixed;inset:0;width:100%;max-width:none;height:auto;min-height:0;margin:0;overflow:hidden;}
  html body #app .app-body {height:100%;min-height:0;}
  html body {--fs-staff-nav-height:48px;--fs-staff-nav-safe:max(10px,calc(var(--safe-bottom,0px) - 26px));}
  html body #app #bottom-nav {position:absolute!important;inset:auto 0 0!important;margin:0!important;transform:none!important;padding:0 0 var(--fs-staff-nav-safe)!important;}
  html body #app #bottom-nav .nav-item {height:var(--fs-staff-nav-height)!important;min-height:var(--fs-staff-nav-height)!important;padding:3px 2px 0!important;gap:3px!important;justify-content:flex-end!important;}
  html body #app #main-content {min-height:0;padding-bottom:calc(var(--fs-staff-nav-height) + var(--fs-staff-nav-safe) + 20px)!important;scroll-padding-bottom:calc(var(--fs-staff-nav-height) + var(--fs-staff-nav-safe) + 20px);}
  /* Fill the extended iOS standalone canvas instead of the shorter dynamic viewport. */
  @supports (-webkit-touch-callout:none) {
    html:has(#app.visible),html:has(#app.visible) body.pwa {height:100vh;height:100lvh;}
    html body.pwa #app.visible {position:absolute;height:100%;}
  }
  html:has(#app):has(.fs-staff-boot:not([hidden])),html:has(#app):has(.fs-staff-boot:not([hidden])) body {background:#132f3d;}
  .fs-staff-boot {isolation:isolate;min-height:100%;}
  .fs-staff-boot::before {content:'';position:absolute;inset:0 0 calc(-1 * (env(safe-area-inset-bottom,0px) + 20px));background:inherit;z-index:-1;pointer-events:none;}
}

.fs-student-filters{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin-bottom:18px}.fs-student-filters>div{min-width:200px}.fs-student-filters label{display:grid;gap:5px;font-size:12px;color:var(--muted);min-width:130px}.fs-student-filters #students-filter-count{padding:12px 0;font-size:12px;white-space:nowrap}@media(max-width:767px){.fs-student-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px}.fs-student-filters>div{grid-column:1/-1;min-width:0}.fs-student-filters label{min-width:0}}

html body.admin-redesign .sidebar-logo-img{width:60px;height:70px;flex-shrink:0}html body.admin-redesign .ad-more-head::before{width:53px;height:60px;flex:0 0 53px;margin-right:12px}html body.admin-redesign .ad-more-head>div{min-width:0}html body.admin-redesign .ad-more-head .ad-eyebrow{display:block;line-height:1.6;letter-spacing:.08em;overflow-wrap:break-word}

/* Keep the fixed footer flush with the viewport in both staff roles. */
@media(max-width:767px){html body #app #bottom-nav{position:fixed!important;bottom:0!important;height:calc(var(--fs-staff-nav-height) + var(--fs-staff-nav-safe));box-sizing:border-box}html body #app #bottom-nav .nav-item svg{flex:0 0 22px;width:22px;height:22px}html body #app #bottom-nav .nav-item span{line-height:14px;font-size:10px}html body #app #bottom-nav .nav-item[hidden]{display:none!important}}

/* A small lift protects curved phone corners; the backing reaches the physical edge. */
@media(max-width:767px){html body #app #bottom-nav{padding-left:max(8px,env(safe-area-inset-left,0px))!important;padding-right:max(8px,env(safe-area-inset-right,0px))!important;background:#102c38!important;border-top:1px solid #d9bf8738!important;box-shadow:0 -4px 16px #102c381a;color:#c5d3d7}html body #app #bottom-nav .nav-item{color:#c5d3d7!important;background:transparent!important}html body #app #bottom-nav .nav-item.active{color:#e5ce98!important}html body #app #bottom-nav .nav-item.active::before{background:#d9bf87!important}}