/* ============================================================
   Mobile app shell — Parent & Teacher apps
   ============================================================ */
body.mshell{
  background:var(--gray-100);
}
.mframe{
  max-width:430px;margin:0 auto;min-height:100vh;background:var(--bg);position:relative;
  box-shadow:0 0 40px rgba(0,0,0,.08);
}
@media (min-width:431px){
  body.mshell{padding:24px 0;}
  .mframe{min-height:calc(100vh - 48px);border-radius:28px;overflow:hidden;}
}

/* Topbar */
.m-topbar{
  position:sticky;top:0;z-index:80;background:var(--surface);border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:var(--sp-3);padding:14px var(--sp-4);
}
.m-topbar h1{font-size:var(--fs-lg);font-weight:800;flex:1;}
.m-topbar .tb-back{font-size:20px;cursor:pointer;color:var(--text);background:none;border:none;padding:2px;}
.m-topbar .tb-action{font-size:19px;cursor:pointer;color:var(--text-muted);background:none;border:none;position:relative;}
.tb-dot{position:absolute;top:2px;right:2px;width:8px;height:8px;border-radius:50%;background:var(--danger);border:1.5px solid var(--surface);}

/* Hero/brand topbar (dashboard-style, no back button) */
.m-hero{
  background:linear-gradient(135deg,var(--accent),var(--accent-dark));color:#fff;
  padding:var(--sp-5) var(--sp-4) var(--sp-7);border-radius:0 0 24px 24px;
}
.m-hero .hero-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--sp-4);}
.m-hero .hero-greeting{font-size:var(--fs-sm);opacity:.85;}
.m-hero .hero-name{font-size:var(--fs-xl);font-weight:800;}
.m-hero .hero-icon{
  width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;
  justify-content:center;font-size:17px;cursor:pointer;position:relative;
}

/* Content area */
.m-content{padding:var(--sp-4);padding-bottom:96px;}
.m-content.pulled-up{margin-top:-40px;}

/* Bottom nav */
.bottom-nav{
  position:fixed;left:0;right:0;bottom:0;max-width:430px;margin:0 auto;background:var(--surface);
  border-top:1px solid var(--border);display:flex;z-index:90;padding-bottom:env(safe-area-inset-bottom);
}
@media (min-width:431px){.bottom-nav{border-radius:0 0 28px 28px;}}
.bn-item{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:10px 4px 8px;
  color:var(--text-faint);cursor:pointer;font-size:var(--fs-xs);font-weight:600;
}
.bn-item .bn-icon{font-size:19px;}
.bn-item.active{color:var(--accent);}

/* Child/class switcher chip in hero */
.switcher{
  display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.16);border-radius:var(--r-full);
  padding:6px 12px 6px 6px;width:fit-content;cursor:pointer;font-size:var(--fs-sm);font-weight:700;
}
.switcher .avatar{width:26px;height:26px;font-size:var(--fs-xs);background:#fff;color:var(--accent-dark);}

/* Quick action grid on dashboards */
.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--sp-3);text-align:center;}
.quick-item{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;}
.quick-item .qi-icon{
  width:50px;height:50px;border-radius:var(--r-lg);background:var(--surface);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;font-size:20px;box-shadow:var(--shadow-sm);
}
.quick-item span{font-size:var(--fs-xs);font-weight:600;color:var(--text-muted);}